When browsing other WordPress blogs with awesome themes, I always find myself wondering how someone handled a particular aspect of the layout or functionality. This is especially true with the Thesis Theme, because of the difference in setup due to the Thesis hooks system. So for anyone browsing Kikolani, I wanted to answer the question of “how did you do that” in a new series on WordPress Thesis Theme Customization.
Part Three B: Posts & Social Bookmarking Icons
There are five main customizations that I have done to my single posts.
Custom Byline with Tweetmeme Button
The first customized item is the custom byline, or the details right under the post title, which shows on the main index page, archives, and single post pages. In Thesis Options, under Display, I set the Byline to include “Show author name in post byline,” “Link author names to archives,” and “Show published-on date in post byline.”
Then, in the custom_functions.php, I add a custom byline function to the Thesis byline item hook using this code:
add_action('thesis_hook_byline_item','custom_byline');
In the custom byline function, I include the following to add the comment count to the byline, and also include the Tweetmeme controls as well to make re-tweeting articles easy:
function custom_byline() {
?>
in <span class="url fn"><?php the_category(', '); ?></span> | <a href="<?php comments_link(); ?>" class="url fn"><span class="url fn"><?php comments_number('0 Comments','1 Comment','% Comments'); ?></span></a> <div style="float:right;margin-top:-19px;margin-right:-10px;"> <script type="text/javascript"> tweetmeme_url = '<?php the_permalink() ?>'; tweetmeme_style = 'compact'; </script> <script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script> </div>
<?
}
Greet Box
The second customized item is handled by the WP Greet Box plugin, which checks where visitors are coming from, and displays a message focused on a particular social network or a general message about subscribing.
Sociable Links Function
The next three modifications happen in the custom_functions.php. The function is called sociable_links, and I add it to the post footer hook by using the following:
add_action('thesis_hook_after_post', 'sociable_links');
I open the function with:
function sociable_links() {
And check to make sure the modifications only happen on single post pages by adding:
if (is_single()) { ?>
The Single Post Ad
The first part of my post footer is the ad. This is done in HTML using the code provided form e-Junkie, currently for the 31 Days to Building a Better Blog by ProBlogger.
The “Enjoy This Post” Section
The second part of my post footer is to invite people who enjoyed the post they just read to bookmark it on social networks or to subscribe so they do not miss out on future posts. For those who are not sure about RSS and social bookmarking, I also include a links to articles on RSS and social bookmarking so they can learn more.
The Social Bookmarking Icons
Lately, my social bookmarking icons have gotten a lot of attention. Most people think it’s a plugin, but it’s actually all manually coded in. I loved the Polaroid Icon Set because it not only showed the network icon, but also the name, for those who may not recognize just the symbol. I had to create a few new icons for Sphinn and Mixx, and edited the Gmail icon for email. Then I modified some code I found for manually inserting sociable links in WordPress. The following is the specific codes used for the icons at the end of this post.
Delicious
<a rel="nofollow" href="http://del.icio.us/post?url=<?php the_permalink(); ?>&title=<?php the_title();?>" title="Bookmark this post at Delicious" target="blank"><img src="delicious.png" border="0" alt="Polariod Delicious Icon" style="padding:1px;background-color:none;"></a>
Digg
<a rel="nofollow" href="http://digg.com/submit?phase=2&url=<?php the_permalink(); ?>&title=<?php the_title();?>" title="Digg this post" target="blank"><img src="digg.png" border="0" alt="Polariod Digg Icon" style="padding:1px;background-color:none;"></a>
Email
<a rel="nofollow" href="mailto:?subject=<?php the_title();?>&body=<?php the_permalink(); ?>" title="Email this post" target="blank"><img src="gmail.png" border="0" alt="Polariod Email Icon" style="padding:1px;background-color:none;"></a>
Facebook
<a rel="nofollow" href="http://www.facebook.com/share.php?u=<?php the_permalink(); ?>&t=<?php the_title();?>" title="Share this post on Facebook" target="blank"><img src="facebook.png" border="0" alt="Polariod Facebook Icon" style="padding:1px;background-color:none;"></a>
Mixx
<a rel="nofollow" href="http://www.mixx.com/submit?page_url=<?php the_permalink(); ?>&title=<?php the_title();?>" title="Mixx this post" target="blank"><img src="mixx.png" border="0" alt="Polariod Mixx Icon" style="padding:1px;background-color:none;"></a>
Reddit
<a rel="nofollow" href="http://reddit.com/submit?url=<?php the_permalink(); ?>&title=<?php the_title();?>" title="Reddit this post" target="blank"><img src="reddit.png" border="0" alt="Polariod Reddit Icon" style="padding:1px;background-color:none;"></a>
Sphinn
<a rel="nofollow" href="http://sphinn.com/submit.php?url=<?php the_permalink(); ?>&title=<?php the_title();?>" title="Sphinn this post" target="blank"><img src="sphinn.png" border="0" alt="Polariod Sphinn Icon" style="padding:1px;background-color:none;"></a>
StumbleUpon
<a rel="nofollow" href="http://www.stumbleupon.com/submit?url=<?php the_permalink(); ?>&title=<?php the_title();?>" title="Stumble this post" target="blank"><img src="stumbleupon.png" border="0" alt="Polariod StumbleUpon Icon" style="padding:1px;background-color:none;"></a>
Twitter
<a rel="nofollow" href="http://twitter.com/home?status=Currently reading <?php the_permalink(); ?>" title="Click to send this page to Twitter!" target="_blank"><img src="twitter.png" border="0" alt="Polariod Twitter Icon" style="padding:1px;background-color:none;"></a>
Closing the sociable_links function
Finally, to close the sociable_links function, I use:
<?php }
}
For those not using Thesis, you can simply add the code for the social bookmarking networks you would like to include at the end of your posts into your Single Posts (single.php) template after the <?php the_content(); ?> and before the <?php comments_template(); ?>
About the WordPress Thesis Theme Customization Series
Originally, I had planned on making one comprehensive article about my Thesis Theme customizations, but after only finishing two sections, I realized that this article would be a bit overwhelming if it was a all in one job. So instead, I’m breaking it up into a series:
- Part One: Thesis Options & Design Options
- Part Two: Plug-ins
- Part Three A: Custom Coding of the Background, Header, Navigation Bar & Sidebar
- Part Three B: Posts & Social Bookmarking Icons
So stay tuned for Part Three C to see what custom code and styles have been implemented to customize footer section.
Thesis Questions
If you have any questions regarding customizations of the Thesis Theme throughout the series, please let me know via the comments. If I get enough questions, I may add a Part Five of Q&A. And other commentators, if you see a question you can answer, go for it! I’ll add your name & link to the Part Five post, assuming there are enough questions.
About Kristi Hines
Kikolani covers blog marketing and blogging tips for personal, professional, and business bloggers to succeed in search and social media marketing. Kristi Hines is a 
I just switched to Thesis myself (which is how I found this site) and really appreciate your Thesis articles. Keep up the good work! So far my Thesis implementation is very much bare-bones, but I’m working on it.
.-= Mike B. Fisher´s last blog ..Store locator usability: problems and best practices =-.
I’m so enjoying all your tips for Thesis and finally have the time to explore your site in depth and start my redesign. It’s a bit daunting as both Thesis and WordPress are quite new to me and I have no coding experience at all. But you and many others make it possible and fun – until something fails to work properly. Of course such trials are also good learning experiences.
.-= carbonboy´s last blog ..Grand Canyon in (primitive) HDR =-.
Great post about a fantastic theme. You are the only female ProBlogger that I know who always rocks great content. Keep it up lady!
.-= Robert Barr´s last blog ..Tips on Big and Tall Sweater Styles =-.
Fantastic post! It is just filled with wonderful tips and resources.
Thank you
.-= BunnygotBlog´s last blog ..Coco Chanel: Famous Quotes =-.
Hey this is an awesome post. Thanks for this
I am going to try this whole thing tomorrow for sure
Thanks Again 
.-= Mrinmay Bhattacharjee (mrintech)´s last blog ..Roundup of 15 Top & Useful Posts: Part 2 =-.
Finally I found it. Thanks for the image code social bookmarking icons, Its helpful. Great post.
.-= Kuudo´s last blog ..TRAVOLTA — I WAS TOLD JETT WAS ‘NOT ALIVE’ =-.
wow great work on customizing thesis i like it nice word press theme with socail bookmarking icon i love it!!!
.-= SEO Company´s last blog ..Linux Hosting Plan =-.
nice post on word press theses and good use of social book marking site (Digg, stumble upon, reddit, twitter) i like this post thanks Kristi….
Kristi, these are the first social bookmarking instructions that have worked on my site! Thank you so much for the clear directions.
Pam at MindChops
.-= MindChops´s last blog ..The Beatles and Your Autobiographical Memory =-.
Thanks Kristy.
I’m going to include the tweetmeme solution on my blog. Did you notice I’ve changed my theme to thesis too?
.-= Haroun Kola´s last blog ..How To Cleanse Yourself Using Your Website And Achieve Permanent Positive Shift In Life =-.
I have tried to keep my plugins to a minimum, so I also put the tweetmeme button into a function. It makes sense to do this when you have many other plugins and trying to keep your server load down.
.-= George Serradinho´s last blog ..Produce Fake Google Adsense Earnings =-.
Hi Kristy,
Thanks for sharing the codes. I have actually used it as a pattern along with another codes created by Sugarrae plus introducing some attractive icons. It works really amazing.
.-= Mathdelane´s last blog ..Typhoon Ondoy Victims Need Help =-.
will surely give it a try..as always, comes up with something which will help a lot of people (newbees) like me..Thanks Kristy for sharing this
.-= SeoInra´s last blog ..Want me to follow you on twitter?…10 Reasons I Won’t ! =-.
Thanks for this useful tut on customizing thesis. Will try for myself soon
.-= steppinout´s last blog ..Add New Fonts To Your Thesis Theme =-.
Kristi, Excellent tips, thanks for sharing. It’s really helpful to be able to see “real life” examples in actual use. Especially for those of us using Thesis
.-= Mike´s last blog ..35 Internet Explorer Keyboard Shortcuts =-.
Thank you for the wonderful tutorial. Although i dont have thesis theme, i love the way people can customize it easily. i always fancy to buy one thesis theme. I have a one question for you. How can you display all the categories in the footer (3 column)?
Excellent post, helped me lots to understand how to customize Thesis theme!
.-= Hesham´s last blog ..My Life Thinking is Upgraded to WordPress 2.8.5 =-.
how do I add RT@myusername in the tweetmeme script..??
The Tweetmeme in the byline is perfect. This my be a dumb question but can anyone help me with the code if I don’t want the comments, or the category but I’d also like to add a Google Buzz button and FBshare but like the retweet in the byline?
I’m dumb when it comes to this stuff. This is the best help I’ve found so far. I’d like to take it one more step and get all three buttons in my byline.
.-= New from Red Beard 5 Reasons to Beleive that YouTube is the Beginning of the Apocalypse =-.
And thank you this mod really looks great on my site.
ps. – Your NAV menu bar is smoking!
.-= New from marcelino It’s Right to be Wrong =-.
With Google now counting speed in its algorithm, I decided to eliminate my TweetMeMe button and SexyBookmarks buttons. I figured this would help speed up my page load time. Plus, I don’t get much, if any, traffic from social networks.
Would manually inserting sociable links slow my page load time any?
.-= New from Chuck Edwards@Weight Loss Tips Pregnancy Yoga: Exercise for your Baby =-.
Hello GREAT POST
. I am trying to add to my functions file the code and I am geting an error Parse error: syntax error, unexpected ‘}’ in blah blah on line 63. Can you help at all.
Thanks,
What a great post – I have been using Thesis for about a year now and am just scratching the surface of what I can do with it. I can’t wait to go try these suggestions on my own sites.
Thanks so much for sharing!
I so wanted this to work! You wrote:
in the custom_functions.php, I add a custom byline function to the Thesis byline item hook using this code: [...]
In my custom_functions.php, I see nothing that says anything about a byline hook. All I have is code for my header. So I just added the code you gave below it followed by the code for the tweetmeme, but nothing showed up. What is it that I am not getting? Anybody?
Kristi,
Thanks for sharing. I love the codes you’ve just shared!
It’s just amazing!
Firstly thanks mate appreciate it. This is one a a very small number of thesis sites that I have book marked — I come back to this site again and again, thank you for all your hard work.
Secondly I am using a skin from thesis themes and therefore have no idea on how to adjust the function php and do it that way i.e. by creating a custom page template — because the skin uses a custom page template for a “portfolio style” page.
That being said would you recommend another way — and why would removing the sidebars via css NOT be optimal ?
Appreciate your help
Anuj@improve google pagerank recently posted Improve Google PageRank – The Fastest Ways