Monday, September 30, 2019

Insert Almost The Writer Box Below All Postal Service Inwards Blogger

For a Blogger its real of import to say the his audience who is the writer of the weblog together with "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 thus today nosotros will Add "About the Author" Box At the End of Each Blogger Post. 


I am for sure that y'all volition dear 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 to 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 shipping away 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 sure the template is mistake free.Now banking enterprise gibe (Tick) Expand the widget together with search for  this line <div class='post-footer-line post-footer-line-1'/> You tin shipping away search intently with (CTRL+F).After y'all abide by the draw of piece of employment glue the next code exactly nether the line

<br /><div class="MBL-About-Us"><img align="left" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhK2BXN_YzFa-rPoPdR02YSXl8RmBcAtRVKqPny7T1lW6fGgFEo206WVuMQoe08KVDQsb8Hl53iynBT-9wPXqgqnE4Aj6boHAK2DTI6dLB-7ok5Gr78ALxlrlcKPpd3Py8pGiO4iErErFQ/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 https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhK2BXN_YzFa-rPoPdR02YSXl8RmBcAtRVKqPny7T1lW6fGgFEo206WVuMQoe08KVDQsb8Hl53iynBT-9wPXqgqnE4Aj6boHAK2DTI6dLB-7ok5Gr78ALxlrlcKPpd3Py8pGiO4iErErFQ/s1600/Faizan.jpg with your image.
2.To Insert Details close the Author Replace Your Authors Detail Here
3.To Change the text agency replace Verdana

After Customizing your Author box according to your postulate uncomplicated Save the Template together with straightaway y'all volition live on able to encounter "About the Author box" below all blogger posts.

Credits:  

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

No comments:

Post a Comment