Tuesday , October 17 2017

Add Author Box Below Every Post in Blogger

Author box widget for blogger – The author box is a small section in a blog where the blog’s author can display information about itself, social profile and picture. This is a very handy widget for any blog. Through this widget, you can share your bio with your readers. This a best way for your reader knows about you and increase the blog look as well. You might be seen it, in many blogs. If your blog missing this important feature, then here is step by step guide to add author box in below every post in blogger. The below shared author box not only help you to share the information about yourself but also can display the major social media profile links which can help to increase your follower as well.

Author box widget for blogger

How to add an author box below the every post in blogger

  • Login to your blogger account
  • Select template and then edit HTML
  • After the opening all codes, search ]]></b:skin> by using Ctrl +f
  • Open the below code and copy all coding from appearing pop-up window and paste it just above it.
Now search <data:post.body/> and add the below code just above it.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
 <div class='wc-aboutauthor'>
 <div class='wc-aboutpic'>
 <img alt='Author image' height='100' src='https://2.bp.blogspot.com/-ZCfU6eTFMtQ/VwSzVDVibyI/AAAAAAAABng/7xJOxzCyMvc6EDLqPRvF9aA7NkErRfm4w/s1600/Co-Author.jpg' width='100'/>
 <h5>About Me :</h5>
 <div style='text-align: justify;'>
 <b>YOUR BIO HERE</b></div>
 <div class='wc-aboutsoc'>
 <p> Find us on Socail Media
 </p>    <a href='https://facebook.com/ID' rel='nofollow'><img src='http://4.bp.blogspot.com/-frQJd3hM3_g/U52-1HBbhMI/AAAAAAAAJo0/hd3eEmdb5Dw/s1600/Facebook+Square.png' target='_blank' width='40px'/></a>
 <a href='https://twitter.com/ID' rel='nofollow'><img src='http://1.bp.blogspot.com/-labHOmSWZO4/U52-67X2qBI/AAAAAAAAJps/i31FhIunKWk/s1600/Twitter+square.png' target='_blank' width='40px'/></a>
 <a href='https://plus.google.com/ID' rel='nofollow'><img src='http://2.bp.blogspot.com/-DqK2gGKhHuc/U52-1SJFBnI/AAAAAAAAJo8/CIO8FwIXPVg/s1600/Google+plus+square.png' target='_blank' width='40px'/></a>
 <a href='http://youtube.com/ID' rel='nofollow'><img src='http://4.bp.blogspot.com/-m-c8BwrVEm4/U52-681QNaI/AAAAAAAAJpo/2oVBdElHSg8/s1600/Youtube+square.png' target='_blank' width='40px'/></a></div>


Replace ID with Facebook, twitter, google plus and YouTube ids.
Replace https://2.bp.blogspot.com/-ZCfU6eTFMtQ/VwSzVDVibyI/AAAAAAAABng/7xJOxzCyMvc6EDLqPRvF9aA7NkErRfm4w/s1600/Co-Author.jpg with your picture (host it on picasa)
YOUR BIO HERE write here about yourself
After the doing all changing, now click on the orange save button. Now visit your blog and preview any post,  hopefully, you will be looking the author box in the below the posts.

Need more help!

This is a tested widget and works on all blogger template except dynamic template which isn’t supporting customization.  However, if you are facing any problem with adding the author box in blogger then place your comment in below. Thank you for visiting our blog.

Check Also

social media share button for blogger

Responsive Social Media Share Buttons for Blogger

Are you looking for social media share button for blogger? In this post, I want …

One comment

  1. why not working this code in blogger simple template?

Leave a Reply

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