How To Add Author Bio Box to Your Blogger

How To Add Author Bio Box to Your Blogger Below Every Blogger Post 






1.Login to your blogger dashboard--> Design- -> Edit HTML

2.Scroll down to where you see ]]></b:skin> tag .

3.Copy below code and paste it just After ]]></b:skin> tag


<style type='text/css'>                                 
#Bttoolz Author Box {                                  
background: none repeat scroll 0 0 #EDEDED;                                    
padding: 10px;                                     
margin-top:10px;}                                     
.authoravatar {float:left;margin-right:10px;padding:4px;background:#ccc;border:1px solid #222222;}                                  
.postauthor {float:left;}                                  
</style>

4.Now Scroll down to where you see <data:post.body/> tag.

5.Copy below code and paste it just After <data:post.body/> tag.


<div style='clear:both'/>                          
                                      
<div id='Bttoolz Author Box'>
                                          
<!-- Author Bio-->
                                          
<b:if cond='data:blog.pageType == "item"'>
                                                                               
<b:if cond='data:post.author == "NAME OF AUTHOR"'>
                                                 
<img class='authoravatar' height='39' src='IMAGE URL OF AUTHOR' width='39'/>
                                                 
<div class='postauthor'>                                                      
                                                     
<h3><a href='AUTHOR'URL Here'>NAME OF AUTHOR </a></h3>
                                                     
<p> NOTES ABOUT Your Self </p>
                                                 
</div>
                                                 
<div style='clear:both'/>        
                                             
</b:if>


Note : Replace NAME OF AUTHOR , IMAGE URL OF AUTHOR , AUTHOR'URL Here ,NAME OF AUTHOR NOTES ABOUT Your Self with your content..

6. Now Save Template And You are done..

0 comments