All of us like to have a good template with matching design and widgets. Feedburner provides a default Email Subscription Widget which may not suit to your templates. This post contains simple techniques to Customize your Feedburner Email Subscription Box.
  1. Your Original Code would be like this:

    <form style="border:1px solid #ccc;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=Your feed ID here‘, ‘popupwindow’, ‘scrollbars=yes,width=550,height=520′;);return true"><p>Enter your email address:</p><p><input type="text" style="width:140px" name="email"/></p><input type="hidden" value="http://feeds.feedburner.com/~e?ffid=Your feed ID here" name="url"/><input type="hidden" value="your blog name" name="title"/><input type="hidden" name="loc" value="en_US"/><input type="submit" value="Subscribe" /><p>Delivered by <a href="http://www.feedburner.com" target="_blank">FeedBurner</a></p></form>

  2. Change Background Colour:

    To change the background colour, add:
    background: #00BB11
    just after,
    text-align:center;
    So the Code would be:
    <form style=”border:1px solid #ccc;padding:3px;text-align:center;background: #00BB11;
    (For RGB Color Codes Chart, click here)

  3. Add a Background Image:

    To add a background image, add:
    background: url(your image url here);
    just after,
    text-align:center;
    So the Code would be:
    <form action="http://www.feedburner.com/fb/a/emailverify" style="border:1px solid #ccc;padding:3px;text-align:center;background: url(your image url here);"
    (Change the image URL to add your own)

  4. Change the Width of the Textbox:

    To change the width of the Textbox, you need to alter the code:
    width:140px
    (You can just increase or reduce the size according to your requirements)
    For example:
    <input type="text" style="width:250px" name="email"/>

  5. Add Default Text in the Textbox:

    You can add a default text in the textbox to make it more attractive to the visitors. Just use this simple technique:
    Remove the code:
    <p>Enter your email address:</p><p><input type="text" style="width:140px" name="email"/></p>
    and replace it with
    <input type="text" style="width:240px" name="email" value="Enter your email address" onfocus="if(this.value==this.defaultValue)this.value=";" onblur="if(this.value==")this.value=this.defaultValue;"/>
Need some more customization? Read Part-2 here!

17 comments

Mr. Huynh said... @ April 3, 2012 at 8:52 AM

Thank you about useful information

HP : Xem tu vi

[ REPLY ]
mrxemboi said... @ July 7, 2012 at 12:58 AM

I enjoyed your article. It's a great share



HP: ket qua xo so

[ REPLY ]
Web Development Works said... @ December 14, 2012 at 7:11 PM

Thank for sharing :) Nice tricks of CSS
WEB Application Development

[ REPLY ]
Mr. Huynh said... @ May 3, 2013 at 7:56 PM

Great post ! Thank you.

Xem Boi

[ REPLY ]
Unknown said... @ June 20, 2013 at 11:18 AM

It was a awe-inspiring post and it has a significant meaning and thanks for sharing the information.Would love to read your next post too...... by OPS 571 Final Exam provider.

[ REPLY ]
Ideation Fashion said... @ June 21, 2013 at 12:50 PM

Wonderful job.thanks. hermes kelly 32

[ REPLY ]
Uoptutorial said... @ July 17, 2013 at 10:59 AM

Awesome blog. I enjoyed reading your articles. This is truly a great read for me. I have bookmarked it and I am looking forward to reading new articles. Keep up the good work!
by PSY 201 Week 2

[ REPLY ]
Smithya said... @ October 30, 2013 at 1:00 PM

I desire to express gratitude you for this informative read; I actually appreciate for sharing this large post......
by HomeworkHelp provider

[ REPLY ]
Unknown said... @ November 15, 2013 at 12:26 PM

It looks like you spend a large amount of time and effort in writing the blog. I am appreciating your effort.
by BCOM 275 Week 3 provider

[ REPLY ]
Unknown said... @ December 9, 2013 at 5:25 PM

Great post full of useful tips! My site is fairly new and I am also having a hard time getting my readers to leave comments. Analytics shows they are coming to the site but I have a feeling “nobody wants to be first”.AC Servicing

[ REPLY ]
Unknown said... @ December 16, 2013 at 11:43 AM

You have delivered a good message to everyone viewing your blog. Excellent topic you chose with proper facts and information, it will help many people. Looking forward for more articles, hope so you would post soon.Alamode

[ REPLY ]
Hems Jacson said... @ December 18, 2013 at 11:28 AM

I am very joyous when read this blog mail because blog posted letters in writing in good kind and compose on good theme.
by LAW 421 Entire Course provider

[ REPLY ]
Hems Jacson said... @ January 27, 2014 at 12:12 PM

A very well-written mail. I read and adored the posted letters and have furthermore bookmarked you.
by LDR 531 Individual Assignment Provider

[ REPLY ]
Hems Jacson said... @ January 28, 2014 at 2:48 PM

I influenced with this post. I seldom found out this. I came over this and intriguing stuff is present here.I will bookmark your website and share with my aides. I am waiting for your next intriguing post.
by MGT 350 Final Exam Provider

[ REPLY ]
Anonymous said... @ March 28, 2014 at 12:55 PM


This nice and helpful blog....Thanks for this post, Thanks for posting this instructive blog...well done.

prestige royal gardens , prestige royal gardens bangalore, and prestige royale gardens

[ REPLY ]
hotmail said... @ December 11, 2018 at 1:26 PM

informative article about Histoire courte. thanks to share:
hotmail sign in


[ REPLY ]
Sophie Grace said... @ September 4, 2020 at 1:13 PM

That was a good post thanks! Download video without a watermark on a PC, iOS or Android from download tik tok videos

[ REPLY ]

Post a Comment