This works fine for the vast majority of cases but sometimes it would be great to have have more than one image for a post. For example if you have a folio section or a product where you may want to have multiple images. I tried searching for “mulitple post thumbnails”, “multiple featured images” and so on but most of the “solutions” were mainly about looping through all post attachments and displaying these. This can work in some instances but it didn’t provide as much control as I wanted and if you happened to have other images in the post then these would also be displayed.

Eventually I came across a plugin called Multiple Post Thumbnails and decided to tweak that slightly and integrate it directly into my theme instead of using it as a separate plugin. This is how I did it.

Adding support for post thumbnails in your WordPress theme

First things first, before you start adding support for multiple post thumbnails you need to ensure you have the basic post thumbnails enabled for your theme. Check your functions.php file and make sure the following line is present, if not add it in.

 add_theme_support( 'post-thumbnails' ); 

You can also define additional sizes for your post thumbnails.

// Add Custom image sizes
// Note: 'true' enables hard cropping so each image is exactly those dimensions and automatically cropped
add_image_size( 'feature-image', 960, 500, true );
add_image_size( 'medium-thumb', 300, 156, true );
add_image_size( 'small-thumb', 75, 75, true );

Adding the files and support for multiple post thumbnails to your theme

1. Download the files for the Multiple Post Thumbnails Plugin to your computer
2. Unzip the files and copy them to a sub-directory in your theme file. There are only two files you will need multi-post-thumbnails.php and multi-post-thumbnails-admin.js. In my case i’ve placed the PHP file in a library sub-directory in my theme and the JavaScript file in a sub-directory called js inside library.

   > theme-name
      > library
        - multi-post-thumbnails.php
        > js
          - multi-post-thumbnails-admin.js
   

3. Once that’s done you need to make a small tweak to the multi-post-thumbnails.php file.
   From this (line 143)

   public function enqueue_admin_scripts() {
       wp_enqueue_script("featured-image-custom", plugins_url(basename(dirname(__FILE__)) . '/js/multi-post-thumbnails-admin.js'), array('jquery'));
   }
   

   To this

   public function enqueue_admin_scripts() {
       $template_url = get_bloginfo('template_url') . '/js/multi-post-thumbnails-admin.js';
       wp_enqueue_script("featured-image-custom",  $template_url, array('jquery'));
   }
   

4. Then go back to your functions.php file and add the following.

   // Load external file to add support for MultiPostThumbnails. Allows you to set more than one "feature image" per post.
   require_once('library/multi-post-thumbnails.php');
   

   It’s usually a good idea to keep these inclusions at the beginning of your functions.php file so they are included before you try to use any of the functions they add.

5. You then need to define some additional post thumbnails and specify which post types they should apply to. The default would be ‘post’ but in my case I had created a custom post type called folio where I’d added 4 extra post thumbnails for a total of up to 5 featured image for each folio item. To do this add the following in functions.php just after the add_image_size entries mentioned above.

   	// Define additional "post thumbnails". Relies on MultiPostThumbnails to work
   	if (class_exists('MultiPostThumbnails')) {
   		new MultiPostThumbnails(array(
   			'label' => '2nd Feature Image',
   			'id' => 'feature-image-2',
   			'post_type' => 'folio'
   			)
   		);
   		new MultiPostThumbnails(array(
   			'label' => '3rd Feature Image',
   			'id' => 'feature-image-3',
   			'post_type' => 'folio'
   			)
   		);
   		new MultiPostThumbnails(array(
   			'label' => '4th Feature Image',
   			'id' => 'feature-image-4',
   			'post_type' => 'folio'
   			)
   		);
   		new MultiPostThumbnails(array(
   			'label' => '5th Feature Image',
   			'id' => 'feature-image-5',
   			'post_type' => 'folio'
   			)
   		);		
   
   	};
   

That’s it, you’ve now added support for mulitple post thumbnails for your post or custom post type and you should see several “Featured Images” boxes in your admin screen. This is what mine looked like.

Displaying the post thumbnails in your WordPress posts

