Professional Footer Quote Author Box Widget For Blogger

Having an author box and about us page is very much important, because All bloggers and visitors love to know about the person behind the blog .Keeping Author Box in blog footer makes your blog professional and Outstanding .You might have come across such widgets in WordPress blogs and Other websites , but unfortunately there is non for blogger.So,Today I have made this widget for blogger users!!To Get this Widget,we just need to add some code in our Widget box.This widget also helps to get Authorship in Google Search Results.We Highly recommend to 

place this widget in footer


After working out this post you will end up something like this :

How To Add This Widget To Blogger:

• Go to Blogger > Layout > Add A Gadget > HTML/JAVASCTIPT
• Paste the following coding inside it:

• <style>.quote_box{width:225px;margin-top:12px;background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0Ud2ZrQ4V7u0fP4W18jprrJdHmeyFi0gbXrviL_WgLWQYZASslgERXYrhNVlCk-pvNeDLdBYG9wxC3m-4uUDDisI2_LgXkNBEi-7L_7CnePd3RRtVOjwy66rb9u4fG0KwjwG2Z7Yss8LR/s320/footer+author+quote.PNG) no-repeat 94% 7%;border:1px solid #b6b6b6;position:relative;padding:18px}.quote_box:before{border:15px solid;bottom:-30px;content:'';height:0;right:40px;position:absolute;width:0;border-color:#b6b6b6 transparent transparent #b6b6b6}.quote_box:after{border:14px solid;bottom:-27px;content:'';height:0;position:absolute;right:41px;width:0;border-color:#fff transparent transparent #fff}.quote_content{overflow:hidden}.detail_box{float:left;margin-left:0}.detail_box span{display:block}.detail_box span.name{font-size:17px;line-height:30px}.detail_box span.derole{ color: #666666; font-size: 15px; font-style: italic; line-height: 10px;}.said_box{ font-size: 20px;float:left;margin-top:-130px;margin-left:72px}.said_box span.roleau{ color: #333333; font-size: 16px; font-style: normal; line-height: 20 px;}.custom li.quotes,.custom li.widget.quotes p{margin-bottom:0} </style> <br /> <div class="quote_box"> <div class="quote_content"> <divclass="detail_box"> <img alt="Gurjinder Singh" src="YOUR 125 X 125 IMAGE URL"style="border-radius: 777px 777px 777px 777px;" title="Gurjinder Singh" /><spanclass="derole"></span><br /> <span class="derole">Man</span><br /> <spanclass="derole">Behind</span><br /> <span class="derole">This Blog</span></div>

  <div class="said_box"> <a href="YOUR GOOGLE + URL"rel="author" target="_blank">Gurjinder Singh</a><span class="roleau"></span><br /> <span class="roleau">I'm the owner and founder of This Blog Iam From Spain Iam Doing Study In I.e.s Gerardo Molina Spain...<a href="YOUR ABOUT US PAGE URL" rel="author"target="_blank">More</a></span></div> </div> </div> </div></div>

  Customisation:

  • Just Replace Gurjinder Singh with your name.
  • And Replace Other Bold Texts with mentioned above.
  • Replace Blue Text with your Description.Thats all!
  I hope you liked this widget very much.Please take few seconds to share with your friends.