How to Add an About Author Box in Thesis 1.6

After posting a general tutorial on How to Add
an About Author Box in the Post Footer in WordPress yesterday, my visitor traffic soared and quite a few persons were asking me how to add the author box to the Thesis theme. So since I like to please my readers, here’s a short and easy tutorial on how to get it done.

Step 1 – Add your bio to wordpress

Fill out your profile information in the wordpress Users’ Profile section. Ensure to add your first name and your site’s name because the script will be calling and displaying this information on your posts.

Step 2 – Code in the Custom_functions.php file

Access your Thesis Options (Located at the bottom-left in your wordpress admin) and select Custom File Editor, this is where you will add the code to call the bio information. Within the thesis custom file editor, ensure that custom_functions.php is selected in the file selection drop-down menu at the top. If it is not selected then select it from the drop-down menu and click Edit Selected File.

Then add the code below at the end of the file and click save:

function post_footer() {
if (is_single())
{
?>
<div class="postauthor">
<?php echo get_avatar( get_the_author_id() , 120 ); ?>
<h4>Article by <a href="<?php the_author_url(); ?>">
<?php the_author_firstname(); ?> <?php the_author_lastname(); ?></a></h4>
<p><?php the_author_firstname(); ?> has written <strong><?php the_author_posts(); ?></strong> awesome articles for us. <br/><br/><?php the_author_description(); ?></p>
</div>
<?php
}
}
add_action('thesis_hook_after_post_box', 'post_footer');

Note: For the code in the bold highlight above, the RSS feed addresses should be changed to your own.

Step 3 – Code in the Custom.css file

Within your custom file editor select Custom.css from the drop-down menu and click edit selected file. Then add the css code below at the end of the file and hit save:

.postauthor { background: #F5F5F5; border-top: 1px solid #e1e1e0; border-bottom: 1px solid #e1e1e0; overflow: hidden; padding: 1.5em; }
.postauthor img { border: 5px solid #e2dede; float: left; margin-right: 1.5em; }
.postauthor h4 { color: #666; font-size: 2em; margin-bottom: 5px; }
.postauthor p { color: #515151; font-size: 13px; margin-bottom: 12px; }


You should end up with something like this: And that’s it. Hope you found this useful.

Please let me know if this works for you or if you have any difficulties. Everybody is going crazy over the Thesis theme, can anyone convince me as to why I should switch?

Related posts:

1. How to Add an About Author Bio Box in the Post Footer in WordPress
2. How to Highlight Author Comments & Edit Your Reply Button in Thesis
3. How To Create A Custom Front Page In WordPress
4. How to redirect web pages using a very simple PHP code
5. Secure Your WordPress Blog Against Malicious URL Requests

Tagged as: About Author, code, php, thesis, tutorial, wordpress