via doublemule.com
Posted via web from Expand Social Media
Mostrando entradas con la etiqueta wordpress. Mostrar todas las entradas
Mostrando entradas con la etiqueta wordpress. Mostrar todas las entradas
martes, 8 de junio de 2010
lunes, 7 de junio de 2010
Thesis Theme SEO Guide
via themethesis.com
Posted via web from Expand Social Media
Posted via web from Expand Social Media
Lorem Ipsum Test Post Pack
via thinkdesignblog.com Posted via web from Expand Social Media
miércoles, 2 de junio de 2010
10 WordPress dashboard hacks
The dashboard is a very important part of a WordPress blog. In fact, it allows you to control your posts, your blog design, and many more things. When building a site for a client, it is especially important to be able to control WP's dashboard. In this article, let's have a look at 10 extremely useful hacks for WordPress' dashboard
via catswhocode.com
via catswhocode.com
Etiquetas:
blog design,
wordpress,
wordpress dashboard,
wordpress hack,
wordpress loop
viernes, 28 de mayo de 2010
wp-e-commerce upload adding images to CSV upload
We've covered uploading multiple categories in wp-e-commerce, but what about images?
It stands to reason that if you are uploading a bunch of products, you will want images to accompany them. This takes a little more work than adding multiple categories, but is significantly easier than adding them one-by-one.
1. Preparing the Images
If you are happy doing bulk resizing/cropping in whichever graphics package you use, then do it! Process your product images so that you have a thumbnail that matches the size defined in your wp-e-commerce installation (96px X 96px is the current default).
Next process your source images again so that you have a large image that is either a manageable size, or sized to your wp-e-commerce product image size settings (128px X 128px is the current default). Once you have thumbnails and full-size images, upload the thumbnails to "wp-content/uploads/wpsc/product_images/thumbnails/" and the full-size to "wp-content/uploads/wpsc/product_images/". You can now move onto step 2 "Importing".
If you aren't happy batch-processing images you can create a directory called "'wp-content/uploads/wpsc/product_images/temp" and upload all your product images there. Please ensure that the images are at a manageable size (i.e. less than 1000px wide or high).
Next download and save a copy of the "imgprocess.php" script we cobbled together (remove the XXX from the extension) - n.b. this script is largely based on a great function here
Adjust the thumbnail size variables ($thumbwidth and $thumbheight) on lines 3-4 to correspond with the thumbnail sizes specified in wp-e-commerce (default is 96px X 96px). If you want your large images processed as well then add the relevant dimensions to the $largewidth and $largeheight variables on lines 6 and 7. Alternatively, leave them at 0 if you don't want to resize your large images. Please note that this is a basic script so it only crops images to the exact sizes specified. If you want your large images to be scaled, you will have to add that functionality yourself.
Once you have made your adjustments, upload the script to the root of your WordPress installation (in most cases yoursite.com/imgprocess.php). Please note that this script has not been extensively tested, and you run it very much at your own risk. We highly recommend running it in a test environment first and take no responsibility for anything (from server failure to hives or plagues of locusts) that occurs from the moment you run it!!
If you chose to continue, run the script by entering the location into your browser (in most cases yoursite.com/imgprocess.php). The script will take a while to execute, but all being well you will see a big ugly message saying "Images processed". Your thumbnails directory should now be populated with the thumbnails you created.
If you chose not to resize the large images then simply copy the images from "wp-content/uploads/wpsc/product_images/temp" to "wp-content/uploads/wpsc/product_images". Otherwise, your resized large images should be in wp-content/uploads/wpsc/product_images/'.
Next delete "wp-content/uploads/wpsc/product_images/temp" and delete imgprocess.php.
2. Importing
Open wp-e-commerce/wpsc-admin/includes/settings-pages/import.php
locate the option list:
Product Name
Description
...etc
and add the following option value:
Image
Next locate the line
$existing_name = get_product_meta($id, 'url_name');
and add the following above it so it reads:
$image_query = "INSERT INTO `".WPSC_TABLE_PRODUCT_IMAGES."` (product_id,image ) VALUES ('$id','".$cvs_data2."')";
$wpdb query($image_query);
$imageid = $wpdb get_var("SELECT LAST_INSERT_ID() as id FROM `".WPSC_TABLE_PRODUCT_IMAGES."`");
//now add image id to product
$image_query2 = "UPDATE `".WPSC_TABLE_PRODUCT_LIST."` SET image = ".$imageid." WHERE id=".$id;
$wpdb query($image_query2);
$existing_name = get_product_meta($id, 'url_name');
Now add a column to your product list csv that you wish to upload and add the name of each image uploaded to the relevant image
e.g.
SKU, Name, Price, Image
001, Shoe, 100, shoe.jpg
002, Hat, 20, hat.jpg
Upload the csv as normal remembering to assign 'Image' to the relevant column, and your products should now be loaded complete with images.
It stands to reason that if you are uploading a bunch of products, you will want images to accompany them. This takes a little more work than adding multiple categories, but is significantly easier than adding them one-by-one.
1. Preparing the Images
If you are happy doing bulk resizing/cropping in whichever graphics package you use, then do it! Process your product images so that you have a thumbnail that matches the size defined in your wp-e-commerce installation (96px X 96px is the current default).
Next process your source images again so that you have a large image that is either a manageable size, or sized to your wp-e-commerce product image size settings (128px X 128px is the current default). Once you have thumbnails and full-size images, upload the thumbnails to "wp-content/uploads/wpsc/product_images/thumbnails/" and the full-size to "wp-content/uploads/wpsc/product_images/". You can now move onto step 2 "Importing".
If you aren't happy batch-processing images you can create a directory called "'wp-content/uploads/wpsc/product_images/temp" and upload all your product images there. Please ensure that the images are at a manageable size (i.e. less than 1000px wide or high).
Next download and save a copy of the "imgprocess.php" script we cobbled together (remove the XXX from the extension) - n.b. this script is largely based on a great function here
Adjust the thumbnail size variables ($thumbwidth and $thumbheight) on lines 3-4 to correspond with the thumbnail sizes specified in wp-e-commerce (default is 96px X 96px). If you want your large images processed as well then add the relevant dimensions to the $largewidth and $largeheight variables on lines 6 and 7. Alternatively, leave them at 0 if you don't want to resize your large images. Please note that this is a basic script so it only crops images to the exact sizes specified. If you want your large images to be scaled, you will have to add that functionality yourself.
Once you have made your adjustments, upload the script to the root of your WordPress installation (in most cases yoursite.com/imgprocess.php). Please note that this script has not been extensively tested, and you run it very much at your own risk. We highly recommend running it in a test environment first and take no responsibility for anything (from server failure to hives or plagues of locusts) that occurs from the moment you run it!!
If you chose to continue, run the script by entering the location into your browser (in most cases yoursite.com/imgprocess.php). The script will take a while to execute, but all being well you will see a big ugly message saying "Images processed". Your thumbnails directory should now be populated with the thumbnails you created.
If you chose not to resize the large images then simply copy the images from "wp-content/uploads/wpsc/product_images/temp" to "wp-content/uploads/wpsc/product_images". Otherwise, your resized large images should be in wp-content/uploads/wpsc/product_images/'.
Next delete "wp-content/uploads/wpsc/product_images/temp" and delete imgprocess.php.
2. Importing
Open wp-e-commerce/wpsc-admin/includes/settings-pages/import.php
locate the option list:
Product Name
Description
...etc
and add the following option value:
Image
Next locate the line
$existing_name = get_product_meta($id, 'url_name');
and add the following above it so it reads:
$image_query = "INSERT INTO `".WPSC_TABLE_PRODUCT_IMAGES."` (product_id,image ) VALUES ('$id','".$cvs_data2."')";
$wpdb query($image_query);
$imageid = $wpdb get_var("SELECT LAST_INSERT_ID() as id FROM `".WPSC_TABLE_PRODUCT_IMAGES."`");
//now add image id to product
$image_query2 = "UPDATE `".WPSC_TABLE_PRODUCT_LIST."` SET image = ".$imageid." WHERE id=".$id;
$wpdb query($image_query2);
$existing_name = get_product_meta($id, 'url_name');
Now add a column to your product list csv that you wish to upload and add the name of each image uploaded to the relevant image
e.g.
SKU, Name, Price, Image
001, Shoe, 100, shoe.jpg
002, Hat, 20, hat.jpg
Upload the csv as normal remembering to assign 'Image' to the relevant column, and your products should now be loaded complete with images.
viernes, 21 de mayo de 2010
new Thesis samples
I have 4 sample Thesis layouts prepared. I have utilized many different customization techniques throughout each one. You'll see (if you're in Firefox, Safari or Chrome) rounded corners and special typography. Microsoft is promising that Internet Explorer 9 will support these functions.
If the titles confuse, they are numbered in German, Dutch, Spanish and French respectively. Rabbit breeds are also in the title and rabbits photos in the image rotator. We're rabbit breeders, what can I say?
Sample Page One
Sample Page Two
Sample Page Three
Sample Page Four
All of these samples can be customized further with your colors and fonts. The possibilities are endless!
If the titles confuse, they are numbered in German, Dutch, Spanish and French respectively. Rabbit breeds are also in the title and rabbits photos in the image rotator. We're rabbit breeders, what can I say?
Sample Page One
Sample Page Two
Sample Page Three
Sample Page Four
All of these samples can be customized further with your colors and fonts. The possibilities are endless!
miércoles, 19 de mayo de 2010
wp-e-commerce upload adding multiple categories to CSV upload
How to bulk upload to more than one category with the excellent Wp-e-commerce plugin.
In our case, we needed to assign each product to a category and a brand (e.g. Category: Jeans, Brand: Levis). To do this, we removed the bulk 'add to category' dropdown from the bottom of the import page and added a category and brand option to the dropdowns that are used to assign columns in the uploaded .csv file. Here's how...
Open wp-e-commerce/wpsc-admin/includes/settings-pages/import.php
As we are going to assign each item to its own category and brand, the category dropdown at the bottom of the upload page is no longer relevant. So, we remove lines 77 - 85:
Please select a category you would like to place all products from this CSV into:
'.$category.'';
}
Next we add the category and brand options to the dropdown list of assignable fields.
lines 61 - 69 show:
Product Name
Description
Additional Description
Price
SKU
Weight
Weight Unit
Stock Quantity
Stock Quantity Limit
We are going to add to these so we now have:
Product Name
Description
Additional Description
Price
SKU
Weight
Weight Unit
Stock Quantity
Stock Quantity Limit
Category
Brand
now we change (what is now) line 122 - 123 to read:
$category_query = "INSERT INTO `".WPSC_TABLE_ITEM_CATEGORY_ASSOC."` VALUES ('','$id','".$cvs_data2."')";
$wpdb query($category_query);
and add the following two lines underneath:
$brand_query = "INSERT INTO `".WPSC_TABLE_ITEM_CATEGORY_ASSOC."` VALUES ('','$id','".$cvs_data2."')";
$wpdb query($brand_query);
This is simply adding the category and brand id to the WPSC_TABLE_ITEM_CATEGORY_ASSOC table.
Remember to add the Category IDs to your csv file and NOT the category name. Alternatively you could extend this tutorial by looking up the Category ID using the Category Name and inserting that.
In our case, we needed to assign each product to a category and a brand (e.g. Category: Jeans, Brand: Levis). To do this, we removed the bulk 'add to category' dropdown from the bottom of the import page and added a category and brand option to the dropdowns that are used to assign columns in the uploaded .csv file. Here's how...
Open wp-e-commerce/wpsc-admin/includes/settings-pages/import.php
As we are going to assign each item to its own category and brand, the category dropdown at the bottom of the upload page is no longer relevant. So, we remove lines 77 - 85:
Please select a category you would like to place all products from this CSV into:
'.$category.'';
}
Next we add the category and brand options to the dropdown list of assignable fields.
lines 61 - 69 show:
Product Name
Description
Additional Description
Price
SKU
Weight
Weight Unit
Stock Quantity
Stock Quantity Limit
We are going to add to these so we now have:
Product Name
Description
Additional Description
Price
SKU
Weight
Weight Unit
Stock Quantity
Stock Quantity Limit
Category
Brand
now we change (what is now) line 122 - 123 to read:
$category_query = "INSERT INTO `".WPSC_TABLE_ITEM_CATEGORY_ASSOC."` VALUES ('','$id','".$cvs_data2."')";
$wpdb query($category_query);
and add the following two lines underneath:
$brand_query = "INSERT INTO `".WPSC_TABLE_ITEM_CATEGORY_ASSOC."` VALUES ('','$id','".$cvs_data2."')";
$wpdb query($brand_query);
This is simply adding the category and brand id to the WPSC_TABLE_ITEM_CATEGORY_ASSOC table.
Remember to add the Category IDs to your csv file and NOT the category name. Alternatively you could extend this tutorial by looking up the Category ID using the Category Name and inserting that.
Etiquetas:
Content Management System (CMS),
ecommerce,
php,
wordpress
miércoles, 3 de febrero de 2010
Does your blog ping?
Pings are a quick way to spread your blogs posts around the internet. A ping is a notification that is sent to a website. You have probably gotten them before when someone links your blog. There is a long list of Ping services that aggregate lists of new blog posts or website content.
There are several ways to get you URL on these lists. Spending an hour to sign your blog on to some update services will give you an edge on search engine page rank.
In your WordPress blog : to Settings > Writing >; and scroll down to Update Services. You will see "rpc.pingomatic.com/" in the box. Take a minute and add the below list into the box to bulk up your update notifications.
rpc.technorati.com/rpc/ping
blogsearch.google.com/ping/RPC2
rpc.weblogs.com/RPC2
ping.feedburner.com/
api.moreover.com/RPC2
rpc.blogrolling.com/pinger/
bulkfeeds.net/rpc
pinger.blogflux.com/rpc/
services.newsgator.com/ngws/xmlrpcping.aspx'
blogpeople.net/servlet/weblogUpdates
blogupdate.org/ping/
feedsky.com/api/RPC2
For Blogger users, you're SOL for the automatic notifications. It all has to be done manually or through an external service. I hear there is a script in the works to add in.
There are several ways to get you URL on these lists. Spending an hour to sign your blog on to some update services will give you an edge on search engine page rank.
In your WordPress blog : to Settings > Writing >; and scroll down to Update Services. You will see "rpc.pingomatic.com/" in the box. Take a minute and add the below list into the box to bulk up your update notifications.
rpc.technorati.com/rpc/ping
blogsearch.google.com/ping/RPC2
rpc.weblogs.com/RPC2
ping.feedburner.com/
api.moreover.com/RPC2
rpc.blogrolling.com/pinger/
bulkfeeds.net/rpc
pinger.blogflux.com/rpc/
services.newsgator.com/ngws/xmlrpcping.aspx'
blogpeople.net/servlet/weblogUpdates
blogupdate.org/ping/
feedsky.com/api/RPC2
For Blogger users, you're SOL for the automatic notifications. It all has to be done manually or through an external service. I hear there is a script in the works to add in.
Etiquetas:
Blog,
PageRank,
Ping,
Uniform Resource Locator,
Web Design and Development,
Web search engine,
website,
wordpress
viernes, 29 de enero de 2010
Changing the Wordpress Language
The Wordpress backend deals with 'Posts' and 'Pages'. For some clients this is too vague, and tweaks are needed.
As an example a site i've been working on recently needed the word 'Post' to be replaced with 'Product'. To do this, we need to create our own custom language file. Unfortunately creating a language file is a pretty complex process as compared to how simple other Wordpress processes can be. It is also not as well documented as other facets of Wordpress. So watch closely!
To begin with you will need a copy of the official WordPress POT file.
Next get yourself a translation tool. We opted for poEdit, which was quick and easy to download and install.
You are ready to start translating!
Open Poedit and use the File/open dialog to open your Wordpress POT file (ensure you change 'files of type' from GNU Gettext catalogs (*.po) to 'all files (*.*) )
Firstly, most importantly, and not well documented:
Go to Catalog/Settings
In the 'Project Info' tab:
change the language team to something new (e.g. Haycroft Media)
change the 'Plural Forms' value to nplurals=2; plural=(n != 1)
(if you are translating to a different language check this: list of Gettext plural forms for the correct setting
Click Ok
Now go to File/preferences and click on the 'Editor' tab.
Ensure that the 'Automatically compile .mo file on save' box is ticked
Click OK
Now File/save as to save
For this example I am saving the file as custom_lang
after saving you should see: custom_lang.mo and custom_lang.po saved in the location you chose.
Now at last we can begin!
Click Edit/find and enter the term you wish to translate (in my case it was 'Post')
tweak the search settings according to what you need and search
The first result I get for my 'Post' example is "Error: you are replying to a comment on a draft post."
Copy and paste this into the translation box and then amend the word post so you get:
Error: you are replying to a comment on a draft product.
Repeat this process until you have finished.
Save again
Now open your wp-config file and amend:
define ('WPLANG', '');
so that it reads:
define ('WPLANG', 'custom_lang');
(or whatever you saved your language file as)
Now create a directory called 'languages' in your wp-content directory
Upload the custom_lang.mo (or wahtever you saved it as) file to the languages folder you just created
Your backend should now display your amended language!
As an example a site i've been working on recently needed the word 'Post' to be replaced with 'Product'. To do this, we need to create our own custom language file. Unfortunately creating a language file is a pretty complex process as compared to how simple other Wordpress processes can be. It is also not as well documented as other facets of Wordpress. So watch closely!
To begin with you will need a copy of the official WordPress POT file.
Next get yourself a translation tool. We opted for poEdit, which was quick and easy to download and install.
You are ready to start translating!
Open Poedit and use the File/open dialog to open your Wordpress POT file (ensure you change 'files of type' from GNU Gettext catalogs (*.po) to 'all files (*.*) )
Firstly, most importantly, and not well documented:
Go to Catalog/Settings
In the 'Project Info' tab:
change the language team to something new (e.g. Haycroft Media)
change the 'Plural Forms' value to nplurals=2; plural=(n != 1)
(if you are translating to a different language check this: list of Gettext plural forms for the correct setting
Click Ok
Now go to File/preferences and click on the 'Editor' tab.
Ensure that the 'Automatically compile .mo file on save' box is ticked
Click OK
Now File/save as to save
For this example I am saving the file as custom_lang
after saving you should see: custom_lang.mo and custom_lang.po saved in the location you chose.
Now at last we can begin!
Click Edit/find and enter the term you wish to translate (in my case it was 'Post')
tweak the search settings according to what you need and search
The first result I get for my 'Post' example is "Error: you are replying to a comment on a draft post."
Copy and paste this into the translation box and then amend the word post so you get:
Error: you are replying to a comment on a draft product.
Repeat this process until you have finished.
Save again
Now open your wp-config file and amend:
define ('WPLANG', '');
so that it reads:
define ('WPLANG', 'custom_lang');
(or whatever you saved your language file as)
Now create a directory called 'languages' in your wp-content directory
Upload the custom_lang.mo (or wahtever you saved it as) file to the languages folder you just created
Your backend should now display your amended language!
viernes, 15 de enero de 2010
3 easy search engine optimization modifications for your Wordpress blog
If you are in the blogging majority, you want to include your page rank. There are a few things you can do from your dashboard with few technical skills. This is search engine optimization that only needs to modified once.
Get rid of your Uncategorized category
Naming all your categories gives search engine crawlers one more scent to sniff you out better.
Go to Settings > Writing > Default Post Category and choose a new default category.
Then go to Posts > Categories > delete "Uncategorized" from the list.
Add metadata to your site
I've explained this in detail on another post.
Basically, go to Appearance > Editor > header.php and replace the existing metadata:
<meta name=”list of keywords relating to your site- TIP: check your analytics tool to see what brings people to your site” content=”keywords” />
<meta name=”short description of your blog” content=”name” />
Dump your admin username
Admin usernames are both security risks and anonymous. Give search users a chance to find you by your handle.
If you want to use the email listed in your admin file for your new username, go into Users > Authors & Users > and change the admin email to another. Then, create a new user profile in Users > Add New. Be sure to make this one Administrator.
Then you must logout, login with the new username and go back to Users > Authors & Users > and delete the admin.
Get rid of your Uncategorized category
Naming all your categories gives search engine crawlers one more scent to sniff you out better.
Go to Settings > Writing > Default Post Category and choose a new default category.
Then go to Posts > Categories > delete "Uncategorized" from the list.
Add metadata to your site
I've explained this in detail on another post.
Basically, go to Appearance > Editor > header.php and replace the existing metadata:
<meta name=”list of keywords relating to your site- TIP: check your analytics tool to see what brings people to your site” content=”keywords” />
<meta name=”short description of your blog” content=”name” />
Dump your admin username
Admin usernames are both security risks and anonymous. Give search users a chance to find you by your handle.
If you want to use the email listed in your admin file for your new username, go into Users > Authors & Users > and change the admin email to another. Then, create a new user profile in Users > Add New. Be sure to make this one Administrator.
Then you must logout, login with the new username and go back to Users > Authors & Users > and delete the admin.
Etiquetas:
PageRank,
Web Design and Development,
Web search engine,
wordpress
martes, 12 de enero de 2010
TwitterTools - open links in external window
Our site makes use of the Twitter Tools plugin, but with some minor tweaks
The only links that Twitter Tools displays with our set-up are the bit.ly links, the link to the specific tweet (e.g. "1 hr ago") and the "More Updates..." link. All of these links will open their target in the same window, but we wanted them to open an external window so the user remains on the site.
To do this, you need to locate the plugin's main coding. This is currently at:
wp-content/plugins/twitter-tools/twitter-tools.php
Now make the folllowing changes:
"More Updates Link": Change Line 812:
$output .= ' twitter_username).' '.__('More updates...', 'twitter-tools').''."\n";
To:
$output .= ' twitter_username).'" target="_blank '.__('More updates...', 'twitter-tools').''."\n";
"Time Display Link": Change Line 879:
$output .= ' '.aktt_status_url($aktt twitter_username, $tweet tw_id).'" class="aktt_tweet_time '.$time_display.'';
To:
$output .= ' '.aktt_status_url($aktt twitter_username, $tweet tw_id).'" class="aktt_tweet_time" target="_blank '.$time_display.'';
"Bit.ly links": Change Line: 881:
return $output;
To:
$output = str_replace('rel="nofollow ', 'target="_blank" rel="nofollow ', $output);
return $output;
The only links that Twitter Tools displays with our set-up are the bit.ly links, the link to the specific tweet (e.g. "1 hr ago") and the "More Updates..." link. All of these links will open their target in the same window, but we wanted them to open an external window so the user remains on the site.
To do this, you need to locate the plugin's main coding. This is currently at:
wp-content/plugins/twitter-tools/twitter-tools.php
Now make the folllowing changes:
"More Updates Link": Change Line 812:
$output .= ' twitter_username).' '.__('More updates...', 'twitter-tools').''."\n";
To:
$output .= ' twitter_username).'" target="_blank '.__('More updates...', 'twitter-tools').''."\n";
"Time Display Link": Change Line 879:
$output .= ' '.aktt_status_url($aktt twitter_username, $tweet tw_id).'" class="aktt_tweet_time '.$time_display.'';
To:
$output .= ' '.aktt_status_url($aktt twitter_username, $tweet tw_id).'" class="aktt_tweet_time" target="_blank '.$time_display.'';
"Bit.ly links": Change Line: 881:
return $output;
To:
$output = str_replace('rel="nofollow ', 'target="_blank" rel="nofollow ', $output);
return $output;
Custom Write Panels
One of the great assets Wordpress possesses is the ability to easily customise the backend.
For example, a client needs a website for a real estate agent. The client will be posting information on the various properties available and displaying standard information on each property:
Title
Short Description
Long Description
Price
Thumbnail image
Large images
Bedrooms
Bathrooms
Generic Description (selected from a list of pre-defined descriptions)
Obviously the title and description fields can be covered using the standard Wordpress Title and Content fields. Thanks to the fantastic additions to Wordpress 2.9, Post Thumbnail images are now easy to use and reference, and the Gallery Shortcode has been in effect for a while now.
This just leaves the custom fields. There are plugins you can use, but we are control freaks and like to do thinks ourselves. So, as a starting point, we use this fantastic tutorial on Wefunction, but with a few extras.
First of all we create an array for our fields:
$track_meta_boxes =
array(
"price" => array(
"name" => "price",
"type" => "input",
"std" => "",
"title" => "Price",
"options" => "",
"description" => "Enter Property Price"),
"bedrooms" => array(
"name" => "bedrooms",
"type" => "input",
"std" => "",
"title" => "Bedrooms",
"options" => "",
"description" => "No. of bedrooms"),
"bathrooms" => array(
"name" => "bathrooms",
"type" => "input",
"std" => "",
"title" => "Bathrooms",
"options" => '',
"description" => "No. of bathrooms"),
"desc" => array(
"name" => "desc",
"type" => "select",
"std" => "",
"title" => "Description",
"options" => $desc,
"description" => "Description")
);
Notice that we have added a field called "type" to our array. This defines whether we are displaying and input box or a select box. We also add an array called $desc to the 'options' field. This could be defined as follows:
$desc = "Great for the first time buyer";
$desc = "Roomy and spacious";
$desc = "No room to swing a cat";
Now we just make a small amendment to the code to test whether we are displaying a select or input field:
if ( $meta_box == 'select' ) {
echo '';
} else {
echo '';
}
Note that this code just deals with displaying the panel. You can ascertain the necessary coding to display saved values (front and backend) from the wefunction tutorial. You will probably also want to test each of your option values against the saved value and flag it as selected if it is indeed the saved value.
We would also advise using the standard Wordpress markup when it comes to displaying the panels (something that they don't do in the wefunction tutorial). This is just for aesthetics, and it saves space.
For example, a client needs a website for a real estate agent. The client will be posting information on the various properties available and displaying standard information on each property:
Title
Short Description
Long Description
Price
Thumbnail image
Large images
Bedrooms
Bathrooms
Generic Description (selected from a list of pre-defined descriptions)
Obviously the title and description fields can be covered using the standard Wordpress Title and Content fields. Thanks to the fantastic additions to Wordpress 2.9, Post Thumbnail images are now easy to use and reference, and the Gallery Shortcode has been in effect for a while now.
This just leaves the custom fields. There are plugins you can use, but we are control freaks and like to do thinks ourselves. So, as a starting point, we use this fantastic tutorial on Wefunction, but with a few extras.
First of all we create an array for our fields:
$track_meta_boxes =
array(
"price" => array(
"name" => "price",
"type" => "input",
"std" => "",
"title" => "Price",
"options" => "",
"description" => "Enter Property Price"),
"bedrooms" => array(
"name" => "bedrooms",
"type" => "input",
"std" => "",
"title" => "Bedrooms",
"options" => "",
"description" => "No. of bedrooms"),
"bathrooms" => array(
"name" => "bathrooms",
"type" => "input",
"std" => "",
"title" => "Bathrooms",
"options" => '',
"description" => "No. of bathrooms"),
"desc" => array(
"name" => "desc",
"type" => "select",
"std" => "",
"title" => "Description",
"options" => $desc,
"description" => "Description")
);
Notice that we have added a field called "type" to our array. This defines whether we are displaying and input box or a select box. We also add an array called $desc to the 'options' field. This could be defined as follows:
$desc = "Great for the first time buyer";
$desc = "Roomy and spacious";
$desc = "No room to swing a cat";
Now we just make a small amendment to the code to test whether we are displaying a select or input field:
if ( $meta_box == 'select' ) {
echo '';
} else {
echo '';
}
Note that this code just deals with displaying the panel. You can ascertain the necessary coding to display saved values (front and backend) from the wefunction tutorial. You will probably also want to test each of your option values against the saved value and flag it as selected if it is indeed the saved value.
We would also advise using the standard Wordpress markup when it comes to displaying the panels (something that they don't do in the wefunction tutorial). This is just for aesthetics, and it saves space.
Etiquetas:
Content Management System (CMS),
php,
wordpress
Writing Wordpress Plugins
We're branching out this year, as well as Wordpress themes, we are now building custom plugins as well.
Although we've built a few plugins for customers sites, up until this point we haven't released anything into the Wordpress community, but all this is set to change with our first plugin.
Meantime, if you want to write Wordpress plugins, here's where you should start:
Creating Options Pages : Nearly all plugins will have some options. This page is also highly valuable if you want to add options to your themes.
Add a Widget : Your plugin may display data in a sidebar widget. Here's how!
Interact with the Database : Add your own tables to the Wordpress Database, or add/update/retrieve data that's already there.
Although we've built a few plugins for customers sites, up until this point we haven't released anything into the Wordpress community, but all this is set to change with our first plugin.
Meantime, if you want to write Wordpress plugins, here's where you should start:
Creating Options Pages : Nearly all plugins will have some options. This page is also highly valuable if you want to add options to your themes.
Add a Widget : Your plugin may display data in a sidebar widget. Here's how!
Interact with the Database : Add your own tables to the Wordpress Database, or add/update/retrieve data that's already there.
sábado, 2 de enero de 2010
use your photos to bring in traffic
There are 3 keys to making images SEO friendly.
Naming: Use your keywords in your image title. Use hyphens between words. This image is "baby-rabbit-in-grass.jpg", get it?
Title: This is for visually impaired viewers using screen readers and those who have dial up. It's the placeholder text for your image. This one is title="baby rabbit in grass", spaces are allowed. Keep it to less than 5 words.
Alt: Keywords! Use words that relate to the image and your post. I added alt="using images for SEO" and we're done!
The instructions are for WordPress users, but it's pretty much the same in all blogging platforms.
Upload your image into WordPress, insert it into your post and click the Edit Image button.
Go to the Advanced Settings tab
Add your text to "Edit Alternate Text" and "Title"
Or just code it in from the HTML tab
<img title="images html code" src="site.com/images/wordpress/code-for-image.png" alt="images search engine optimization" />
Naming: Use your keywords in your image title. Use hyphens between words. This image is "baby-rabbit-in-grass.jpg", get it?
Title: This is for visually impaired viewers using screen readers and those who have dial up. It's the placeholder text for your image. This one is title="baby rabbit in grass", spaces are allowed. Keep it to less than 5 words.
Alt: Keywords! Use words that relate to the image and your post. I added alt="using images for SEO" and we're done!
The instructions are for WordPress users, but it's pretty much the same in all blogging platforms.
Upload your image into WordPress, insert it into your post and click the Edit Image button.
Go to the Advanced Settings tab
Add your text to "Edit Alternate Text" and "Title"
Or just code it in from the HTML tab
<img title="images html code" src="site.com/images/wordpress/code-for-image.png" alt="images search engine optimization" />
Etiquetas:
Web Design and Development,
Web search engine,
wordpress
martes, 15 de diciembre de 2009
put permanent metadata in your site
I am sure you have heard all about the importance of include keyword tags in your blog posts. It's a great way to get those search engines to bring more readers to your site.
When you create your blog in WordPress or Blogger, it creates metadata with your title and tag line. This is good, but put a lot of importance on that tagline. It throws out all those witty quips you wanted to use.
Now you can do both with a simple code embedded in your template. A little copy and paste will help you add common keywords that relate to you. Change the italicized and keep everything else.
<META NAME="description" CONTENT="slacker stay-at-home mom">
<META NAME="keywords" CONTENT="stay at home mom, special needs children">
<META NAME="Content-language" CONTENT="en">
<META NAME="author" CONTENT="mamikaze">
<META NAME="creation_date" CONTENT="November 19, 2006 21:09:01">
<META NAME="robots" CONTENT="all, index, follow">
<META name="copyright" content="© 2006-2010 mamikaze">
Wordpress (self-hosted)
Go to Appearance > Editor > header.php > Insert the code before the tag
Blogger:
Go to Layout > edit html > insert the code before the tag
When you create your blog in WordPress or Blogger, it creates metadata with your title and tag line. This is good, but put a lot of importance on that tagline. It throws out all those witty quips you wanted to use.
Now you can do both with a simple code embedded in your template. A little copy and paste will help you add common keywords that relate to you. Change the italicized and keep everything else.
<META NAME="description" CONTENT="slacker stay-at-home mom">
<META NAME="keywords" CONTENT="stay at home mom, special needs children">
<META NAME="Content-language" CONTENT="en">
<META NAME="author" CONTENT="mamikaze">
<META NAME="creation_date" CONTENT="November 19, 2006 21:09:01">
<META NAME="robots" CONTENT="all, index, follow">
<META name="copyright" content="© 2006-2010 mamikaze">
Wordpress (self-hosted)
Go to Appearance > Editor > header.php > Insert the code before the tag
Blogger:
Go to Layout > edit html > insert the code before the tag
Etiquetas:
HTML,
Markup Languages,
Meta element,
Web search engine,
wordpress
martes, 1 de diciembre de 2009
Exclude categories from Wordpress RSS
The Haycroft Media website uses a category for the flashy portfolio on the home page, which we want to hide from the Wordpress RSS feed
There are various options for doing this all detailed in a nice simple tutorial at Web-Kreation.com. We opted for option 2: Exclude categories in your template’s functions.php file, which simply involved the addition of a few lines of code to the functions.php file (just change the category id to that of the one you wish to omit):
function myFeedExcluder($query) {
if ($query is_feed) {
$query set('cat','-12');
}
return $query;
}
add_filter('pre_get_posts','myFeedExcluder');
There are various options for doing this all detailed in a nice simple tutorial at Web-Kreation.com. We opted for option 2: Exclude categories in your template’s functions.php file, which simply involved the addition of a few lines of code to the functions.php file (just change the category id to that of the one you wish to omit):
function myFeedExcluder($query) {
if ($query is_feed) {
$query set('cat','-12');
}
return $query;
}
add_filter('pre_get_posts','myFeedExcluder');
Strip wp_head in Wordpress
The wp_head() call in the header of most themes is an invitation for Wordpress to start inserting code into your nice tidy head.
However, we are of the opinon that if you don't need it, get rid of it. If you view the source of this site, you will see that we have removed the rsd link, the wml manifest link and the generator link. We're not using them, so we don't need them.
In addition, many Wordpress security blogs recommend removing the generator tag as it reveals the version of Wordpress you are using. So, say the good people at Wordpress discover a major security flaw in version 2.6 and you haven't upgraded to 2.7 yet, anyone with a knowledge of the flaw knows that your site is vulnerable.
So, how do we remove these pesky tags? Simply add the following to your themes functions.php file:
function striphead() {
remove_action('wp_head', 'rsd_link');
remove_action('wp_head', 'wlwmanifest_link');
add_filter('the_generator', 'no_generator');
}
function no_generator() {
return '';
}
add_action('init', 'striphead');
However, we are of the opinon that if you don't need it, get rid of it. If you view the source of this site, you will see that we have removed the rsd link, the wml manifest link and the generator link. We're not using them, so we don't need them.
In addition, many Wordpress security blogs recommend removing the generator tag as it reveals the version of Wordpress you are using. So, say the good people at Wordpress discover a major security flaw in version 2.6 and you haven't upgraded to 2.7 yet, anyone with a knowledge of the flaw knows that your site is vulnerable.
So, how do we remove these pesky tags? Simply add the following to your themes functions.php file:
function striphead() {
remove_action('wp_head', 'rsd_link');
remove_action('wp_head', 'wlwmanifest_link');
add_filter('the_generator', 'no_generator');
}
function no_generator() {
return '';
}
add_action('init', 'striphead');
martes, 17 de noviembre de 2009
Displaying user data in your Wordpress theme
The last time I needed to display user data was for the Press Stick website. For their site, they wanted the user to be greeted with a personalised message on logging in.
The message for the Press Stick site was:
"hi from . welcome back to the press-stick sourcing portal. we look forward to showing you the new and exciting products available to you."
For the purpose's of this site, we tweaked the standard Wordpress user data so that the user's magazine name would be stored in the 'Nickname' field. To return the message above, we simply insert the following:
user_firstname.' '.$current_user user_lastname;
$magazine = $current_user nickname;
echo '';
The message for the Press Stick site was:
"hi from . welcome back to the press-stick sourcing portal. we look forward to showing you the new and exciting products available to you."
For the purpose's of this site, we tweaked the standard Wordpress user data so that the user's magazine name would be stored in the 'Nickname' field. To return the message above, we simply insert the following:
user_firstname.' '.$current_user user_lastname;
$magazine = $current_user nickname;
echo '';
Etiquetas:
Content Management System (CMS),
php,
Press Stick,
wordpress
miércoles, 11 de noviembre de 2009
Wordpress plugins worth your time
Wordpress plugins can make your blog better and your blogging easier. These are my new faves.
Bad Behavior
Bad Behavior complements other link spam solutions by acting as a gatekeeper, preventing spammers from ever delivering their junk, and in many cases, from ever reading your site in the first place. This keeps your site’s load down, makes your site logs cleaner, and can help prevent denial of service conditions caused by spammers.
Download
Broken Link Checker
Checks your posts for broken links and missing images and notifies you on the dashboard if any are found.
Download
Comment Info Tip
When you mouseover a commenter’s name you will see a tip appear displaying some information about that given commenter.
Download
Contact Form 7
Contact Form 7 can manage multiple contact forms, plus you can customize the form and the mail contents flexibly with simple markup. The form supports Ajax-powered submitting, CAPTCHA, Akismet spam filtering and so on.
Download
Embed Iframe
Embed Iframe is a Wordpress plugin that will let you embed iframe – an HTML tag that allows a webpage to be displayed inline with the current page, in a Wordpress post. Although an iframe can lead to a complicated website, it can be very effective when used appropriately.
Download
Hotlink Protection
Do you have problems that other people hotlink your images in guestbooks, bulletin boards and other sites? Then this plugin for Wordpress helps you without breaking online feedreaders. Normally, if someone hotlinks your image the plugin will serve your custom image or this image:
Download
MoFuse
MoFuse is a service that allows bloggers to easily create a mobile-friendly version of their blog for free.
This plugin allows you to automatically detect and redirect your mobile visitors to the mobile-friendly version of your blog.
Download
Lifestream
Lifestream is a plugin built on top of the WordPress platform. It allows you to effortlessly integrate your social network activity across the web with your blog.
Out of the box, Lifestream is just streams in RSS/Atom feeds and prettying them up, but deep down it's a very flexible platform allowing developers to integrate any kind of activity they desire.
Download
SexyBookmarks
Though the name may be a little "edgy" for some, SexyBookmarks has proven time and time again to be an extremely useful and successful tool in getting your readers to actually submit your articles to numerous social bookmarking sites.
Download
Ultimate Category Excluder
Allows you to quickly and easily exclude categories from your front page, archives, and feeds. Just select which categories you want to be excluded, and UCE does all the work for you!
Download
WP Greet Box
This plugin lets you show a different greeting message to your new visitors depending on their referrer url. For example, when a Digg user clicks through from Digg, they will see a message reminding them to digg your post if they like it. Another example, when a visitor clicks through from Twitter, they will see a message suggesting them to twit the post and follow you on Twitter. You can also set a default greeting message for new visitors (not matching any referrer URLs) suggesting them to subscribe to your RSS feed.
Download
Bad Behavior
Bad Behavior complements other link spam solutions by acting as a gatekeeper, preventing spammers from ever delivering their junk, and in many cases, from ever reading your site in the first place. This keeps your site’s load down, makes your site logs cleaner, and can help prevent denial of service conditions caused by spammers.
Download
Broken Link Checker
Checks your posts for broken links and missing images and notifies you on the dashboard if any are found.
Download
Comment Info Tip
When you mouseover a commenter’s name you will see a tip appear displaying some information about that given commenter.
Download
Contact Form 7
Contact Form 7 can manage multiple contact forms, plus you can customize the form and the mail contents flexibly with simple markup. The form supports Ajax-powered submitting, CAPTCHA, Akismet spam filtering and so on.
Download
Embed Iframe
Embed Iframe is a Wordpress plugin that will let you embed iframe – an HTML tag that allows a webpage to be displayed inline with the current page, in a Wordpress post. Although an iframe can lead to a complicated website, it can be very effective when used appropriately.
Download
Hotlink Protection
Do you have problems that other people hotlink your images in guestbooks, bulletin boards and other sites? Then this plugin for Wordpress helps you without breaking online feedreaders. Normally, if someone hotlinks your image the plugin will serve your custom image or this image:
Download
MoFuse
MoFuse is a service that allows bloggers to easily create a mobile-friendly version of their blog for free.
This plugin allows you to automatically detect and redirect your mobile visitors to the mobile-friendly version of your blog.
Download
Lifestream
Lifestream is a plugin built on top of the WordPress platform. It allows you to effortlessly integrate your social network activity across the web with your blog.
Out of the box, Lifestream is just streams in RSS/Atom feeds and prettying them up, but deep down it's a very flexible platform allowing developers to integrate any kind of activity they desire.
Download
SexyBookmarks
Though the name may be a little "edgy" for some, SexyBookmarks has proven time and time again to be an extremely useful and successful tool in getting your readers to actually submit your articles to numerous social bookmarking sites.
Download
Ultimate Category Excluder
Allows you to quickly and easily exclude categories from your front page, archives, and feeds. Just select which categories you want to be excluded, and UCE does all the work for you!
Download
WP Greet Box
This plugin lets you show a different greeting message to your new visitors depending on their referrer url. For example, when a Digg user clicks through from Digg, they will see a message reminding them to digg your post if they like it. Another example, when a visitor clicks through from Twitter, they will see a message suggesting them to twit the post and follow you on Twitter. You can also set a default greeting message for new visitors (not matching any referrer URLs) suggesting them to subscribe to your RSS feed.
Download
lunes, 12 de octubre de 2009
Great Use of Typography in Modern Web Design
This is an example of a WordPress page, you could edit this to put information about yourself or your site so readers know where you are coming from. You can create as many pages like this one or sub-pages as you like and manage all of your content inside of WordPress. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla neque ipsum, rhoncus eu euismod sed, ullamcorper a urna. Aenean ut nibh odio, vitae mollis odio. Maecenas faucibus auctor interdum. Nam commodo vehicula sapien sit amet aliquam. Nam eu diam ac dolor volutpat consequat vitae at neque. Ut at tortor nisi. Aliquam sit amet sapien nibh. Vivamus quis tellus id eros volutpat condimentum sed ac ante. In vel tortor ac nibh sagittis pellentesque eu a est. Phasellus at libero massa, non mollis mauris.
This is a Subheadline
Aenean tincidunt pharetra leo. Curabitur euismod sollicitudin elit. Donec faucibus lacus nec sapien. Aliquam ipsum nisi, scelerisque et, commodo nec, consectetur vel, tellus. Cras ipsum diam, hendrerit id, accumsan sit amet, fermentum vel, dui.
Sed congue, dui vel tristique mollis, libero elit convallis eros, vitae interdum libero dolor eget leo.
Morbi eget sem. Nam mollis. Donec sed velit ut tellus fermentum interdum.
Etiam a odio in neque egestas consequat. Pellentesque posuere, orci id interdum.
Suspendisse id magna in libero porta faucibus. Vivamus sollicitudin.
Here’s Another One
Mauris vulputate metus eu nisl. Praesent placerat. Mauris vitae erat id ante viverra sodales. Proin tincidunt porta velit. Sed a ligula id felis rutrum placerat. Curabitur et lorem non urna tristique pharetra. Nullam luctus tristique dui.
Etiam egestas scelerisque purus. Ipsum diam, hendrerit id, accumsan sit amet, fermentum vel, dui. Morbi blandit commodo tellus. Aenean tincidunt pharetra leo. Curabitur euismod sollicitudin elit. Donec faucibus lacus nec sapien. Aliquam ipsum nisi, scelerisque et, commodo nec, consectetur vel, tellus. Cras ipsum diam, hendrerit id, accumsan sit amet, fermentum vel, dui.
Whoa! Ultra Readable Text
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus nibh mi, commodo eu, pellentesque ut, blandit rutrum, ligula. Praesent ultricies urna a urna. Quisque massa. Cras ipsum diam, hendrerit id, accumsan sit amet, fermentum vel, dui. Morbi blandit commodo tellus. Aenean tincidunt pharetra leo. Curabitur euismod sollicitudin elit. Donec faucibus lacus nec sapien. Aliquam ipsum nisi, scelerisque et, commodo nec, consectetur vel, tellus. Cras ipsum diam, hendrerit id, accumsan sit amet, fermentum vel, dui. Morbi blandit commodo tellus.
Vivamus nibh mi, commodo eu, pellentesque ut, blandit rutrum, ligula. Praesent ultricies urna a urna. Quisque massa. Cras ipsum diam, hendrerit id, accumsan sit amet, fermentum vel, dui. Morbi blandit commodo tellus. Aenean tincidunt pharetra leo. Curabitur euismod sollicitudin elit. Donec faucibus lacus nec sapien. Aliquam ipsum nisi, scelerisque et, commodo nec, consectetur vel, tellus. Cras ipsum diam, hendrerit id, accumsan sit amet, fermentum vel, dui. Morbi blandit commodo tellus.
Praesent ultricies urna a urna. Quisque massa. Cras ipsum diam, hendrerit id, accumsan sit amet, fermentum vel, dui. Morbi blandit commodo tellus. Aenean tincidunt pharetra leo. Curabitur euismod sollicitudin elit. These are some more words to lengthen the line.
This is a Subheadline
Aenean tincidunt pharetra leo. Curabitur euismod sollicitudin elit. Donec faucibus lacus nec sapien. Aliquam ipsum nisi, scelerisque et, commodo nec, consectetur vel, tellus. Cras ipsum diam, hendrerit id, accumsan sit amet, fermentum vel, dui.
Sed congue, dui vel tristique mollis, libero elit convallis eros, vitae interdum libero dolor eget leo.
Morbi eget sem. Nam mollis. Donec sed velit ut tellus fermentum interdum.
Etiam a odio in neque egestas consequat. Pellentesque posuere, orci id interdum.
Suspendisse id magna in libero porta faucibus. Vivamus sollicitudin.
Here’s Another One
Mauris vulputate metus eu nisl. Praesent placerat. Mauris vitae erat id ante viverra sodales. Proin tincidunt porta velit. Sed a ligula id felis rutrum placerat. Curabitur et lorem non urna tristique pharetra. Nullam luctus tristique dui.
Etiam egestas scelerisque purus. Ipsum diam, hendrerit id, accumsan sit amet, fermentum vel, dui. Morbi blandit commodo tellus. Aenean tincidunt pharetra leo. Curabitur euismod sollicitudin elit. Donec faucibus lacus nec sapien. Aliquam ipsum nisi, scelerisque et, commodo nec, consectetur vel, tellus. Cras ipsum diam, hendrerit id, accumsan sit amet, fermentum vel, dui.
Whoa! Ultra Readable Text
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus nibh mi, commodo eu, pellentesque ut, blandit rutrum, ligula. Praesent ultricies urna a urna. Quisque massa. Cras ipsum diam, hendrerit id, accumsan sit amet, fermentum vel, dui. Morbi blandit commodo tellus. Aenean tincidunt pharetra leo. Curabitur euismod sollicitudin elit. Donec faucibus lacus nec sapien. Aliquam ipsum nisi, scelerisque et, commodo nec, consectetur vel, tellus. Cras ipsum diam, hendrerit id, accumsan sit amet, fermentum vel, dui. Morbi blandit commodo tellus.
Vivamus nibh mi, commodo eu, pellentesque ut, blandit rutrum, ligula. Praesent ultricies urna a urna. Quisque massa. Cras ipsum diam, hendrerit id, accumsan sit amet, fermentum vel, dui. Morbi blandit commodo tellus. Aenean tincidunt pharetra leo. Curabitur euismod sollicitudin elit. Donec faucibus lacus nec sapien. Aliquam ipsum nisi, scelerisque et, commodo nec, consectetur vel, tellus. Cras ipsum diam, hendrerit id, accumsan sit amet, fermentum vel, dui. Morbi blandit commodo tellus.
Praesent ultricies urna a urna. Quisque massa. Cras ipsum diam, hendrerit id, accumsan sit amet, fermentum vel, dui. Morbi blandit commodo tellus. Aenean tincidunt pharetra leo. Curabitur euismod sollicitudin elit. These are some more words to lengthen the line.
Etiquetas:
clean,
design,
illustration,
lettering,
modern,
premium,
Sample Articles,
theme,
typography,
Web,
wordpress
Suscribirse a:
Entradas (Atom)