How to add feedburner email subscription widget for blogger

When you visit to any website then you can see a subscription box appear in front of you or sidebar or anywhere else. That generally ask for you name and email or only email. When you put the details then you will receive a confirmation email about subscription. Now you will get every latest update directly to your email inbox from that blog. That's help to make a strong relation between readers and bloggers. So either beginner or professional every blogger should use the email subscription features. If you still don't use it or don't know how to do it then this article will help you a lot. So in this tutorial I will show you how to add email subscription widget for blogger?

Feedburner email subscription widget for blogger

What is FeedBurner Email?

FeedBurner email is a free feed service, with this publishers can deliver their feed content to their subscribers via email. Feedburner is very simple and easy to use. So as a beginner you may choose it. Don't worry if you don't like it after some days then you can easily export the email list and move to another service like mailchimp/getresponse etc.

How to setup feedburner for blogger

Before adding your email subscription widget first you need to setup feedburner account.

1. First go to Feedburner.google.com and sign in to Feedburner with your existing google account.
2. Now enter your blog URL into the box and click on next button.
3. Choose 2nd option "RSS" and then next.
4. Now give Title and Feed Address as you want and press next.
5. Check "Clickthroughs" and "I want more..." options.
6. Now go to publicize -> click on email subscription from left sidebar -> and activate.
7. Your feedburner blogger account is ready. Now time to set up subscribe now widget in blogger.

How to add email subscription widget for blogger

In blogger we can add a blogger subscribe button by 3 ways. Simply follow any one of them

• Default blogger subscribe button

It is the most simplest method. Go to blogger dashboard -> Layout -> Add a gadget -> Scroll down and select "Follow By Email" widget -> Now enter title and feed url and save it.
*Its come with default title and your feedburner feed url. You don't need to change it. If anything goes wrong then you can change it.

• Custom follow by email widget

Go to blogger -> Layout -> add HTML/JavaScript gadget -> Now put the below code and save it.

<style>
.hl-email{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZpjDZ3R1ulrvhUJOIzR1MighyE6_SoVK9Ta0dz-84DdgBLr2GDSrBiemrvsL7NH4xKQ5v49bRqXrlfn2QEp4_SH-Isgks9w-hwkPF8gisr4OC5b4oeCIySTeYncswQRsW9FxeD5r9xV0/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=bloghunts', '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="helplogger" name="uri"/><input type="hidden" name="loc" value="en_US"/>
<input class="hl-emailsubmit" value="Submit" type="submit" />
</form>
</div>

Replace "http://feedburner.google.com/fb/a/mailverify?uri=bloghunts" with your own feedburner url.

• Default template's widget

Some template comes with inbuilt stylish email subscription widget. If you want to use it then go to Theme -> Edit Html -> Ctrl+F and subscribe or follow us -> Then replace # with you feedburner url.
* If you can't find it then read the document file of that theme/ template.

Read Also -> stylish email subscription widget for blogger

That's all for this post. Hope that is was helpful. If you any problem regarding this then do comment below. Don't forget to share and subscribe. Happy blogging.