How to Make Your Feedburner Email Subscription Form XHTML 1.1 Compliant
I love the services offered from Feedburner. The email RSS feeds subscription box I use seems to be attractive compared to some other ones I have seen, but I had trouble getting the code to pass validation. The site worked but had some pesky coding errors. I didn’t want to change the form so I took about 6 hours trying to make the subscribe form markup compliant and will share the corrected code.
Why Spend 6 Hours Fixing Simple Code?
I have discussed a few times that having your web pages validate with w3.org will increase your search rankings, or at least the chance of being spidered more often. Besides, this blog is about seo and web design, how can I blog about this stuff and possibly consider myself a consultant if my own sites does not use valide code?
The email subscription service from Feedburner allows visitors to subscribe and recieve new information posted on Deindexed delivered to their inbox when new posts are entered. It also helps promote and publicise my services. A validation service will be added to Deindexed soon. if you have trouble with your pages send me some info and maybe I can suggest some fixes for you, just post your issue as a comment or use the contact us page.
How to fix the code supplied by the Feedburner email subscribe feature:
**When you copy any code from this or any other site, paste it to an empty Notepad file and copy it again. Notepad strips formatting, line breaks, or special characters needed to show the code in this post.
1. Below is the standard RSS subscribe box code given at feedburner.com
<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=xxYOURIDxx’,
’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=xxYOURIDxx” name=”url”/>
<input type=”hidden” value=”xxyourblogstitlexx” name=”title”/>
<input type=”hidden” name=”loc” value=”en_US”/>
<input type=”submit” value=”Subscribe” />
<p>Delivered by <a href=”http://www.feedburner.com”>FeedBurner</a></p>
</form>
2. Find this line:
<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=xxYOURIDxx’,
’popupwindow’, ’scrollbars=yes,width=550,height=520′);return true”>
3.Change the above line to:
<form style=”border:1px solid #ccc;padding:3px;text-align:center;” method=”post” action=”http://www.feedburner.com/fb/a/emailverifySubmit?feedId=xxYOURIDxx” onsubmit=”window.open(’http://www.feedburner.com/fb/a/emailverifySubmit?feedId=xxYOURIDxx&email=’ + encodeURI(document.getElementById(’feedburner-email’).value), ’feedburner-window’, ’scrollbars=yes,width=550,height=520′); return false;”>
4. Find this line:
<p><input type=”text” style=”width:140px” name=”email”/></p>
5.Change the above line to:
<p><input type=”text” style=”width:140px” name=”email” id=”feedburner-email” /></p>
6. Change xxYOURIDxx to your feedburner RSS feeds id.
7. Change xxyourblogstitlexx to your blogs title.
8. The final code with the changes that should be make your feedburner email subscribe box XHTML 1.1 Compliant:
<form style=”border:1px solid #ccc;padding:3px;text-align:center;” method=”post” action=”http://www.feedburner.com/fb/a/emailverifySubmit?feedId=xxYOURIDxx” onsubmit=”window.open(’http://www.feedburner.com/fb/a/emailverifySubmit?feedId=xxYOURIDxx&email=’ + encodeURI(document.getElementById(’feedburner-email’).value), ’feedburner-window’, ’scrollbars=yes,width=550,height=520′); return false;”>
<p>Enter your email address:</p>
<p><input type=”text” style=”width:140px” name=”email” id=”feedburner-email” /></p>
<input type=”hidden” value=”http://feeds.feedburner.com/~e?ffid=xxYOURIDxx” name=”url”/>
<input type=”hidden” value=”xxyourblogstitlexx” name=”title”/>
<input type=”hidden” name=”loc” value=”en_US”/>
<input type=”submit” value=”Subscribe” />
<p>Delivered by <a href=”http://www.feedburner.com”>FeedBurner</a></p>
</form>
Your Feedburner Email RSS Subscription Form is now XHTML 1.1 Markup Compliant.
What we did was to change the target attribute and still have the form submit the entered email address. I also removed the target= attribute in the final lines of code, the entire link can be removed, its up to you. I have a longer explanation but who cares right? As long as it works.











Leave your response!