Author information box is now present on most of the WordPress blogs. It gives the info about the author and also contact info about him/her. It also makes your blog more attractive too.
Adding Author Information Box:
- Step 1: Go to
Blogger Dashboard > Design > Edit HTML. Click on expand widgets template.
Look for]]></b:skin>
Now, Add following code just above]]></b:skin>.author_info { float: right; width: 573px; padding: 10px; border: 1px solid #e0e0e0; margin-bottom: 15px; margin-top: 15px; background: #eee; } .author_info h3 { margin-bottom: 10px; } .author_photo { float: left; margin: 0 0 0 10px; } .author_photo img { margin-right: 10px; border: 1px solid #e0e0e0; } - Step 2: Now look for
footer-line-1
It will get<div class='post-footer-line post-footer-line-1'>
Now add following code BELOW it.<b:if cond='data:blog.pageType == "item"'> <div class='author_info'> <div class='author_photo'> <img alt='author' src='http://3.bp.blogspot.com/_tbHfaj1A058/TSGc3fOc-NI/AAAAAAAAL7A/GU6dmnqINik/s1600/images.jpeg'/></div> <h3>About the Author</h3> This article is written by: <b>YourName</b> - who has already written <b>30</b> articles for <a href='YOUR-BLOG-URL'>YOUR-BLOG-NAME</a> YourName is a professional web designer. Catch him on <a href='http://twitter.com/yourtwitterID'>Twitter</a>, <a href='Your Facebook URL'>Facebook</a> or <a href='your e mail ID'>email</a> him <br> </br> <br> </br> YourName's <a href='your web url'>Website</a><br style='clear:both;'/> </div> </b:if>
That's it.