Friday, June 15, 2012

Add Author Bio Box to Your Blogger/Blogspot Below Every Blogger Post.


Add Author Bio Box to Your Blogger/Blogspot Below Every Blogger Post.




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

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

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

If You Want To Copy This Code Click Here.

<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>

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

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

If You Want To Copy This Code Click Here.

<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></b:if></div>

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

Step 6: Now Save Template

You are done..


Thanks.... Like Us.... Share Us.....

0 comments:

Post a Comment

Make sure to click the "Subscribe By Email" link below the comment for to be notified of follow up comments and replies..