Silverlight, Windows Live Writer and WordPress

Update! Please download version 2 It fixes some relative/absolute url problems.

You might have been wondering why on earth I haven’t included any Silverlight demos in this blog. The reason is as simple as it is frustrating: the software that runs this blog has no support for embedding Silverlight applications. Of course we might build this in due time but so far we haven’t.

So I decided to have a look what is needed to allow Silverlight applications to be embedded in blog posts. Here is the short list:

1. The blogging software/engine must be able to render the correct HTML so the SL application will be in the post when readers download the post. (This raises an interesting issue: are the mainstream blog readers able to display SL apps?!)
2. The internet server that hosts the SL applications has have the correct mime types registered so the SL application is displayed in the post instead of the user being prompted whether he wants to downloaded the XAP file.
3. I use Windows Live Writer (WLW) to write my blog posts, I want to be able to insert and upload the SL application using WLW.

Here is what I did on my personal blog (not this one, as it is the corporate site and I am not allowed to mess with that) which uses WordPress. Please do realize that what I did can only be done when you have nearly full access to the server that hosts the blog. You can NOT follow these steps when your blog is hosted by some 3rd party such as WordPress.com.

1. Adding support for SL to WordPress was easy as pie. Tim made a very nice plugin for WordPress. Installing it was a breeze. Thanks Tim! Tweaks I made:
   1. Redirected the plug-in to my site so Tim’s site doesn’t get all the requests for the image that is being displayed when the reader hasn’t got the correct version of Silverlight installed. (It would be nice if Microsoft hosted some cool images for things like this.
   2. Not a real tweak but a true hack: I decided to add an extra parameter to the plug-in WITHOUT changing the plug-in’s code. See step 3.
2. My blog’s host uses a Configuration Panel that allows me quite some advanced tinkering with my website. Therefore adding correct MIME Type support for Silverlight was a breeze.
3. This is the most complex step so I’ll break it up in chewable bites, bytes or bits:
   • Using the experience I gathered while writing a plug-in for WLW and the Community Server Gallery, some good posts on the web and the, at times pathetic, documentation on the MSDN I wrote a plug-in for WLW from scratch. My goal was a plug-in that makes embedding a Silverlight application into a post as easy as inserting an image. I think I got quite close. Here is the UI I designed (I might make it a bit cooler but this is OK for now):

     
     Some quirks I ran into:

     • WLW will only automagically upload a file (the .xap in this case) when the file is referred to in the post by an image tag (<img src=&rdquo;Bar.xap&rdquo;/>) or by a link (<a href=&rdquo;Foo.xap&rdquo;/>). The marker that is parsed by Tim&rsquo;s plug-in does not include such a link so the xap didn&rsquo;t get uploaded. My first hack was to add a hidden hyperlink to the post but that is just plain ugly. So I decided to trick WLW into uploading the xap by adding a hyperlink to the marker. Tim&rsquo;s plug-in expects a marker that looks like this: [silverlight: URL, WIDTH, HEIGHT, MINVER] e.g. [silverlight: app.xap, 400, 300, foo=bar#second=true#test=1, 2.0.31005.0] So I made the WLW plugin to generate such a marker with a little extra in red: e.g. [silverlight: app.xap, 400, 300, foo=bar#second=true#test=1, 2.0.31005.0, <a style=&rdquo;display:none&rdquo; href=&rdquo;local path to xap&rdquo;>Fake Link</a>] Tim&rsquo;s plug-in ignores this so in the post that is downloaded to my dear readers (yes, you are one of them) there is no pollution.
     • WordPress doesn&rsquo;t like to have xap files uploaded to it by default. So you have to instruct WordPress to accept xap files. While it is not hard to do so, it requires access to the php code of WordPress on your site. Here is what I did: I opened the file named www.yoursitehere.com/wp-includes/functions.php and searched for this function:
       function wp_check_filetype( $filename, $mimes = null ) in my version it was on line 2034 and added one line (in blue):
       ‘gz|gzip’ => ‘application/x-gzip’,
       ‘exe’ => ‘application/x-msdownload’,
       ‘xap’ => ‘application/x-silverlight-app’,
       This step can also be taken by using&nbsp;the mime config plugin for WordPress:&nbsp;just add the xap extension.
     • I haven&rsquo;t found any way to force WLW to replace a Silverlight app other than by renaming the xap on the client, removing the old Silverlight app from the post and inserting the new version. The only other way I can think of is by logging in to WordPress as an admin and replace the xap file by hand. I might need this functionality because every now and then I make mistakes and need to update my code&hellip;

I am quite content with this solution but it would be nice to have some standard way of doing this for other blogging engines and blog post writing software.

You can download the WLW plug-in source code here. I am not going to put it up for download at the WLW plug-in gallery as I do not like their MSI requirement (it is way too complicated and last time I had to use WiX to make one) which is overkill for simply copying a dll. Use the plug-in at your own risk, use the sources anyway you like; when something goes wrong blame anyone but not me. Install it by dropping it in the Program FilesWindows Live WriterPlugins folder and restart WLW.

Remember: you can only use this out-of-the-box when you are using WordPress and Windows Live Writer, you must be able to install Tim&rsquo;s plug-in for WordPress, be able to add the MIME Types of your web server (or ask the provider nicely) and finally be able to edit the functions.php of your WordPress installation. Again: all at your own risk. Make backups before adjusting/trashing your blog!

On the good side, this WLW plug-in could easily be customized into generating markers for other blogging server software. Feel free to do so.