Social With Email Subscription Widget For Blogger

Checkout this awesome subscription widget with integrated social icons

How To Add This Widget To Your Blogger Blog ?

 1.Go to www.blogger.com and select your desired blog. 

2.Go to the Layout section of your blog. 

3.Click on Add A Gadget. 

4.From the list that appears, select HTML/Javascript 

5.Paste the below code into the box that appears.

 

 div class='widget-content'>
<style type='text/css'>
.social a{padding: 6pt 6pt 6pt 5px;font: bold 12px Calibri,Helvetica, Arial, sans-serif;text-decoration: none;position: relative;display: inline-block;text-shadow: 0 1px 0 #fff;-webkit-transition: border-color .218s;-moz-transition: border .218s;-o-transition: border-color .218s;transition: border-color .218s; background: #f3f3f3;border: solid 1px #dcdcdc;}
.social a:hover {color: #333;border-color: #999;-moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2);-webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);}
.social a:active{color:#000;border-color: #444;}
.sub-box{
background: #fff;
width: 270px;
padding: 2px 5px 7px 7px;
border: 2px solid #000;
border-radius: 15px;
}
.sub-box:hover{
border-style:dashed; 2px solid: #389af2;
}
.emailform{margin:30px 0 0; display:block; clear:both;}
.emailtext{margin:20px 0 0;background:#f6f6f6 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoyCinzAWcbJCBfwFpfBmAsYO_HvDAHAdYtTfu79OGU3LlPX7z0YPObrusO8cprOuBIUHbQsc0EGxg3AcOjGTxJV7aeeCFDtXv0uvsaj1TY5lr7AGcV_tVuHrQ5jss_N4TNjwuQ0miKLM/s1600/email.png) no-repeat scroll 0px center;padding:5px 5px 4px 30px;color:#444;font-weight:bold; text-decoration:none;border:1px solid #ccc;width:170px;}
.emailtext:focus{outline:none;}
.sub-button{color:#eee;font-weight:bold; text-decoration:none;padding:6px 8px; border:1px solid #666;cursor:pointer;background:#ff748c}
.sub-button:hover{color:#eee;border-color: #999;background:#ffa7b6}
</style>
<div class='sub-box'>
<center><div class="social">
<table><tbody><tr><td>
<a href='http://facebook.com/zgamerxs' target='_blank'><img alt='Facebook' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjT9Rpf0PRRhP0oHfi1Vx_Ce9r_SBrz5zOBywTToiRQo-jzdWUD58oMTdU-KAg2WhJcw8ZOSvjcDym3ezJHVSgSvbgeVPQPSwYLraj_61Ah7N6AJLkpBew8i-0m7ecaVEaiTaSgYkTOrXU/s1600/facebook.png" border="0" title='Follow Us On Facebook'/></a> </td>
<td> <a href='http://twitter.com/vishalassassin' target='_blank'><img alt='Twitter' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgF4ZtVv6CI0ES7H9o1Ap3713P6ooXJl_B2AyyanlqUXcBfZubFrOeSn3LL2WIn-ok2qGKJu5Z21ZZu-OmwlhmBAuH553IZlCGF_HRUZ36AnrIOY2kDh3WY2oqcwyCYSfHotEEpyw8L49U/s1600/twitter.png" border="0" title='Follow Us On Twitter'/></a> </td>
<td> <a href='https://plus.google.com/103503580424052614840/posts' target='_blank'><img alt='Google Plus' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipYCmoc3iylcyLVqoe-pVdyNkmMdwrECzFVwz5mqMPGbgaqrc-DrIYXLr8sqt8QXuqA0dp3-mICNGf-h822Olsg91x5JxDubWI-5L4PaP2PTnm4ygeqEVouxaXJHI_YjcqgPsCAwuD3mg/s1600/googleplus.png"  border="0" title='Follow Us On Google Plus'/></a> </td>
<td> <a href='http://www.pinterest.com/vishalassassin' target='_blank'><img alt='Pinterest' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjL58VUB3ora0lY2D-tE4w_RCW7POXhGiyqu-AipWyfdZ3N7TpVtCfg4hprpEU3mU9R9CzThgW1KWIDJZeOqSzChUdnVAy48xHEuEHGjMh-yVKHL6EtoX4-utOpOpaffgVnqfN7zAVFhuY/s1600/pinterest.png"  border="0" title='Follow Us On Pinterest'/></a> </td>
<td> <a href='http://www.stumbleupon.com/stumbler/vishalassassin' target='_blank'><img alt='Stumble Upon' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSMh3yPwEuCkhKgjmN9gzfkbcTbYkmSVOIeMOoOj7Zs2VpTnhEFPSKiRSRQ-ef9CdwE5msapzIVgGkCf0QxqQ1ax3NS37Iku1_BBekimXQ8T6WaBP3zRLLxYrd3D0gAHnaxTR2E9KsHWs/s1600/stumbleupon.png"  border="0" title='Follow Us On Stumble Upon'/></a>
</td></tr></tbody></table> </div></center>
<center>
</center>
<div style="text-align: left; display: inline-block;">
<h8 style="display:block;font-family:'calibri';font-size:17px;font-weight:bold;">Enter Your Email Below And Subscribe To Our Daily Newsletter !!</h8>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=zgamerx', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input type="hidden" value="zgamerx" name="uri"/>
<input type="hidden" name="loc" value="en_EN" />
<input type="text" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" value="Enter your email..." name="email" class="emailtext" />
<input type="submit" class="sub-button" value="Enter" title='' alt='' />
</form></div><small> PS : We Hate Spamming Too ! You Are Safe With Us.</small></div></div>

 

customizations

 Change red url/name with your own.

Enjoy.....