How To Add Unique Subscription Widget With Social Button Below Post To Blogger Blog ~ BLOGGER HEROE

Email subscription box is usually a strong gadget for each blog.If you have more no of subscribers then clearly they're going to contribute to the massive no of traffic on your blog . Subscribers are the backbone of any successful blog. The additional audience you have the stronger you get. people subscribe to your Feeds only if you publish quality content. therefore it's important that you just could attempt each possible means of accelerating the amount of subscribers to your blog whether you're a Wordpress user or Blogger user. By using this unique subscription widget you will link your social media profile Facebook, Twitter Rss Google Pinteret and and subscribe field. it'll facilitate to induce the new updates by emails. you'll be able to check it from below demo link .
Related Articles:

LIVE DEMO

How To Add This To Your Blogger/Blog

Go to Blogger > Template > Click Edit HTML.
Search CTRL + F for this piece of code:<data:post.body/>
Copy and paste the below code just after <data:post.body/>

<h2 class="title" style="font-weight: normal;">
<b><span style="font-size: medium;">Subscribe to Blogger Heroe Today! Receive the Latest Tutorial via email!</span></b></h2>
<style type="text/css">
#bloggerheroe-subscribe-wrapper {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIB60vIQocRNBmteVMpOwXtPB-oEZDMY3JbZMRek2aPGP7hVGW__PUh6uQ8VFzPZWnL9tCyeOqAyuqIlmRk7t-QNydIaCRFOI5rfsH853Jg5x6rT_Smp16Cdt44lXqyx4TgxZA6OI6QKk/s320/border.png) repeat scroll 0 0 transparent;
padding: 3px;
}
#bloggerheroe-subscribe-box {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0mpiVR6LVVBttAX6H9ufPP8QZxXER1bve89Ogub-rCjW0PXts_yGOWa1re80loXUtXKU4_dzToFEAZkiqgK0rcpGuvf51VzUzRXBWsDmWpgA3SU_KJsyIPBRgSg5ipgKEe6x7k1LpzWE/s320/bg.png) repeat scroll 0 0 #F7F7F7;
border-radius: 15px;
padding:5px;
overflow: hidden;
}
a.linkopacity img {
filter:alpha(opacity=75);
-moz-opacity: 0.5;
opacity: 0.5;
-khtml-opacity: 0.5;
-webkit-transition:All .5s ease;
-moz-transition:All .5s ease;
-ms-transition:All .5s ease;
-o-transition:All .5s ease;
transition:All .5s ease;
padding: 3px;
border: 1px solid #999;
}
a.linkopacity:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
-khtml-opacity: 1;
-moz-box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.44);
-webkit-box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.44);
box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.44);
}
#bloggerheroe-subscribe-box:hover table {
top: 0;
}
#bloggerheroe-subscribe-box h1{
margin-top: 5px;
color: black;
font-family: arial;
font-size: 15px;
margin-bottom: 5px;
line-height: 14px;
font-weight: bold;
text-align: center;
letter-spacing: -1px;
}
#bloggerheroe-subscribe-box table {
position: relative;
top: 40px;
-webkit-transition:All .5s ease;
-moz-transition:All .5s ease;
-ms-transition:All .5s ease;
-o-transition:All .5s ease;
transition:All .5s ease;
margin-bottom: 0px;
}
#bloggerheroe-subscribe-box td {
padding: 2px;
}
#bloggerheroe-subscribe-box input{
background: white;
border: medium none;
font-size: 12px;
padding: 10px;
width: 150px;
color: #666;
font-family: arial;
margin-bottom: 3px;
width: 55%;
}
#bloggerheroe-subscribe-box input:focus{outline:none;}

#bloggerheroe-subscribe-box .submit{
background: #E73827;
color: #fff;
cursor: pointer;
font-weight: bold;
text-shadow: 0 1px 2px black;
width: 90px;
font-family: arial;
margin-left: -3px;
font-size: 14px;
}
</style>

<br />
<div id="bloggerheroe-subscribe-wrapper">
<div id="bloggerheroe-subscribe-box">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggerheroe', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<center>
<input name="email" onblur="if (this.value == "") {this.value = "enter your email address...";}" onfocus="if (this.value == "enter your email address...") {this.value = ""}" size="20" type="text" value="enter your email address..." />
<input name="uri" type="hidden" value="bloggerheroe" />
<input name="loc" type="hidden" value="en_us" />
<input class="submit" type="submit" value="subscribe" /></center>
</form>
<center>
<table>
<tbody>
<tr><td><a class="linkopacity" href="http://feeds.feedburner.com/Bloggerheroe" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj36XX_g9LcICt-UFg-mrOS6pJrgx8nAAOyrOse03XH0Ush-jEi3djP12fN8Ds0wOEt37r6zRaTZKrdH2A5l7MrE_L_6z3iHnLA_yCDqIZ2ipMSZyP9i-g-eRNlQwbT5npa7XW_I0lzAMQ/s1600/rss.png" /></a></td>
<td><a class="linkopacity" href="http://www.facebook.com/bloggerhero" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhlfg6MY0Eknql1Xdx7qdNCV86FVO58upvriiOplF4aRjWurHnufZNj-1XI_medmIn5SJic6Md5_KZy9ObceMe8KUdW3E9TRMTB7BwX3PVi4JOAVYic8Ap9UfRyvqEn6lctar308p1odHM/s1600/facebook+logo.png" /></a>
</td>
<td><a class="linkopacity" href="https://twitter.com/bloggerheroe" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmmsH4B68fJIG9md5iQjHNfv4QGNln-VWde3xLBtHjtN7krdMg14OQMs0Oo0vW_3YgghfaLenz5ZQhVxILdgWnSNem87bUnC5kVznuCe18RWKuAocROnMmhXp5bR1DbAWzw-OEMz5foPM/s1600/twitter.png" /></a>
</td>
<td><a class="linkopacity" href="https://plus.google.com/106957260261276964704" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic8jsod64K-M0IOpQzUbxdF6vov4aCIfeFFmcQucEuiag2KLgkPnC2kxHeAUghTPeVE4x1J0Gphqqc0nwNLAFJYIxlq5AUbGEo9I6DqyRC1_UgqIeTe20DTciCube-PdyZxCMmUF6IrME/s1600/Google.png" /></a>
</td>
</tr>
</tbody></table>
</center>
</div>
</div>