So now you’ve (hopefully) got the admin part working and are able to add multiple post thumbnails to your posts, but you also need to output these in your post or page template. Continuing on my folio concept I wanted to output these images to use in a JavaScript slider. I happened to be using the Nivo Slider at the time but it doesn’t really matter what you use, you’ll just need to tweak the HTML output to match what your slider expects.

This is where the added control of the featured images comes in handy over just scanning through attachments, you might find it easier just to upload a bunch of images and let WordPress use all of the attachments but I needed control over the order and also wanted the freedom to add more images into the description of a folio item without having to worry about it ending up in the slider.

Here’s the PHP code. I’ll try to explain a bit more how it works. The listing is done in two steps. First we show the standard featured image, we then loop through and display all the extra featured images. Because I wanted to use the Nivo slider thumbnail view I had to include a REL attribute with the url for the thumbnail version of the image. After a lot of searching I finally figured that I could add an array of attributes when calling the_post_thumbnail() and this also worked for wp_get_attachment_image() which I ended up having to use instead of the standard MultiPostThumbnails::the_post_thumbnail().

<div id="slider">
    <?php
        // Checks if post has a feature image, grabs the feature-image and outputs that along with thumbnail SRC as a REL attribute
        if (has_post_thumbnail()) { // checks if post has a featured image and then outputs it.
            $image_id = get_post_thumbnail_id ($post->ID );
            $image_thumb_url = wp_get_attachment_image_src( $image_id,'small-thumb');
            $attr = array(
                'class'	=> "folio-sample",
                'rel' => $image_thumb_url[0], // REL attribute is used to show thumbnails in the Nivo slider, can be skipped if you don't want thumbs or using other slider
            );
            the_post_thumbnail ('feature-image', $attr);
        }
        if (class_exists('MultiPostThumbnails')) {
        // Loops through each feature image and grabs thumbnail URL
        $i=1;
            while ($i<=5) {
                $image_name = 'feature-image-'.$i;  // sets image name as feature-image-1, feature-image-2 etc.
                if (MultiPostThumbnails::has_post_thumbnail('folio', $image_name)) {
                    $image_id = MultiPostThumbnails::get_post_thumbnail_id( 'folio', $image_name, $post->ID );  // use the MultiPostThumbnails to get the image ID
                    $image_thumb_url = wp_get_attachment_image_src( $image_id,'small-thumb');  // define thumb src based on image ID
                    $image_feature_url = wp_get_attachment_image_src( $image_id,'feature-image' ); // define full size src based on image ID
                    $attr = array(
                        'class'	=> "folio-sample",      // set custom class
                        'rel' => $image_thumb_url[0],   // sets the url for the image thumbnails size
                        'src' => $image_feature_url[0], // sets the url for the full image size
                    );
                    // Use wp_get_attachment_image instead of standard MultiPostThumbnails to be able to tweak attributes
                    $image = wp_get_attachment_image( $image_id, 'feature-image', false, $attr );
                    echo $image;
                }
                $i++;
            }                            

        }; // end if MultiPostThumbnails
     ?>
</div><!-- end #slider -->

Now all of this can be done a lot easier just using the standard call from the plugin e.g.

