Insert About the Author Box Below All Post inward Blogger

For a Blogger its real of import to say the his audience who is the writer of the weblog as well as “About the Author” is the best & most successful way to make awareness among the users who is the behind the success of this blog.

You accept seen many WordPress weblog which has About the Author Widget below every post.So I Thought why our Blogger users remains behind thence today nosotros will Add “About the Author” Box At the End of Each Blogger Post. 


I am for certain that y’all volition dearest to preview About the Author Widget so Here it goes


How To Get Started:

  • Go to Blogger.com >> Template >> Edit HTML >> Proceed
  • Search For ]]></b:skin> and exactly inward a higher house it Place the next CSS styles

.MBL-About-Us {

margin-bottom:10px; height:180px; background:#FFFADF; padding:10px; border:1px solid #FFD324; -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; box-shadow: 2px 2px 2px #CCCCCC;

}
.MBL-About-Us p {
color:#666; text-align:justify;
}
/*.MBL-About-Us p a {
color:#666; text-decoration:underline;
}
.MBL-About-Us p a:hover {
color:#ddd; text-decoration:none;
}*/

Customization:  

I accept kept all the Css Editable so y’all tin customize it according to your template style.

  • To alter background color of the Author Box Replace #FFFADF 
  • To alter edge color Replace #FFD324 

Now Save the Template make for certain the template is mistake free.Now banking concern jibe (Tick) Expand the widget as well as search for  this line <div class=’post-footer-line post-footer-line-1’/> You tin search intently with (CTRL+F).After y’all abide by the trouble glue the next code exactly nether the line

<br /><div class=”MBL-About-Us”><img align=”left” src=”http://1.bp.blogspot.com/-qYrjQEFk7WU/T3BIfrE5ASI/AAAAAAAABCM/QfbICDlDHAA/s1600/Faizan.jpg” style=”border-right-color: rgb(255, 211, 36); border-right-style: solid; border-right-width: 1px; margin-bottom: 20px; margin-left: 0px; margin-right: 10px; margin-top: 10px; padding-bottom: 20px; padding-left: 0px; padding-right: 10px; padding-top: 10px;” /><br /><span style=”font-family: Verdana, sans-serif;”>Your Authors Details Here</span></div></div>

Customization:  

1.To Insert Your Author’s Image simply Replace http://1.bp.blogspot.com/-qYrjQEFk7WU/T3BIfrE5ASI/AAAAAAAABCM/QfbICDlDHAA/s1600/Faizan.jpg with your image.
2.To Insert Details nearly the Author Replace Your Authors Detail Here
3.To Change the text mode replace Verdana

After Customizing your Author box according to your postulate uncomplicated Save the Template as well as immediately y’all volition last able to run into “About the Author box” below all blogger posts.


Credits:  

All the credits goes to MybloggerTricks.com as well as Mustafa Sir he had coded this brilliant style.I accept exactly optimized it for you.If y’all accept any difficulties in this or whatever other topics experience costless to inquire till so Peace Blessings as well as Happy Optimizing  

Hosting Unlimited Indonesia


Sumber http://www.mybloggerlab.com