Covert Flickr Badgr to be W3C XHTML Compatible

I used this verion of flickr badge on my personal web page. It looks great. The only problem is that the XHTML source code of my web page is no longer W3C-compliant. I spent a few minutes on this a couple of days ago and finally was able to figure out how to do it.

The original code to be included in your web page looks like this:

<embed src="
http://www.mentalaxis.com/fl8/badgr2.swf?framealphas=0,0,0,100,100&
framescaling=1.05,1.01,1.22,1.04&userid=16722880@N00&
framecolors=#ffffff,#535353,#000000,#ffffff,#000000&waittime=1&
rolling=yes&displaytime=3&badgrmode=1&limit=all&
columns=20&rows=4 " bgcolor="#ffffff" height="760"
width="152"></embed>

There are couple of problems.

1. Writing '&' in the URL to pass parameters is not allowed. So you'll have to change them from '&' to '&amp;'. (no space between '&' and 'amp;')
2. They don't like <embed>. So instead of using <embed src="[url]" width="" height="">, we use >object type="application/x-shockwave-flash" data="[url]" width="" height=""><param name="movie" data="[url]"></object&gt
3. That's it. (Unless I forgot something.....)
   

The final code looks like this:


<object type="application/x-shockwave-flash"
data="http://www.mentalaxis.com/fl8/badgr2.swf?framealphas=0,0,0,100,100&amp;
framescaling=1.05,1.01,1.22,1.04&amp;userid=16722880@N00&amp;
framecolors=#ffffff,#535353,#000000,#ffffff,#000000&amp;waittime=1&amp;
rolling=yes&amp;displaytime=3&amp;badgrmode=1&amp;limit=all&amp;
columns=20&amp;rows=4"
width="760" height="152">

<param name="movie" value="http://www.mentalaxis.com/fl8/badgr2.swf?framealphas=0,0,0,100,100&amp;
framescaling=1.05,1.01,1.22,1.04&amp;userid=16722880@N00&amp;
framecolors=#ffffff,#535353,#000000,#ffffff,#000000&amp;waittime=1&amp;
rolling=yes&amp;displaytime=3&amp;badgrmode=1&amp;limit=all&amp;
columns=20&amp;rows=4"/>

</object>

It looks a little bit more ugly, but it's standard compliant. :-)