if (class_exists('MultiPostThumbnails') {
    if (MultiPostThumbnails::has_post_thumbnail('folio', 'feature-image-2')) {
        MultiPostThumbnails::the_post_thumbnail('folio', 'feature-image-2');
    }
    if (MultiPostThumbnails::has_post_thumbnail('folio', 'feature-image-3')) {
        MultiPostThumbnails::the_post_thumbnail('folio', 'feature-image-3');
    }
    if (MultiPostThumbnails::has_post_thumbnail('folio', 'feature-image-3')) {
        MultiPostThumbnails::the_post_thumbnail('folio', 'feature-image-3');
    }
}

However because I needed the extra control over the output of attributes I ended up having to do it a bit more complex. If you’re planning on using the featured images in a slider that requires specific classes, attributes or HTML structure then you may need to go down the same route I’ve done. Hopefully with the code above most of the hard work will be done for you already.

Final words

Well there you have it, if everything went well you should have a working post with multiple post thumbnails and a more elegant way of adding multiple feature images to your posts. If you’re doing work for clients I think this approach will be a bit more user friendly than trying to explain attachments or pasting in URLs into custom fields. The cool thing is that you can set featured images for completely different uses on the same post as well. They don’t need to be called feature images. If you’re doing a real estate web site you could have some images defined as interior, some for exterior and a separate one for floorplan which will give you the control needed to output the right images where needed. It also guides the authors to what they need to add.

Until WordPress 3.3 comes out and hopefully Plupload is integrated into the dashboard this is a pretty decent solution, at least compared to anything else I’ve seen so far.

In the coming days and weeks I will also be adding additional articles featuring more intermediate and advanced WordPress SEO tips and eventually expanding more on off-site SEO factors and link building strategies.

5 Core WordPress SEO optimisation areas

1. Changing your WordPress permalinks
2. Optimsing WordPress page titles
3. Optimising WordPress meta description and meta keywords
4. Customising your "more links"
5. Optimise site name and description(s)

Thoughts on using WordPress SEO plugins

Almost all of the optimisation areas mentioned can be achiveved with plugins. Likewise pretty much everything the plugins do can be achieved through modifications to your theme. If you feel comfortable updating your theme and you don’t like plugins messing with your beautifully crafted HTML output then you’ll probably want to tweak your theme by adding relevant code snippets to do the majority of what the plugins can offer.

Personally I do a bit of both, I like to optimise my themes as much as possible but still use plugins to fill in the gaps. Plugins are particularly useful if you like to tweak titles or descriptions on a post/page level and can save you qutie a bt of time for repetivite tasks. A word of caution though, don’t rely 100% on plugins to create completely automated descriptions, they are never as good as handcrafted descriptions.

Start off with a well structured WP theme

If you’re creating a new site or want create a new theme for your site it helps if you can build your site around a WordPress theme that is structured and coded well. Starting out with a theme that is at least partially SEO friendly will save you time but it’s not required.

When selecting a theme either to use as a starting point or to use as it is have a peak at the the code of the theme first, both viewing the PHP files and the source code of the HTML output. Look out for a theme that is well coded and well structured, something that already includes title attributes on links and images has clear navigation and .

One important factor is to make sure your theme always lists your content before the sidebar when viewing the source code of your site, regardless of where the sidebar is located visually in the design. This ensures that crawlers look at your unique content first and the sidebar content is secondary as it tends to be listed on all pages of your site.

1. Change WordPress default permalinks

One of the first things you should do after a fresh WordPress install is to change the permalink structure. By default the WordPress permalink structure is ?p=<postid>. For both SEO and usability purposes you’d want your links to be descriptive e.g. /categoryname/postname or just /postname. WordPress permalink settings can be found in your WP admin interface under Settings > Permalinks.

Under common settings select "Custom structure".

• To display just the post title in your url use. /%postname%/
• Alternatively use /%category%/%postname%/ if you want to to include the category name before the post title.

Before you change your WordPress Permalinks

If you’re setting up a new blog with little or no existing content then changing permalinks is a no-brainer. Just change the settings before any of your content is indexed, However if you’re optimising an existing site then changing permalinks can have a huge impact unless take the necessary steps to setup up redirection.

Before you change permalinks on an existing website that has been established for a while consider the following:

• If your pages have Page Rank (PR) any change to the permalink will result in a loss in page rank for that page. If you setup a 301 redirect some of the page rank will normally pass to your new permalink but is a risk of some decay in page rank.
• Incoming links from other sites will return 404 errors unless you setup 301 redirection to the new permalink

WordPress Permalink Redirection Plugins

Now that you know the potential impact of changing established permalinks The good news is that this can be addressed relatively easily using plugins.

Redirection provides you with very granular control over redirects including ability to import a list or redirects from an existing .htaccess file as well as forcing either www or non-www prefix on your site for canonical urls. Once this plugin has been installed go to Tools > Redirection for settings.

If you’re usiing Platinum SEO Pack you won’t need a separate plugin as it includes automatic redirection for changes in URLs and permalink structure.

Keep in mind though if you do have significant page rank on some of your pages you may still lose some of the page rank even with a 301 redirect. This is typically more common if you migrate your site completely to a new domain and not really a problem when using 301 redirect for internal site changes. Personally I don’t really fuss to much about page rank, I mean it’s nice if my site or some of my pages get a little bit of a boost and it does seem to improve Google rankings a bit, however at the lower end of the specter PR1-5 it doesn’t really matter that much.

2. Optimising WordPress page titles

By default your WordPress page titles will typically include your site name on the home page and "Site name » Archive » Post title" for archives and posts. This is not terrible but it could be better.

• Page titles should ideally be no longer than 60-70 characters, this is a general guideline from Google and it’s not an absolute requirement but you should try to stay below 100 characters.
• The reason this is important is because if your page titles are longer they will be cut off in the SERPs (search engine results pages). If your title is longer than 70 characters Google will typically cut it off before 69 characters and end with …
• If you have a long site name and category name(s) and these are listed first then you run the risk of your actual article or post title being cut off or disappearing completely.
• Search engines also tend to weight keywords early in the title a bit higher and you’d to ensure that your carefully crafted post titles are visible and given all the emphasis possible.
• Your <title> should be as close as possible to your <h1> page/post title. By starting with your post/page title the first part of your <title> will match your <h1> post title.

Personally I’d avoid including categories on post or pages as it tends to make the titles too long.

Opimising your titles with plugins

If you’re using Headspace2, All-In-One SEO or Platinum SEO Pack it’s very easy to set your titles either in the global settings for the plugin or on an individual post level. I prefer the following title structure:

• Home page: %blog-title% | %tagline%
• Posts: %post_title% | %blog_title%
• Pages: %page_title% | %blog_title%
• Category pages: %category_title% | %blog_title%

The settings screens for page titles are pretty much identical for All-in-One SEO and Platinum SEO Pack. The settings screen for Headspace2 is quite different and offers more control but is perhaps slightly more difficult to use for beginners.

You can also change settings and write custom titles and descriptions on individual posts or pages. If you add a title or meta description to an individual post it will override the global settings.

Customising WordPress titles without using a plugin

To display the title on your home page or front page as “Blog title | Tagline” and single posts or pages as “Post/page title | Blog title” just add the following code to you header.php replacing the existing <title> tag.

<title>
	<?php wp_title(''); ?><?php if(wp_title('', false)) { echo ' | '; } ?><?php bloginfo('name'); if(is_home() || is_front_page()) { echo ' | '; bloginfo('description'); } ?>
</title>

3. Setting up site name and description(s)

This might seem obvious and very easy to do but it’s something that can easily be overlooked.

• On your home page use H1 for your site name and tagline
• On all other pages change the site name and tagline either to an h3 or lower or wrap it in a div, personally I prefer changing it to a div as the site name is not what is important on subsequent pages and unless you’ve got an extremely well known brand it’s not what people will be searching for either.

To only display your blog name and description as h1 and/or h2 on your home page or front page add this code snippet to your theme header.php

    <?php if (is_home() || is_front_page()) { ?>
        <h1 id="blog-title"><?php bloginfo('name') ?></h1>
        <h2 id="blog-description"><?php bloginfo('description') ?></h1>
    <?php } else { ?>
        <div id="blog-title"><?php bloginfo('name') ?></div>
        <div id="blog-description"><?php bloginfo('description') ?></div>
    <?php } ?>

Make good use of the category descriptions

Spend some time writing descriptions for all your categories. When using wp_list_categories(); which is typically used in your main menu or category listing WordPress will by default use the category description as the title attributes for each category. I also like to add the category description as an H2 or H3 on the category archive pages in my theme. Category descriptions can also be used as your meta description on category archive pages. Category descriptions can be edited in your WP admin interface under Posts > Categories.

To display your category description on your category archive pages add the following to you category.php page.

	<?php $categorydesc = category_description(); if ( ! empty( $categorydesc ) )
		echo apply_filters( 'archive_meta', '<h2 class="archive-meta">' . $categorydesc . '</h2>' ); ?>

Alternatively if you don’t have a category.php page your can add the folloing to your index.php file or archive.php file.

<?php
	if (is_category()) {
		$categorydesc = category_description(); if ( ! empty( $categorydesc ) )
		echo apply_filters( 'archive_meta', '<h2 class="archive-meta">' . $categorydesc . '</h2>' );
	}
?>

4. Optimising WordPress meta descriptions and keywords

Customising description meta tag in WordPress

Meta tags have little or no impact on your actual search engine rankings. However your meta description in particular will influence whether people find your site listing in search results interesting enough to click through to your website. Google and other search engines will use meta description as the text you see below the title of the search result in the search results page.

• Home page: Make sure your home page includes a meta description that describes what your site is about.
• Categories: For category archives you can use the category description
• Posts: On single posts you have multiple options. If you’ve added excerpts to your posts then they’re ideal candidates for meta description.

Adding custom meta descriptions in WordPress without a plugin

If you prefer to add this directly to you theme yourself then use the following code snippet:

<meta name="description" content="<?php
		// if home page output blog name and description
		if (is_home()) { bloginfo('name'); echo " - "; bloginfo('description');}
		// if single page output either excerpt if available or post title
	    elseif (is_single()) {
        	// check if excerpt exists for the post and output it if it does
        	if (!empty($post->post_excerpt)) {the_excerpt();}
            // otherwise output the post title
        	else {single_post_title('', true);}
        }
        // if category page output the category description
 	   	elseif (is_category()) {echo category_description();}

        // if it's any other page display this generic description
		else { echo 'Add your own generic site description here';}
	?>"
 />

You can do the same thing for pages, search results, tag archives or date archives with the following conditions:

• Pages: is_page()
• Search results: is_search()
• Tag archives: is_tag()
• Date archives: is_date()

You can also use custom fields to customise your own meta description on individual posts. First replace the elseif (is_single()) the following snippet to the

	<meta name="description" content="<?php
		// if home page output blog name and description
		if (is_home()) { bloginfo('name'); echo " - "; bloginfo('description');}
		// if single page output either excerpt if available or post title
	    elseif (is_single()) {
           	$custommeta = get_post_meta($post->ID, "MetaDescription", true);
        	// checks ot see if the custom field MetaDescription is not empty
            if ($custommeta !=='') {echo $custommeta;}
            // check if excerpt exists for the post and output it if it does
        	elseif (!empty($post->post_excerpt)) {the_excerpt();}
            // if there's no custom field or excerpt output the post title
        	else {single_post_title('', true);}
        }
        // if category page output the category description
 	   	elseif (is_category()) {echo category_description();}

        // if it's any other page display this generic description
		else { echo 'Add your own generic site description here';}
	?>"
 />

Using keywords meta tag in WordPress

Whilst the description meta tag is useful, the keywords meta tag offers very little benefit for rankings or otherwise. In the early days of search engines this meta tag was often used and abused and as a result most search engines no use it for ranking purposes. Google has specifically stated that they do not give any weighting whatsoever to meta keywords, for further details see Google does not use the keywords meta tag in their ranking.

Even though there’s very little evidence that meta keywords will help your rankings it certainly doesn’t hurt to include some relevant keywords in your keywords meta tag. The a quick and simple solutions for this in WordPress is to just list your tags as your meta keywords on individual posts.

Automatically adding meta descriptions and keywords in WordPress using plugins

If you’er using an SEO plugin like Headspace2, Platinum SEO Pack or All-In-One SEO Pack you can set these to automatically add meta descriptions to your site based on a set of rules you can define. They will also allow you to override global settings and customise meta descriptions and keywords on individual posts by via an additional admin panel on the edit posts or page screens.

5. Customising WordPress "more links"

Using the <!-- more --> quicktag in WordPress allows you to limit the content shown from a post on your home page, archives or search page. By default the anchor text for more links will just say "read more" which is not great for internal linking. A better solution is to make the anchor text more descriptive and include the post title it’s linking to. This will is not only good for your internal site SEO but can is also a stronger call to action for your readers.

Customising WP "more links" with plugins

If you’re using Headspace2 or you can go to Settings > Headspace then select Page Modules and drag and drop the more text module into the page module. This will add an option to specify the more text on a post by post basis. Personally I prefer to just use the post title but if you really like to tailor more links on a granular level then Headspace2 will make it easy for you to do so.

Customising WP "more links" by editing theme files

If you want to insert something similar in your own theme open up the index.php file, locate where your the_content() is being called and replace is with the following code. This will set the more text to …continue reading “post title” adding quotes around the post title as well as wrapping it in a <strong> tag. It also adds a span around the anchor text with a title attribute listing the title again.

<?php the_content('<span class="readmore" title="Read full article ' . get_the_title('', '', false) . '">...continue reading <strong>"' . get_the_title('', '', false) . '"</strong></span>' ); ?>

Or alternatively you can use something a bit simpler like:

	<?php the_content("Continue reading " . the_title('', '', false)); ?>

If your design does not easily accomodate long anchor text or you don’t want to display the long anchor text for practical or aesthetic reasons then I suggest you at least include a title attribute on the more link. This won’t be as effective for SEO purposes but it’s better than nothing and it will assist your users.

<?php the_content('<span class="readmore" title="Read full article ' . get_the_title('', '', false) . '">read the full article</span>'); ?>

Customising WordPress "more links in Thematic

If you’re using Thematic just add the following code to your functions.php file. This will add a span around your more link with a class to allow you to style it differently with CSS. It also adds a title attribute to the span with the name of the post it’s linking to and includes the post name in the anchor text with the prefix …comintiue reading “post name”.

function childtheme_more_text($content) {
	$content = '<span class="readmore" title="Read full article ' . get_the_title('', '', false) . '">...continue reading "' . get_the_title('', '', false) . '"</span>';
	return $content;
}
add_filter('more_text', 'childtheme_more_text');

Bonus Tip: Install the Google XML Sitemaps Plugin

The Google XML Sitemaps plugin automatically creates special XML sitemap and submits it to Google, Bing, Yahoo and Ask.com. Using an XML sitemap is a great way to ensure that the search engine robots will find and index all of your pages. It’s great to ensure new sites are quickly indexed and equally useful for blogs with frequent updates to ensure that new pages and posts are indexed. Using an XML Sitemap does not guarantee that your pages are included in search engines, but it does provide helpful hints for web crawlers to do a better job of crawling your site which is particularly useful if your site structure and internal linking is a bit shoddy. The plugin uses Sitemap Protocol 0.9 defined by sitemaps.org. It’s an open standard with support from the likes of Google, Yahoo and Microsoft.

Summary

That’s it for now, the optimisation areas covered will improve your general on-page SEO for WordPress and hopefully give you a bit of a boost in rankings. In the next article I’ll be covering Canonical URLs and how to avoid duplicate content, how to format your posts using semantic HTML, tips for cleaning up your code and more.

Convenience for being able to blog wherever you are does however come at the cost of several core features. Realistically though I doubt you’ll be churning out novel length posts this way but it does have some uses for basic admin tasks and micro-blogging.

Current limitations of the WordPress iPhone app

If you are using themes that require custom fields for things like article thumbs then you won’t be able to seamlessly publish via the app. You could always write drafts for later publishing or for review by an editor if it’s a multi-author blog.

In its present form the app seems more suited for micro-blogging and can be quite useful if your blog automatically posts to Twitter.

Remote admin and upkeep

Probably the most useful feature for some people is the ability to to keep an eye on your blog remotely and be able stay on top of admin task like reviewing and approving comments. In the latest update of the app (version 2.2) you can now also reply to comments…wheee.

I’m sure future updates will add a lot more meat to the bones of this app, but for now we’ll have to be content with the rather meager framework that we’ve been given.

If you’ve installed WordPress more than a couple of times you would have noticed that there are few things that you always tend do with each WP install. Here are some of the first few steps you should consider doing after installing WordPress.

First steps after a fresh WordPress install

1. Change your password, create new user and delete admin user
2. Change your blog tagline
3. Setup permalinks using %postname%
4. Change date and time format as well as timezone
5. Change media image sizes to suit your theme layout
6. Upload and activate your theme
7. Create your categories and set new default category
8. Install, activate and test your plugins
9. Configure RSS settings
10. Setup a backup for your WordPress database