Monday, 23 February 2009

Twitter and W3C

I thought as I was now a Twit – and by that I mean I am someone who uses Twitter – that I'd add the Twitter widget to my Web site (www.itech-ed.com). The only trouble is that my Web sites maintains the highest W3C standards, and when I copied the code from Twitter and validated it, there were 25 errors, 5 warnings and a page of red writing! What could I do?

You can get the widget by clicking on “Apps” at the bottom of the Twitter (www.twitter.com) page. From there you can select Widgets. And it gives you the option of Myspace, Blogger, Facebook, TypePad, and Other versions. I chose “Other”. I then selected the Flash interactive widget.

The Twitter site says: "Copy this HTML and paste it into your web page. You can then set a custom size by modifying height and width in the HTML below". And here's the code:

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,124,0" width="290" height="350" id="TwitterWidget" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="allowFullScreen" value="false" />
<param name="movie" value="http://static.twitter.com/flash/widgets/profile/TwitterWidget.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#000000" />
<param name="FlashVars" value="userID=20425034&styleURL=http://static.twitter.com/flash/widgets/profile/smooth.xml">
<embed src="http://static.twitter.com/flash/widgets/profile/TwitterWidget.swf" quality="high" bgcolor="#000000" width="290" height="350" name="TwitterWidget" align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" FlashVars="userID=20425034&styleURL=http://static.twitter.com/flash/widgets/profile/smooth.xml"/>
</object>


So I copied the code and added it to my home page at www.itech-ed.com/index.htm. It worked. There was the information displayed exactly how it should be. A success.

I then used the W3C validation service at validator.w3.org to validate the HTML on my home page. The result was a very red page listing numerous errors and warnings – and all from the Twitter widget.

So I did what any good geek would do, I modified the code to eliminate the errors. It now works and is valid, and is shown below:

<object data="http://static.twitter.com/flash/widgets/profile/TwitterWidget.swf" type="application/x-shockwave-flash" width="290" height="350" id="TwitterWidget" align="middle" >
<param name="movie" value="http://static.twitter.com/flash/widgets/profile/TwitterWidget.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#000000" />
<param name="allowScriptAccess" value="sameDomain" />
<param name="allowFullScreen" value="false" />
<param name="FlashVars" value="userID=20425034&styleURL=http://static.twitter.com/flash/widgets/profile/smooth.xml" />
</object>


Feel free to use this modified code if you wish, just remember to change the userID to your one.

And if you need a new Web site designed and coded, or if you need your tired old one revamped, please contact me at trevor@itech-ed.com.

6 comments:

Gaell said...

I recently came accross your blog and have been reading along. I thought I would leave my first comment. I dont know what to say except that I have enjoyed reading. Nice blog. I will keep visiting this blog very often.


Sarah

http://laptopseries.net

Pratik Shah said...

Have you received the "This method requires a GET" error when using this flash plugin - and logging in as a different user to post tweets within the gadget?

Any pointers on how to rectify this error would be most appreciated. I am a non developer.

Trevor Eddolls said...

Yes - it's a problem with the widget (however you code it). I don't have a solution. Hoefully someone else will know the answer to the problem.

Admin said...
This comment has been removed by the author.
Admin said...

In the FlashVars:
after the "UserID=0000000&"
Make it "UserID=0000000&"amp;
without the quotes

Site: http://gwmd.no-ip.info/

w3c said...

Nice information, I really appreciate the way you presented.Thanks for sharing..

http://www.w3cvalidation.net/