Like many, I use FeedBurner to handle the RSS feeds for this blog, which gives me the benefit of all of FB’s special features, including detailed statistics on my feed’s usage.
I also make use of its email subscription service to allow people not familiar with feed technology to subscribe to the blog and have updates delivered to their inbox (Publicise > Email Subscriptions in your FeedBurner account).
My recent redesign means that my pages are now served as XHTML 1.1, rather than 1.0 Transitional*.
The code that I use in the sidebar to show the email subscription box (the code provided by FeedBurner) won’t validate under XHTML 1.1, though, which annoyed me. So, I fixed it.
You may wonder why anyone in their right mind would care if a little snippet of code doesn’t quite validate, since it doesn’t make any user-visible difference. Aesthetics are one reason and also some mobile browsers can be really fussy about validation.
So here’s how to use my fixed code if you want to have the email subscribe feature – but also have valid XHTML 1.1 markup.
First of all, log in to FeedBurner, click the relevant feed and go to Publicise > Email Subscriptions. Under Subscription Management, there should be a box with the default code, which should be something like this (line breaks added by me for readability):
[html]
[/html]
xxxxx and [[Name of the feed here]] will obviously be specific to your feed’s ID and name.
The problem with this in XHTML 1.1 is the use of the ‘target’ attribute on the form to redirect the form posting into a pop-up window, since ‘target’ is not allowed.
You don’t need to actually POST this form, though. If you load http://www.feedburner.com/fb/a/emailverifySubmit?feedId=xxxxx&email=theusers@email.address via GET, the rest of the subscription process works just as it is meant to.
Because we can do it via GET, we don’t need to do the POST-to-a-popup voodoo.
Therefore, I change the first line of that code snippet to the following:
[html]
Thank you very much for sharing this tip! 😉
It works pretty well in Strict 1.0, too, except you have to replace the “&” by “&”.
– Can you edit my previous message, please? The HTML code for “&” has been implented!
I meant replace “&” by:
&Thanks!
Still not working, well, you can delete my messages if you want -_-;
I know what you mean – replace & with & (you have to type it twice to show it up here in the comments, like &!)
Where do I need to replace it? I can’t spot anywhere (other than in JavaScript, where I think it’s OK to do so) where I’ve used a straight &.
Hi Peter, thanks for your email and reply! Sorry for the mess 😉
In your code there’s a straight & in the following line:
onsubmit=”window.open(‘http://www.feedburner.com/fb/a/emailverifySubmit?feedId=xxxxx&email=’
…juste before “email=”.
I wouldn’t have paied attention to this until the W3 validator hit my fingers! lol
This way you have the valid code for 1.0, too.
Take care!*
Ah, I was under the impression that didn’t count, as it’s inside JavaScript code.
Apparently not! Because on my blog I moved that code outside of onsubmit and into an include file (the same code, just put elsewhere), W3C didn’t pick it up on my blog.
Have updated my post. Thanks again for the correction!
Thanks for sharing! Much appreciated as I try to validate for XHTML 1.0 Strict 🙂
Hi, Peter.
Looking for this code for a while. But, I’ll try it later.
I’d like to know the reason why you chose the doctype XHTML 1.1? 🙂
dani,
I was building a new design for the site essentially from the ground up, so I picked the most recent iteration of XHTML to build it to.
It doesn’t make much difference, but I had been using XHTML 1.0 Transitional which allows certain tags which are somewhat archaic and take away from that warm, fuzzy feeling that you have a nice clean, modern, (erm… mostly?) compliant design.
Great post Peter.
I’m setting up a new blog with Squarespace and trying to stick to XHTML 1.0 Strict.
I had some problems with your suggested changes at first, until I realised that FeedBurner have changed their URL for the email form since you posted this.
There are a few changes to the URL as follows:
Old: http://www.feedburner.com/fb/a/emailverifySubmit?feedId=xxxxx
New: http://feedburner.google.com/fb/a/mailverify?uri=MyFeedName
This is the validated XHTML 1.0 Strict code I implemented today on our blog and it’s working fine:
(You’ll need to replace all instances of ‘MyFeedName’ — http://feeds.feedburner.com/MyFeedName)
Subscribe to Email:
Cheers
James
Hi Peter,
Your method is not fully working for me.
1 error ->
Ashfame,
Try wrapping the <form> tag in a <p>?
I have to admit that when I did this I did manage to get it to validate if I recall. If you can confirm that the above fixes the validation error, I shall update this post.