Are you want that your reader now about you, your twitter account and facebook profile. There is a easy solution. You can easily add “ about the author” box below the every post. You have to just add some HTML code in your HTML file of template. Here I give you step by step guide how to add about the author box below every post. Just follow the step.
You like to read:
- 5 Bad habits of blogger, must avoid it.
- How to make all hyperlink open in new tab
- How to Edit HTML in new Blogger interface
How to Add “About The Author” Box below the below the every post.
1. Login to your blogger profile
2. Go to Design and click on Edit HTML, and tick the Expand HTML check box
3. Search for the following code( Press Ctrl+F)
]]></b:skin>
4. Just below the Above code paste the follow piece of code.
.author-box {
background: #F7F7F7;
margin: 20px 0 40px 0;
padding: 10px;
border: 1px solid #E6E6E6;
overflow: auto;
}
.author-box p {
margin: 0;
padding: 0;
}
.author-box img {
background: #FFFFFF;
float: left;
margin: 0 10px 0 0;
padding: 4px;
border: 1px solid #E6E6E6;
}
5. Now find the <div class=’post-footer-line post-footer-line-1′/> code , and below this , paste the code
<b:if cond=’data:blog.pageType == "item"’>
<div class=’author-box’>
<p><img alt=” class=’avatar avatar-70 photo’ height=’70′ src=’Your Photo Link’ width=’70′/><b>About the Author</b><br/>
<div style=’text-align: justify; font-family: verdana; color: rgb(0, 0, 0);’>Write Something About yourself<br/>
Follow Me on Twitter <a href=’ Your Twitter Link ‘>Your Twitter link Anchor text</a>
<p style=’margin:-8px 0′><br/><center>
<a href=’ Your Blog link ‘ style=’text-decoration:none;font-size:70%;’>Your Blog Name</a></center>
</p></div></p></div>
</b:if>
6. Change the Following things as your own wish
- Your picture link
- About the author
- Write something about yourself.
- Your twitter link
- Your twitter link anchor text
- Your blog link
- Your blog Name.
7. Now save your template. You down it.
I think this post is useful for you. If you like this post and my blog please share on facebook and twitter.
Must read :
- How to add floating “go to top” bottom in blog
- How to stop copy paste function on your blog
- How to add page element above the header
- How to add Funcy Bookmark bottom in every post
If you have any problem please feel free to asked with mw via comment.
