How to Customize the FeedBurner Email Subscription Form for your Blog
19 January 2008
24 CommentsI have been receiving requests from many readers to tell them how to customize the FeedBurner Email Subscription Form and today I came across a Blog Catalog discussion by a friend who wanted to know the same. So I decided to compile a How-To about the same.
So here’s it. Let us look at the HTML code of the Feedburner Email Subscription Form
{form style="border: 1px solid #cccccc; padding: 3px; text-align: center" action="http://www.feedburner.com/fb/a/emailverify" method="post" target="popupwindow" onsubmit="window.open('http://www.feedburner.com/fb/a/
emailverifySubmit?feedId=1514663', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">Subscribe to Inspirit Blog's RSS Feed via Email:{input style="width: 160px" name="email" value="http://feeds.feedburner.com/~e?ffid=1514663" type="text" /}{/form}
Replace all curly brackets { and } to pointed brackets < and > please; Do a find and replace.
Explanation of the code:
form style="border: 1px solid #cccccc; padding: 3px; text-align: center
Change the border by changing the value against border; px implies width in pixel. In above line of code, the border is 1 pixel-wide.
Change the color of form by varying #HTML color. The color is specified as #RRGGBB where R is red, G is green, B is blue. The combinations can be set by using the hexadecimal values for each R G B i.e 0 to 9 and A to F.
Change the padding of the form, again measured in pixel width, by varying the value against padding in the above line of code.
Change the text alignment by varying the value against text-align in the above piece of code. You can chose : left, right or center.
action="http://www.feedburner.com/fb/a/emailverify" method="post" target="popupwindow" onsubmit="window.open('http://www.feedburner.com/fb/a/
emailverifySubmit?feedId=1514663‘, ‘popupwindow’, ’scrollbars=yes,width=550,height=520′);return true”>
Keep this part exactly the same, just replace the feedId shown in red color with your own feedId that is same as the number in the end of the link to your dashboard at Feedburner. This part of code opens a separate Pop-up window measuring 550×520 px.
{input style="width: 160px" name="email" value="http://feeds.feedburner.com/~e?ffid=1514663" type="text" /}{/form}
This part tells you the width of the input form as displayed on your blog. Change the parameter against width in the above piece of code to vary the width of input form.
*****
Go Ahead! Play with the HTML code and customize it appropriately for use on your blog. Don’t forget to change the feedId; and replace { with < & } with >.
If you liked my post then :::
Click here to Subscribe to FREE email updates from Inspirit Blog, so that you do not miss out anything that can be valuable to you and your blog
There is no image in a default email subscription form, so indeed it is a good idea to add an innovative image directing your readers to the subscription form
Very useful article Abhi,
Thank you for the post. I have customized the form of my blog.
[...] Make email subscriptions available [...]
[...] Make email subscriptions available [...]
I have been having some problems with the feedburner email subscription form.
Now, everytime a reader push the button to comment, he gets the feedburner subscription.
How can I avoid it?
I do not understand what I am missing!
Please help!
Francesco
Problem solved.
I realized I did not close the form tags!!!
Thanks anyway for the great tips!
Francesco
You are most welcome, Francesco. Glad that you’re problem is fixed and wish you good luck that you may move on smoothly and hassle free.
Hey Abhinav! REALLY HELPFUL post here! Well done, keep it up! =)
Btw, I need to ask you if we can insert a custom field for name so that we can send out E-mails to subscribers like an autoresponder..
That would really help me reduce the cost of running my blog!
Thanks! =)
There’s no way you can do that because even if you insert a custom field for name (that’s easy HTML!), FeedBurner won’t use that while sending your RSS via email.
This is a nice idea though! I can try writing to Feedburner suggesting the inclusion of this feature in a future update.
Thanks for commenting
Very useful tutorial indeed i was thinking of putting an email subscription form at the end of my post since ages but never figured out how to do it.
But thanks to your tutorial now all my post have a footer signature asking for email subscription.
Predeeps last blog post..The Extinction of Dinosaur Marketers Part 1 [Digg]
[...] Customize the subscription form [...]
The e-mail entered in your Feedburner email form does not carry over into the pop-up window. User must re-enter e-mail, so the form is actually worse than a link. I’ve yet to see the feedburner e-mail form function on a hosted Wordpress.org site (there are 1,000 posts on how the form won’t function on Wordpress.com sites, but zero explanation for hosted site, other than it should work). Even the Feedburner email form on ProBlogger.net doesn’t function correctly! We need a hero! (Sorry if I’m a littly crabby, I actually really appreciate your blog).
Good advice is something a man gives when he is too old to set a bad example.–Louis La Rochefoucauld (1777–1815)
Buy land, they’re not making it any more.–Mark Twain (1835-1910), U.S. writer
[...] to do the most basic things for your blog - like how to make a link open in a new window or tab or How to customize Feedburner RSS Email Subscription Form. If you get stuck somewhere, search the internet and you’ll always find something [...]
That’s a really useful tutorial. I never really liked the feedburner email box so I will have to try that. Thanks for the tips
One of the other things I’d like to learn how to do is write your own contact form - I’ll have to see what other tutorials you have on here
P.S.- You might want to check your plug-ins, especially if you’ve recently upgraded to wordpress 2.6 & make sure they’re all up to date - I got a long list of database errors after posting my last comment instead of going back to the page, but the comment did post.
I was playing around with the Permalinks here, and those were the errors showing up there for some time. I believe all my plugins are working fine, but I’ll see if any other commentator faces this issue. If there will be any problem, I’ll work to fix that asap!
Not bad,im gonna customize mine right now
Jigsawmans latest published blog-post ………. DropJack:Will this be the next Digg
Check out my new post about Customizing Feedburner Email Subscription Box:
http://jumbleblogger.blogspot.com/2008/09/customize-your-feedburner-email.html
Shafars latest published blog-post ………. 5 Tips or Techniques to Generate Free Traffic to your site
woo thanks for that, getting to work right now!
Thanks for covering this. It took me a while to mess with this stuff and get it right when i first started blogging. this post will definitely save people tons of time.
Abhinav - thanks for a very helpful post! I’m using Wordpress as well and would like to know how you get the email subscription box to come up under each of your posts.. that’s brilliant! (Sorry am a bit new at this so don’t know where to put the code.. please help!)
Thanks!
Pratishs latest published blog-post ………. September 5, Teachers Day in India