[Thesis Tutorials] Add Author Image Next to Post Title

Thesis Theme is quite lucky to have a great support community worldwide and bloggers feel much easier to tweak the ugly Thesis to a beautiful one with several steps. Further, these tutorials are not free of charge from different designers and coders who are also fans of Thesis.

I myself learned a lot from you guys especially some great designers. However, many of them have not shared all of what we need then DIYThemes support forum would be the best place to raise the question and get timely supports. That is why I got several unique tutorials that I have never found out through searching around on the internet or Google.

Today, I would like to share a very simple tutorials that help you guys who are running co-authored blogs to show gravatar of curtain author next to their post on homepage and single posts. This would help readers easily identify who is the author of this posts. This can also be a good way to promote those author personal branding as a credit from blog owners.

One thing that I would like to remind you guys about this tips is that I will use gravatar image based on the author email. If that author email has not registered with gravatar, the default image will display instead.

Demo on eblogviet.com

Here is the tip and hope you like it too:

First, you should open your custom_functions.php file either by FTP/Notepad++ or right in your Thesis Options->Custom File Editor if you are running Thesis V1.6. Here is the code that you need to paste on this file:

function author_avatar() {
    echo get_avatar( get_the_author_id(), 40 );
}
add_action('thesis_hook_before_headline', 'author_avatar');

You can change the size of avatar from 40px to whatever size you like. However, I am happy with 40px as it fit the space and looks elegant.

Secondly, you continue to open custom.css file and past this code:

.custom .headline_area .avatar {float:left; border:3px solid #ddd; margin-right:1em;}

You can either set this avatar on the left or right by changing the word “left” to “right”. I set it to float left as default.

You can see demo at my other blog http://eblogviet.com. The reason that I could not implement this tutorial on this blog as I have just changed my layout to Blogussion and it conflicted with other code and functions set by Alex. I need to consult with him on how to fix this.

Hope this tutorials help you have more guest bloggers to contribute to your blog!

Related posts:

1. [Thesis Tutorials] How To Integrate Cu3er Post Elements To Thesis Theme Feature Box CU3ER, in a nutshell, is a .swf (flash) file, designed & developed for displaying images...
2. [Thesis Tutorials] How To Boost Thesis Theme Blazing Fast with Gzip This is another that comes from my friends – Hutek – the man I had...
3. [Thesis Tutorials] How To Fix Blogussion Inspired Sidebar Widget Bug Blogussion Inspired 1.0.2 version has fixed some bugs and I was happy with the support...
4. [Thesis Tutorials] Asnio Footer Mod FREE for Thesis Theme Thesis Theme is the best SEO-powered theme for WordPress that any bloggers would like to...
5. [Thesis Skin] Historic Thesis Skin for FREE Today, I would like to introduce you guys a very interesting Thesis skin that I...

Tagged as: author gravatar, author id, author image, beautiful one, blogger image next to post title, blogussion, coders, custom functions, default image, display author image in thesis, display author title next title, eblogtip, Google, gravatar, how to image on posts title in thesis, how to put image on blog post title 2010, notepad, place your avatar beside post thesis, powered by easy forum thesis, several steps, show author image next to title in thesis, simple, the best title of thesis about tutorial, Thesis, thesis author avatar, thesis author image, thesis options, thesis post title, thesis post titles, thesis tutorial, Thesis Tutorials, to add gravatar on your blog post thesis theme