How to Creating Author Bio Box in Blogger

Creating Author Bio Box in Blogger

Author Bio Box is very popular in today, Blogger use bio box for introduce author or blogger write some experience to guideline for reader follow his blog. Ads

This's EASY step for guide you for create simple your bio box by yourself:

STEP 1: Login to blogger ->Go to Dashborad and click Templates buton ->Then click Edit HTML Then press Ctr + F for finding </b:skin> tag in document -- Then paste CSS Code below before area ]]</b:skin>


Sample CSS Code:

.about-author-box { background:#EBF3FB none repeat scroll 0 0; border:1px solid #D4E2E8; font-size:1em; line-height:1.5em; margin:0 0 20px; padding:10px; } .about-author-box img { background:#FFFFFF none repeat scroll 0 0; border:1px solid #9ED0DE; display:inline; float:left; margin:0 15px 0 0; }

STEP 2: Find these codes in the same document

<div class=’post-footer-line post-footer-line-1′> 


Then just after <div class=’post-footer-line post-footer-line-1′> place these codes -

<div class=’about-author-box’> <img alt=’Author name‘ height=’100′ src=’Author image URL here‘ width=’100′/> <h4>Author : <a href=’Author profile URL here‘ target=’_blank’><data:post.author/></a></h4> <p> Author’s short intro here</p> </div> </b:if>


Then CHANGE Author name, Author image URL, Author profile URL and Author’s short intro

STEP 3: Now click “Save template” that’s it finish ….

Recommend Blogger eBook:

This book provides everything about blogger platform for you need to knows blogging. Blogger for dummies popular eBook

Share some idea what do you think?