How to add “Email Subscription Form” to Blogger Blogspot

email subscription form, blogger blogspot, gadgets
When you are providing useful information in your blog, then many times some readers will need to get the latest updates from your blog. For that purpose, you need an Email Subscription Form in your blog, so that the interested visitors can easily get the latest updates.

To add email or Feed Subscription Form to your blogger blog (blogspot) is very easy.
Just follow the next steps:

1. Log in to Blogger, then go to Layout > click on "Add a Gadget" link:


 2. From the pop-up window, scroll down and click on the "HTML/JavaScript" gadget:


 3. Paste the following code inside the empty box:
<style>
.hl-email{
background:url(http://4.bp.blogspot.com/-u3UaeUufpmI/T8lFuelsg8I/AAAAAAAACQY/tOWbHsgTYKc/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=helplogger', '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>

Settings 
  • Replace the url address in green to change the email icon
  • Increase/Decrease the 130 width value for a wider text area
  • Replace http://feedburner.google.com/fb/a/mailverify?uri=helplogger with your Feedburner Email Feed link. You can get it by visiting your feedburner account then navigate to Publicize and then to Email Subscriptions.
  • Replace helplogger with your feed title. It appears at the end of your feed link. In my case it is http://feedburner.google.com/fb/a/mailverify?uri=helplogger

4. Now Save your widget and check your blog. Enjoy!

    Random Posts

52 comments:

  1. Mine keeps saying this feed does not have subscriptions enabled. I do, though, and have checked the feedburner site to clarify. If I get their email subscription code and put it on blogger, it works. Think yours looks much sleeker though and would prefer using it!

    ReplyDelete
    Replies
    1. its ok for me... hello helpblogger? may i have a request? i need a widget that show top commments...

      http://blog3dalam1.blogspot.com/

      Delete
  2. Very Good Post But plz also post topic about creating a feedburner email for your blog.

    ReplyDelete
  3. Its very fine post. I read this post and got many useful information with this post. Email list segmentation is an important part of email marketing. Basically, the more a marketer knows about the customer, a better job that marketer can do of making relevant, high-converting offers that the customer likes.

    Search Engines Marketing

    ReplyDelete
  4. Exactly the same article as i seeking for so long and m trying to implement in this my blog so thnx man :D

    ReplyDelete
  5. good work bro.....thanx to share us

    ReplyDelete
  6. Nice Work.....I appreciate it

    ReplyDelete
  7. It helps your visitors to come back to your blog and read new interesting posts. Nice work, keep it up.

    ReplyDelete
  8. I have done this successfully but the emails that go out are terrible. A pictures caption appears in the middle of text. The post just ends on a random word and there is no mention to click yo go to blog. Can anyone help?

    ReplyDelete
  9. Thank for your tip blogger. Nice article

    ReplyDelete
  10. Btw, your tutorial gives me error. It says email subscription is not enabled or something like that (when i tried to subscribe via email) but i have it enabled. And i noticed the tutorial was not complete so i had to modify using Feedburner's as another guide and made a few tweaks. Thanks anyway.

    ReplyDelete
  11. that worked a treat, thanks

    ReplyDelete
  12. thank you so very much for this tutorial.

    ReplyDelete
  13. I very much want to enable this option on my blog and I appreciate you sharing. However, can you please explain what Feedburner Email Feed does and how that works? Is it optional, does it work in tandem with Blogger somehow, or what exactly is its purpose and function (I assume I don't have it)?

    ReplyDelete
  14. Very good tips. Thank you so much!

    ReplyDelete
  15. Good tip but mine isn't working now.

    ReplyDelete
  16. thanks, you ve saved me from hell. battled it out at last. very grateful. what if i don't want verification?

    ReplyDelete
  17. Erin thank for your splendid article. Read other article online but yours helped me solve the feeburner issue.

    ReplyDelete
  18. Hey admin ..I had added email subscribtion form to my blog but i cant understand the instruction given by you in setting "Feedburner Email Feed link". From where I can get it Please?

    ReplyDelete
  19. This comment has been removed by the author.

    ReplyDelete
  20. Thx, good work, very helpful post :)

    ReplyDelete
  21. Thanks, this is a big help! I'm gonna use this on my blog!

    ReplyDelete
  22. Anonymous3/05/2013

    Please always give a demo......

    ReplyDelete
  23. Thank you so much! It was of great help. I have done it successfully. I will share it with my friends now. Great post!

    ReplyDelete
  24. thank you so very much for this tutorial.

    Keep blogging.....

    ReplyDelete
  25. thank you so very much for this tutorial.
    th3fakiry.blogspot.com

    ReplyDelete
  26. thanks you Great post for help

    ReplyDelete
  27. Thanks , admin great posts , it is helpful for newbies

    ReplyDelete
  28. I tried this, but when i make any changes to my blog, nothing is going to subscribers.? whats the issue?

    ReplyDelete
  29. Great post, really. Very useful for me...

    ReplyDelete
  30. Finally i got this tutorial...thank you helpblogger

    ReplyDelete
  31. is there any way to customize it?

    ReplyDelete
  32. This was an awesome trick to add e-mail subscription form in my blog.

    ReplyDelete
  33. Wonderful Post, It Helps me a lot thanks!

    http://www.funnspot.com/

    ReplyDelete
  34. I never thought adding email subscription form could be this much easy, Happy to come across your guidelines.

    ReplyDelete
  35. This was a tremendous help to me! Thank you! :D

    ReplyDelete
  36. Very necessary Tips. Thank You So Much boss. It was very necessary for my Blogsite

    ReplyDelete
  37. thanks a lot! It really helped me out!

    ReplyDelete
  38. Now it is really simple to do it. Thank you for this very useful guide.

    ReplyDelete
  39. Thnx man great post. was very helpful

    ReplyDelete
  40. Hi..I am not getting what to replace http://feedburner.google.com/fb/a/mailverify?uri=helpblogger..can you help me?

    ReplyDelete
  41. Thank you I will try this in my blog This is very useful for new bloggers.

    ReplyDelete
  42. Nice post, it's really beneficial for a new blogger.And thanks for posting such a nice informative blog.

    ReplyDelete
  43. tnk u but when i post in my blog widget its showing enable first what i do for this enabletell me ,thank u

    ReplyDelete
  44. How do I know who's signed up via email? How can i have access to their email address to send updates and news letters? Is there any way to do this on blogger?

    ReplyDelete
  45. Thanks a lot for your valuable information for those are associating with email subscription.Because this is a great techniques to get latest updates from blog.so that you can easily in touch with users.Though I am working as a email marketer in verifiedemaildata.com,I mostly focus on these things for better link with my customers.Thanks..

    ReplyDelete
  46. I want to change my user email id in blogspot.in kindly give some tricks so that i can change user name email id my email id is usha786@gmail.com

    ReplyDelete
  47. This is EASY? Not.

    ReplyDelete

Although every comment is appreciated, due to time limitations I might not be able to respond to everyone. Keep in mind that comments are moderated and may take some time to appear. All spam comments will be deleted. Thanks for understanding!