How to add email subscription widget in Blogger

How to add email subscription widget in Blogger - When you serve good post to your reader and your reader also want to get daily update on their email inbox then email subscription widget is mostly need for you to have it on your site and today we are going to share how to add email subscription form widget in blogger blogspot site.

How to add email subscription form in Blogger

Log in to your blogger dashboard and click on layout now from the sidebar where you want to show the email subscription widget there click on add a gadget now select html/script and paste the bellow codes

<style>
.hl-email{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNBEyVHuCQwLXS-Uxqpatl5kyn0BY1-CeJQ7Kcpu0I3D2dUXoW6IVCsBEcOrwjFd7C1grEWPTCjjHKZGPmDuHcVByoLSF4n223rDielvdIcRHZCajb6Pu3pTeHFLBBYtnyl3rXsHFMGRw/s1600/mail.png) no-repeat 0px 12px ;
width:300px;
padding:10px 0 0 55px;
float:left;
font-size:1.4em;
font-weight:bold;
margin:0 0 10px 0;
color:#686B6C;
}
.hl-emailsubmit{
background:#9B9895;
cursor:pointer;
color:#fff;
border:none;
padding:3px;
text-shadow:0 -1px 1px rgba(0,0,0,0.25);
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
font:12px sans-serif;
}
.hl-emailsubmit:hover{
background:#E98313;
}
.textarea{
padding:2px;
margin:6px 2px 6px 2px;
background:#f9f9f9;
border:1px solid #ccc;
resize:none;
box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
-moz-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
-webkit-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1); font-size:13px;
width:130px;
color:#666;}
</style>
<div class="hl-email">
Subscribe via Email <form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=ShohagIslamSourav', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input gtbfieldid="3" class="textarea" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter email address here&quot;;}" onfocus="if (this.value == &quot;Enter email address here&quot;) {this.value = &quot;&quot;;}" value="Enter email address here" type="text" />
<input type="hidden" value="shohagislamsourav" name="uri"/><input type="hidden" name="loc" value="en_US"/>
<input class="hl-emailsubmit" value="Submit" type="submit" />
</form>
</div>

Now press save button and check the preview on your sidebar in homepage of your blogspot blog.

How to customize it:
On this css code you can see a mail.png image just change it with your custom image if you want.
You can change width as you want.
Finally change ShohagIslamSourav with your feed link.