Add custom thumbnails in wordpress post

Wordpress Plugins1 300x186 Add custom thumbnails in wordpress postWordPress is a great platform to blog. Most of the bloggers prefer to use magazine themes as they provide you with a lot of space to view things. But one of the main reasons I don’t use a magazine theme is that the looks of all the magazine themes is the same.

One feature that I really missed in non-magazine themes is the featured images function which I was not able to find in any other non-magazine theme. So I decided to do something my self. At the end of the day I was able to come up with an approximate of the thumbnail system in some of the premium magazine themes . When you add a featured thumbnail of any size most magazine themes automatically resize the thumbnails to the desired size and add them to the post.

In this tutorial I will tell you how to enable this feature and the make some changes to your theme so that you will be able to see the featured thumbnail next to post.

So first let us enable the feature, which is the easy part of the job. For that go to Appearance -> Editor -> Theme Function(On the right hand side) then add the following code at the top.

if ( function_exists( 'add_theme_support' ) ) {
  add_theme_support( 'post-thumbnails' );
}

Update the file. Now you would be able to see an option like this while writing/ editing a post.

Screen Shot 2011 09 18 at 9.03.54 AM Add custom thumbnails in wordpress post

This will allow you to add thumbnail to your post. But the size of the thumbnail also matters. While the big magazine themes have pre-installed plugins to do the job but I think light as installing too many plugins on your blog may lead to some problems on your blog that are very difficult to diagnose as I am facing problems with light box.

So you can use an online tool Pic Resize. This tool allows you to edit your images in great detail but we need to only to resize our images, so click on Quick Resize enter 64 as the width and leave the height option as blank. This is the optimum size  of a thumbnail that should be used. Now add this image as the featured image of your post.

I think Most themes would display the thumbnail by default but some might not. For those who are not getting the thumbnails beside the post you would need to edit your theme. I am giving a general over view which would work for most of the theme.

For this we would need to make a division to correctly format the location of the image and then call the function

<?php the_post_thumbnail(); ?>

So first go to Appearance -> Editor -> Stylesheet . At the end of the page add this

#thumb {
	float:left;
	width:64px;
	background:#fff;
	color:#000;
}

This would probably set the division we need to put the thumbnail in. Update the file and select Main Index Template.

This is probably where you would find the code that displays the headings of the post. Our aim is to place the thumbnail on the left side of the post heading. If your want to place it on the right of the post heading just replace “float:left” with “float:right” in the above code.

The code is between the tags <h1>……….</h1> if you are using a good theme but can also be between <h2>………</h2>. So just before the heading code add

<div id=”thumb”><?php the_post_thumbnail(); ?></div>

Update the file . Now you would be able to see the thumbnail next to the post heading.

Share With Friends

Ashmeet Singh

I have just passed class 12 and am looking forward to making it into a good college. I have also been the writer of many blogs such as TechnoDesi,NewtrojansBlog,GammersLane etc. and this blog is my new endeavour in the field of technology.

You may also like...

4 Responses

  1. Hulda says:

    They assume that window cleaning should be part of the rent.
    When this process is completed, we transfer this water into our specially
    adapted vans which have 1500 liter holding tanks. Professional
    window cleaners prefer to use clear and clean water when cleaning
    windows.

  2. For instance, you might say “wow, are you always so indecisive. It is okay to serve corn dogs for dinner once in a while. over the net saree buying is one thing which has come going to be really favored as well as many females are looking at this.

  3. I like dealing with you guys!

  4. cartierlovejesduas Fake and suspicious and convenient
    falso bracciali love cartier http://www.migliorecollana.com/

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>