My previous post was about adding more than one authors for your blog. When you add 1 or more authors to your blog then you also think about it that how to show brief introduction and something about the author who is writing the post. You might have the box for showing below every post having some description about the post author in your template. But this is good if you are the only author for your blog. In case, you have more than 1 authors, you have to add "About Author" detail box below the relevant post of that author. Here is the method to follow which you can automatically show the "About Author" box below every post of relevant author.

• Firstly, you must have the link of the author picture. (If you do not have already then you can add it in new post and save it as draft, you can get link from "HTML" editor)

1. Go to blogger dashboard and select "Template" from more options.
2. Now click on "Customize" and then select "Advance"
3. Add the following CSS code:

.about-author {
width : 98%;
overflow : hidden;
margin:10px 0px;
border:0px;
}

.about-author img {
width:70px;
padding:3px;
border:1px solid #ddd;
margin:0px 5px 0px 0px;
}
.about-author h3{
font-family:verdana !important;
font-size:18px !important;
margin:9px 0px !important;
color:#191631 !important;
border-bottom:2px solid #666 !important;
border-top:0px !important;
}
.about-author p {
margin:0px;
text-align:justify;
color:#666;
}

• You can change the color of text heading "About Author" by changing color:#191631 code.

• Click on "Apply to Blog" and then "Back to Blogger"
• Now click on "Edit HTML" from the "Template" and "Expand Widget Templates" 
• Press ctrl+F and search the <data:post.body

• Now copy the following code and paste it just after the <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:post.author == &quot;AUTHOR NAME&quot;'>
<div class='about-author'>
<h3>About Author:</h3>
<img align='left' src='Link of Author's Picture'/>
<p>Write Something about Author Here</p>
<p>Follow him @ <a href='Twitter Page Link' target='_blank'>Twitter</a> | <a href='Facebook Page Link' rel='nofollow' target='_blank'>Facebook</a></p>
</div>
</b:if></b:if>

Author: Muhammad Faheem Usama