Have you seen blogs where thumbnails are displayed next to the blog post content usually found on the home page, search pages, categories and archive pages of the blog?  Have a look at popular blog’s and news channels online to see this in action. With many WordPress blog’s themes, this has been updated, but many times you will find that this feature is theme dependant.

If you have a WordPress theme and you would like to add post thumbnails to your theme, follow the steps below to enable and add them.

Enable Post thumbnails on WordPRess

Add the below code to the functions.php file found in your theme files.

{code type=PHP}

add_theme_support( ‘post-thumbnails’ ); //enables post thumbnails
set_post_thumbnail_size( 100, 100 ); // 100 pixels wide by 100 pixels tall, box resize mode

{/code}

Change “100,100” in the code above to the size you would like the post thumbnails to be displayed.  Have a look at the function reference from WordPress on Post Thumbnails.

Display Post Thumbnails

Ok, we have now added the code to our functions.php file to enable post thumbnails on our blog posts, but how do we display them?  To display the post thumbnails you have activated requires two steps.

  • Place the code on your theme where you would like them to appear
  • Upload post thumbnails to your blog post

Add post thumbnails to your theme

Where do you want the post thumbnails to be displayed?  If you would like to add them to your theme’s home page, have a look at your theme’s files and the home page file is usually called home.php or index.php (depending on how your theme is set up).

Search in the code for “the_content();” and place the following code directly above it.

{code type=HTML}

<span><?php the_post_thumbnail(); ?></span>

{/code}

Replace the span style code with your own styles or create a new style in your styles.css file. You can add the above codce to the home page, archives pages, search pages, etc on your theme.

Upload the post thumnail

All the hard work is now done to enable post thumbnails and to upload them to your blog posts, click on the link “Set featured image” on the edit/create a blog post page on your WordPress dashboard.  Once clicked, it will open up the page where you can upload images.  Upload your image and once done, click on the link “Use as featured image” below the image properties.  Click on save and exit the upload screen.

You have now enabled “WordPress Post Thumbnails” on your blog theme.  Leave a comment below if you have any questions regarding WordPress post thumbnails.