How to add stylish Author widget & Subscribe form in Blogger Blog

Every third person keep searching for any elegant widget for their blogs. Author's bio widget pays an important role for visitors. Visitors on Bloggertheme9.com keep asking for different widgets. It was getting difficult to reply everyone's comment. So, i thought to start publishing their queries on this blog.
Many visitors are keep to know who's the author behind this article / post. Others are interested to follow or subscribe your blog. We've amended subscribe form below author widget. As a designer our 1st concern is on fonts, image design and background shades. We'll publish about multi author widget in next article.

How to add Author widget & Subscribe form below Blogger Post:

You can see Elegant font and eye-catching color combination in this demo. On Bloggertheme9.com author widget is added in every template. Will surely add social bookmark buttons on next widget. Live Demo :

Adding CSS code for Subscribe form and Author widget

  1. Go to Dashboard > Template > Edit HTML > Expand Widget Templates.
  2. Now search for
  3. Copy and Paste below CSS code before it.
Css
.author-box {background: #F7F7F7; margin: 20px 0 20px 0; padding: 10px; border: 1px solid #E6E6E6; overflow: auto; font-family: Georgia,"Nimbus Roman No9 L",serif;font-size: 15px;font-style: italic;line-height:20px;} .author-box img {background: #FFFFFF; float: left; margin: 0 10px 20px 0; padding: 4px; border: 1px solid #E6E6E6; height:75px; width:70px;} .sub-dd{border: 1px solid rgb(204, 204, 204); padding: 3px; text-align: center; font-size:14px; font-style: italic; font-family: Georgia,"Nimbus Roman No9 L",serif; margin:0 0 25px;}

Adding HTML code for Author and Subscribe form widget

  1. Search for code
  2. Some template have this code twice or thrice.
  3. Search for the last one and post this HTML code below it. Click save and done!
Html
<b:if cond='data:blog.pageType == "item"'> <div class='author-box'> <img class='' src='http://2.bp.blogspot.com/-75sZWrYeQo0/UlCcqKxideI/AAAAAAAACAQ/gwgXgyh8t1I/s1600/author-logo.jpg'/> <b>About <a href='Author-Profile-URL'><data:post.author/></a></b> <div>Write admin description here...<br/> <a href='Author-Profile-URL'>View all posts by <data:post.author/>→</a><br/> </div> </div> <form action='http://feedburner.google.com/fb/a/mailverify' class='sub-dd' method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggertheme09&loc=en_US;, 'popupwindow', scrollbars=yes,width=550,height=520');return true' target='popupwindow'>Subscribe to this Blog via Email : <input name='email' style='width: 160px; background-color: rgb(255, 255, 160);' type='text'/> <input name='uri' type='hidden' value='bloggertheme09'/><input name='loc' type='hidden' value='en_US'/><input type='submit' value='Subscribe'/> </form> </b:if>