About The Author Widget For Blogger

About The Author Widget For Blogger

Wordpress provides you About The Author widget to tell your visitors about you but on the other hand Blogger gives you nothing like that but still with some editing we can create our own About The Author widget.

Installing :

• Go To Blogger > Template > Edit HTML > Mark "Expand Widget Templates"

• Search For ]]></b:skin> and just above it paste following css :

#ath {
background:#f8f8f8;
margin:0 0 40px 0;
padding:10px;
border: 3px outset #e8e8e8; -moz-border-radius: 10px; border-radius: 10px;
overflow:hidden;
font-size: 14px;
}
.pro {
background:#FFF !important; float:left;
margin:0 10px 0 0;
padding:4px;
border: 2px inset #e8e8e8;
}

• Next Search for data:post.body  

• Just below it paste the following code:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:post.author == &quot;AUTHOR NAME&quot;'>
<div id="ath">
<div>
<img class="pro" height="120" src="Your Pic URL" width="120" /><i><strong style="font-size: 18px;">Your Heading:</strong></i>
Your Description Here.Your Description Here.Your Description Here.Your Description Here.Your Description Here.Not More Word.
Join Me On: <a href="http://www.facebook.com/##########">Facebook</a>, <a href="http://www.twitter.com/##########">Twitter</a>, <a href="http://plus.google.com/##########">Google Plus</a></div>
</div>
</b:if></b:if>

•  Save Template.

Customizing :

• Replace AUTHOR NAME with the account name of the guest author. This name should match exactly the name appearing on his posts.
• Replace all blue fields with your info.