10 WordPress Hacks to Make your Life Easy
Written by Jai on August 27, 2008 – 5:29 pm - 22,220 viewsDisplaying Gravatars in comments
To refresh your memory, Gravatars are little user images from Gravatar.com that are displayed against your comments in the theme (if the theme is built to support Gravatars). A lot of WordPress themes are built without the support of Gravatars. So, here is some help for you to add Gravatars in your theme. Open up your comments.php file from the theme folder. Find this piece of code :-
<?php comment_text() ?>
Replace the above code with the following code :-
<div class="gravs">
<?php if (get_bloginfo('version')>=2.5)
echo get_avatar( $comment->comment_author_email, $size = '50', $comment->comment_author_link);?>
<?php comment_text() ?>
</div>
<br clear="all" />
The above code will display the Gravatars. Now let us add some CSS to the style.css file for your theme.
.gravs {margin-top:20px;}
.avatar {float:left; margin-right:5px; margin-bottom:5px; padding:3px; border:1px solid #999999;}
When you check your theme again, you will see the Gravatar images against your comments.
Image Gallery in WordPress
All the versions of WordPress 2.5+ have inbuilt Image Gallery function where you can upload your images in a set and then insert the gallery either into your post or a new page.
But almost all the old themes(before 2.5) and many new ones do not have the integrated functionality. In order to add this feature, here is what you have to do :-
In your existing theme, open single.php and save it as image.php in your theme folder. Now open this image.php file in an editor and find the line that displays the post content. It should be somewhat in the following form. It can differ a bit but the function is called by the_content like this :-
<?php the_content('Read More'); ?>
Now insert the following code above the aforementioned code (the_content) :-
<p class="attachment">
<a href="<?php echo wp_get_attachment_url($post->ID); ?>"><?php echo wp_get_attachment_image( $post->ID, 'medium' ); ?></a>
</p>
<div class="caption">
<?php if ( !empty($post->post_excerpt) ) the_excerpt(); // this is the "caption" ?>
</div>
Insert the following code below the aforementioned code (the_content) :-
<div class="imgnav">
<div class="imgleft"><?php previous_image_link() ?></div>
<div class="imgright"><?php next_image_link() ?></div>
</div>
<br clear="all" />
Now, add this CSS to your theme’s style.css file :-
/****************Image Gallery *********************/
.gallery {text-align:center;}
.gallery img {padding:2px; height:100px; width:100px;}
.gallery a:hover {background-color:#ffffff;}
.attachment {text-align:center;}
.attachment img { padding:2px; border:1px solid #999999;}
.attachment a:hover {background-color:#FFFFFF;}
.imgnav {text-align:center;}
.imgleft {float:left;}
.imgleft a:hover {background-color:#FFFFFF;}
.imgleft img{ padding:2px; border:1px solid #999999; height:100px; width:100px;}
.imgright {float:right;}
.imgright a:hover {background-color:#FFFFFF;}
.imgright img{ padding:2px; border:1px solid #999999; height:100px; width:100px;}
The above CSS code fixes the default gallery of WordPress which doesn’t look so good. So, now when you go and upload your images in a post or a page, go to the gallery option (after you have finished uploading all your images) and insert gallery into your post/page. That’s it!
Adding a “Subscribe to feed” message after every post
Many people use this kind of message to remind the readers to subscribe to their blogs and place them at the end of every post. This can be accomplished by using a simple plugin or you can do the following. If you want the message to show under all your posts on the homepage, open up index.php and just where your content finishes (the_content), add this line :-
<div style="padding:5px; border:1px solid #999999; margin-top:10px; background-color:#FFF8AF;">
If you enjoyed this post, make sure you subscribe to my RSS Feed
</div>
You can do the same for your single.php file in the theme folder which is used to display your individual posts.
Displaying Twitter messages on your blog
If you have a Twitter.com account and want to display the twitters that you make on your blog, here is what you have to do.
Login to your Twitter.com account. Go to this URL :- http://twitter.com/badges/html and choose your settings. Copy the code and paste it on your blog. You can paste it directly into your theme files or use text widgets to put them in a sidebar. They can also be styled through CSS.
Displaying Authors’ Bio
In a multi-user blog, it can be beneficial to show the Authors’ Bio under every single post for the users to read about the post author. This can be done using the Biographical Info in the Your profile setting under Users section of WP-Admin.
To integrate this bio, open up your single.php file and under the_content line (as before), add this code :-
<div class="author">
<?php the_author_description(); ?>
</div>
Now, add the following CSS code to your style.css in the theme folder:-
.author{
color: #222222;
font-family: Arial;
font-size: 12px;
border:1px solid #CCCCCC;
width: 500px;
padding: 5px;
margin-top:10px;
margin-bottom:10px;
}
Now if you refresh your individual post pages, you will see the author’s info under the post content.
Categories drop down
To add a good looking drop down that will list all your existing categories, insert the following code in your blog template. You can do it either in your sidebar.php file or anywhere in the index.php. This is the code :-
<form action="<?php bloginfo('url'); ?>/" method="get">
<?php
$select = wp_dropdown_categories('show_option_none=Select category&show_count=1&orderby=name&echo=0');
$select = preg_replace("#<select([^>]*)>#", "<select$1 onchange='return this.form.submit()'>", $select);
echo $select;
?>
<noscript><input type="submit" value="View" /></noscript>
</form>
Archives drop down
Just like in categories, you can have your monthly archives listed in a drop down. Add the following code to your template files :-
<select name=\"archive-dropdown\" onChange='document.location.href=this.options[this.selectedIndex].value;'>
<option value=\"\"><?php echo attribute_escape(__('Select Month')); ?></option>
<?php wp_get_archives('type=monthly&format=option&show_post_count=1'); ?> </select>
Adding 125×125 Ads to your sidebar
Many people do not know how to integrate 125×125 banner ads into their theme sidebars. I will explain it to you. Save the following image to your desktop (this is a sample 125×125 banner that we will use) :-
Make a folder called “ads” in your theme folder (the theme in which you want to add these banners) and place this image (125.gif) in that new folder. Now, add the following code to your sidebar where you want the banners to appear :-
<div class="bannerads">
<div class="ad_125x125"><a href="#"><img src="<?php bloginfo('template_directory'); ?>/ads/125x125.gif" border="0" alt="Advertising" /></a></div>
<div class="ad_125x125"><a href="#"><img src="<?php bloginfo('template_directory'); ?>/ads/125x125.gif" border="0" alt="Advertising" /></a></div>
</div><!-- bannerads -->
<br clear="all" />
Finally, add the following CSS code to your style.css file :-
.bannerads {width:270px; margin:10px auto;}
.ad_125x125 {float:left; margin:0px 5px 10px 5px; width:125px; height:125px;}
When you refresh your theme, you will see two adjacent 125×125 banner ads in your sidebar. You can then change the images as you like and also the hyperlinks.
Displaying most commented (popular) posts
There is always an urge in bloggers to showcase their most popular posts or the posts with the most comments. This is how you can do it:-
Place the following code at the end of your header.php file in the theme folder. You can change the number of popular post titles that will be pulled from the database by altering the $no_posts variable in the code :-
<?php function most_popular_posts($no_posts = 5, $before = '<li>', $after = '</li>', $show_pass_post = false, $duration='') {
global $wpdb;
$request = "SELECT ID, post_title, COUNT($wpdb->comments.comment_post_ID) AS 'comment_count' FROM $wpdb->posts, $wpdb->comments";
$request .= " WHERE comment_approved = '1' AND $wpdb->posts.ID=$wpdb->comments.comment_post_ID AND post_status = 'publish'";
if(!$show_pass_post) $request .= " AND post_password =''";
if($duration !="") { $request .= " AND DATE_SUB(CURDATE(),INTERVAL ".$duration." DAY) < post_date ";
}
$request .= " GROUP BY $wpdb->comments.comment_post_ID ORDER BY comment_count DESC LIMIT $no_posts";
$posts = $wpdb->get_results($request);
$output = '';
if ($posts) {
foreach ($posts as $post) {
$post_title = stripslashes($post->post_title);
$comment_count = $post->comment_count;
$permalink = get_permalink($post->ID);
$output .= $before . '<a href="' . $permalink . '" title="' . $post_title.'">' . $post_title . '</a> (' . $comment_count.')' . $after;
}
} else {
$output .= $before . "None found" . $after;
}
echo $output;
} ?>
Now, wherever you want to display the popular posts list, place the following code. You can do it in the sidebar or the index.php file.
<?php most_popular_posts(); ?>
Adding a Print Button to your posts
In order to enable your users to take printouts of your posts, you can provide them with a Print button on the blog. Open up your single.php file (for individual posts) from the theme folder and add the following code wherever you want to have the Print option:-
<a href="javascript:window.print()">Print this Article</a>
I hope that you liked these WordPress hacks and also hope that they make your life easy in some way 
If you enjoyed this post, make sure you subscribe to my RSS feed!
on Aug 28, 2008
Brilliant!!! Thank you. Great post to save and keep referring to every now and then to tweak my Wordpress blog. Keep it up!
on Aug 28, 2008
Great!!
thank you very much. It’s really useful, a blogger should know about this trick.
on Aug 28, 2008
Thanks just restyled my comments a bit more!
on Aug 28, 2008
Thank you, the learning
on Aug 28, 2008
Really useful tools.
The print button is frequently used.
Thanks for sharing your knowledge!
on Aug 28, 2008
Thanks for the information. I’ve implemented a few of these things into my blog.
on Aug 28, 2008
nice work!
I think that the Print Button is not necessary because that there is already a Print selection in the browses’ File list.
on Aug 28, 2008
Have to agree with Chada, The Print This article prints the entire page.
on Aug 28, 2008
@styletime:-
Col!
on Aug 28, 2008
Thanks, Jai. Great tips.
on Aug 28, 2008
A friend of mine is really happy with his theme but it doesn’t show gravatars in the comments, I just pointed him at this post. Thanks for the great tips.
on Aug 28, 2008
I have already implemented some of these on my blogs via plugins, but to be able to edit the code yourself is always useful. Thanks for the article!
on Aug 28, 2008
Thanks a lot, ususally you can find them is themes but a list for them is good too
on Aug 28, 2008
Very Helpful. Thank You
on Aug 28, 2008
STUMBLED!
Good tips, gonna do the RSS feed one.
on Aug 28, 2008
I used 2 of the tips. I used your code to make my old theme compatible with the new WP galleries. I’ve put in the code, now I am going to upload pictures and try to post a gallery. I hope it works!
Next I used your Twitter calling code. Easy enough, I put my latest Twitter message right beside where I already had a Twitter chiclet.
Luckily Twitter warned me to put the “script call” in my WordPress Footer. That way, if Twitter happens to be down for the day, my page will still load.
On your Print tip, I think the thing that’s missing is a printable stylesheet. A lot of times the regular webpage, with ads and colors and borders, is too much to print. I use Gamerz’ WP-Print plugin for this.
on Aug 28, 2008
Learning…
on Aug 28, 2008
Thank you, this is nice hack
on Aug 28, 2008
These are fantastic. Thanks Jai…
on Aug 28, 2008
Cool hacks! These features would be very useful for my site. Thank you
on Aug 29, 2008
great work jai. thx so much. currently i’m looking for these tutorials
on Aug 29, 2008
Can you also provide code for showing Author names in the side bar along with the number of posts by each author? I manage a team blog and it would be great to have this. Each name could hyperlink to the posts by that author.
Authors
name1 (#)
name2 (#)
…
on Aug 29, 2008
What a great collection of hacks! I attempted to add the most popular post but encountered this error
Parse error: syntax error, unexpected ‘{’ in /home/……/public_html/wp-content/themes/sketchd/header.php on line 67
What could be the problem? I have added the code to my header.php and the php code on my footer.
Appreciate your guide on this. Thank you…
Yan
on Aug 29, 2008
Hi Jai,
Any idea how to show gravatars for post authors?
And, as always, another great post!
Thanks,
Harmony
on Aug 29, 2008
@Yan Shall Blog:- I forgot to add the word “function” before the code. Please copy it again and try.
on Aug 29, 2008
@Harmony:- This is the code to use to display Gravatars for post authors :-
< ?php echo get_avatar( get_the_author_email(), '80' ); ?>on Aug 29, 2008
@Jai:-
Thanks so much, Jai! It worked like a charm!
xx
on Aug 29, 2008
@Jai:- Thanks, Jai. Appreciate your help..
on Aug 29, 2008
I love the theme. Can anyone tell me how to add who submitted the post. I have a blog with multiple author but dailypress doesn’t show who submitted the post.
on Aug 29, 2008
@Bryan:-
Sorry this was meant for the DailyPress comments.
on Aug 29, 2008
I used the Gravatar hack, thanks mate
on Aug 29, 2008
Thank you very much !
I’ll use the print button from now .
Dror
on Aug 29, 2008
Thanks very much! Just coded gravatars into my wordpress site using your guide.
on Aug 29, 2008
This is exactly why I like wordpress so much. You can edit / hack it up, etc without anyone getting angry. It’s awesome.
on Aug 29, 2008
I really like this post. Thanks for your feed.
Have a nice week.
Lki
on Aug 30, 2008
Thanks for sharing this usefull information. Anything else in store ?
on Aug 30, 2008
Thank you so much for this!
on Aug 30, 2008
Thanks for the info
on Aug 30, 2008
Thanks Mr Jai, great tips
on Aug 31, 2008
This is great! I am beginning a web project soon for a photo gallery and your tips here would come really handy. Many, many thanks!
on Aug 31, 2008
Tks for your information. Salam.
on Aug 31, 2008
Nice work…
on Aug 31, 2008
This is very informative tutorial I will apply it on my blog.
Thanks for providing such great info.
Thanks
on Aug 31, 2008
@Jai, regarding the Displaying most commented (popular) posts, i copied the code and did as you said and published a post on my bog, there is no problem for the post look, but there is a big problem with the RSS Feed–it is impossible to open the feed site on IE :
http://www.essentialblog.cn/feed/,
but it is OK on Firefox.
I think the there are some mistakes in the code, would you please give me some advise how to fit it?
on Aug 31, 2008
@Young:-
there are some wrong words in my previous comments, sorry and will be more careful next time. Look forward to your advice.
on Sep 1, 2008
Thank you thank you thank you!! I finally have Gravatars working thanks to your very easy-to-follow steps (if only Wordpress.org has such user-friendly documentation).
on Sep 1, 2008
How do you alterin the $no_posts variable in the code?
on Sep 1, 2008
Hi Jai,
Very good tutorials mate lovd them keep them coming :)!!!
lots of love,
Sam.
on Sep 1, 2008
Very interesting and helpful. Thanks,
on Sep 2, 2008
Thanks for conglomerating the details at a single point and presenting to us. I would also request you to post about any plugin which would enable the wordpress users/readers to download the post as a PDF file.
Thanks for the support.
on Sep 4, 2008
Excellent tips. Thank You.
on Sep 4, 2008
Thanks for sharing those great tricks. Inspire by trick put category list into drop down, how do I put my tag list into a drop down?
Thanks for helping….
on Sep 4, 2008
Most Commented post heck - NOt working - Donno why? ( added the word “function” before the code. )
on Sep 6, 2008
Pagina molto interessante..Word Press is the Best
on Sep 6, 2008
Thanks for this tutorial…its very helpful.
on Sep 7, 2008
Nice tips, these really helped me, specially the category and archive drop down .
Thanks
on Sep 10, 2008
Great hacking tips. I would like them all. T
on Sep 11, 2008
thanks a lot for sharing. Good luck for you
on Sep 11, 2008
Thanks! Those are great tools. I’m sure I’ll use it in my blog I’m working on.
Ilan
on Sep 11, 2008
@ilan:- thanks again
on Sep 12, 2008
wow, I found the hack I was looking for after a very long time. I have been wonder how to place 125 banner ads on my sidebar and this post of yours really helped me out and it is very easy to do. thanx again.
on Sep 16, 2008
Thank you very much, Jai! I have always wondered how to do a lot of the things which you have listed off here, and this post clarifies everything in an easy and great manner to follow!
Appreciate it very much!
on Sep 24, 2008
Thank you
on Sep 28, 2008
@goblogging:- yeah great
on Oct 3, 2008
????????
on Oct 3, 2008
@Chada:- But what if you would like to modify the printed pages layout or something… ? This print button would be quite usefull.
on Oct 4, 2008
Davvero un elenco molto molto utile per chi vuole implementare al meglio il proprio blog! Grazie mille!
on Oct 5, 2008
Thank you very much !
Great Wordpress Hack
on Oct 8, 2008
wow I have added this page to my favs I wouldn’t mind doing a few things mentioned here including the member bio!
Nice hack thanks man
on Oct 10, 2008
This is perfect! lots of helpful stuff. Have stumbled and will certainly be back!
on Nov 5, 2008
@BoyGJ.COM:-
what about?
on Nov 6, 2008
excellent tips
on Nov 7, 2008
i’m really thank you for the great Information.
This is what i really want for my Blog.
thanks again! Keep Posting!
on Nov 12, 2008
Great List, Ive always loved this site.
on Nov 16, 2008
wow.. this is really cool!!!!