Amazing Blogger Tricks

"About Me" or "About Author" widget is one of the best widget that brings beauty to any blog or website. We see most of the bloggers online use a customized stylish "About Author" widget for their blogs or websites. The stylish widget will always enhance the look of your blog and makes the blog viewers know about the blog author. If the About Author widget looks routine and not attractive we can't expect the views for About Author page. This widget helps you to expand your social networking stength which could help you in publicizing your online content and could help you in getting more audience by simply adding an attractive "About Author" widget. So we should need a "About Author" widget and and is of no use if it's not attractive.

Let us see the process of adding "About author" or "About Me" widget on Blogger.

1. Go to: Dashboard -> Layout -> Add Gadget -> HTML/JavaScript

2. Paste the below code in Content area.

<h2 class="title"> About Me</h2> <div class="widget-content">  <style> } #amazing-bloggertricks:hover { border:2px solid #ccc; cursor:pointer; } .opacity { opacity: 0.5; margin-right: 50px; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; -webkit-transition: all 0.5s ease-out; -ms-transition: all 0.5s ease-out; transition: all 0.5s ease-out; -moz-transform: rotate(7deg); -o-transform: rotate(7deg); -webkit-transform: rotate(7deg); -ms-transform: rotate(7deg); transform: rotate(7deg); } .opacity:hover { -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); -moz-box-shadow: 1px 1px 4px #000; -webkit-box-shadow: 1px 1px 4px #000; box-shadow: 1px 1px 4px #000; } </style>  <style> #amazing-bloggertricks { border:2px solid #888; margin:2px 5px 0px 0px; padding:2px; } #amazing-bloggertricks:hover { border:2px solid #ccc; cursor:pointer; } .opacity:hover { opacity: 1; -moz-box-shadow: 1px 1px 4px #000; -webkit-box-shadow: 1px 1px 4px #000; box-shadow: 1px 1px 4px #000; } </style> <img class="opacity" id="amazing-bloggertricks" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgR4xLCUpWMz3DhsAju-ETbj8c6EsgDqMxje4vu70wBPkSAOXPeQH3I9y3IM51-_E9OwhwiTJRpe6TTiD9zoJOxd5FQIEY0wBJX7u5EHODgrrrKtdGQwz2iaFCQhSM5KyxVIhs_cBfu_GdB/s1600/15694530_h8vngj9_1369589815.jpg" width="100" /> <div style="font-family: Arial Tahoma Verdana; font-size: 12px; text-align: justify; "> <b>Founder & Author:</b> Hi Friends, my name is Arun Kumar Choppara. I am a Software Test Engineer working for a MNC company and also a blogger and addicted web developer. I have started blogging as a hobby and now addicted to it.</div> <a style="color:#5634;" href="http://amazing-bloggertricks.blogspot.in/p/about-me.html" target="_blank">...Read More</a> </div>

From the above code, you need to change few thinks as highlighted below.

<img class="opacity" id="amazing-bloggertricks" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgR4xLCUpWMz3DhsAju-ETbj8c6EsgDqMxje4vu70wBPkSAOXPeQH3I9y3IM51-_E9OwhwiTJRpe6TTiD9zoJOxd5FQIEY0wBJX7u5EHODgrrrKtdGQwz2iaFCQhSM5KyxVIhs_cBfu_GdB/s1600/15694530_h8vngj9_1369589815.jpg" width="100" /><div style="font-family: Arial; font-size: 12px; text-align: justify; "><b>Founder & Author: </b>Hi Friends, my name is Arun Kumar Choppara. I am a Software Engineer by profession and also a passionate blogger. I have started blogging as a hobby and now addicted to it.</div><a style="color:#5634;" href="http://amazing-bloggertricks.blogspot.in/p/about-me.html" target="_blank">...Read More</a>