Add Email Subscription Box Below Every Post In Blogger

Yesterday i posted about Add Meta Tags To Your Blog For Better SEO .Today i will show you how to add email and social subscription box below every post.A subscription box doesn't really help you out to get the highest level of subscribers when it's on the sidebar. If you have a subscription box below OUR posts then it may help us to achieve targeted subscribers for your blog.

Subscription box will look like image below:

How to add a social and email subscription box below every blogger posts? LETS START.

Step One: Go to Design => Edit Template [In new blogger interface: go to Template => Edit HTML].

Step Two: Click on Expand widget Template and find /* FOOTER */ .

Step Three: Just above /* FOOTER */ paste the following code.

.stay-connected {
background: #ffffff;
margin: 10px 0 10px 0;
padding: 10px;
border: 1px solid #E6E6E6;
overflow: auto;
}
#stay-icons {
float: left;
margin: 0 5px 0 0;
padding: 2px;
}
/*end stay connected*/

Step Four: Then Find <data:post.body/> and the paste the following code just below <data:post.body/>.

<b:if cond='data:blog.pageType == "item"'>
<div class='stay-connected'><h2>Stay Connected With Free Updates</h2><table border='0'><tbody>
<tr><td>
<a href='YOUR FEEDBURNER URL' imageanchor='1' style='margin-left: 1em; margin-right: 1em;' target='_blank'><img border='0' src='http://cdn1.iconfinder.com/data/icons/functionsocial/Social_RSS.png'/></a></td><td>
<a href='http://twitter.com/USERNAME' imageanchor='1' style='margin-left: 1em; margin-right: 1em;' target='_blank'><img border='0' src='http://cdn1.iconfinder.com/data/icons/functionsocial/Social_Twitter.png'/></a></td><td>
<a href='FACEBOOK PAGE URL' imageanchor='1' style='margin-left: 1em; margin-right: 1em;' target='_blank'><img border='0' src='http://cdn1.iconfinder.com/data/icons/functionsocial/Social_Facebook.png'/></a></td><td>

<div class='spice-email' style='margin-left:20px;'>
Subscribe via Email
<form action='http://feedburner.google.com/fb/a/mailverify' id='feedform' method='post' onsubmit='window.open('FEEDBURNER FEED NAME', 'popupwindow', 'scrollbars=yes,width=520,height=520');return true' target='popupwindow'>
<input class='textarea' gtbfieldid='3' name='email' onblur='if(this.value=='')this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value='';' type='text' value='Enter Your Email'/>
<input name='uri' type='hidden' value='FEEDBURNER FEED NAME'/><input name='loc' type='hidden' value='en_US'/>
<input class='spice-emailsubmit' type='submit' value='Submit'/>
</form>
</div></td></tr></tbody></table></div>
</b:if>

Note: You can also paste this code below <div class='post-footer-line post-footer-line-1'> at times to show it below other widget's. [Don't forget to change the RED texts]

Step Five: Click on Save Template.
yOU HAVE DONE.Now reload your blog and see the magic!.If you face any probleb, just comment below.