IBM Support

Getting Windows Live Writer to Work with the ECM Community Blog

Technical Blog Post


Abstract

Getting Windows Live Writer to Work with the ECM Community Blog

Body

You may have heard Jeff mention using alternative blog writers during our weekly meetings.  I think I’ve been a lot of the force behind this request, as I’ve found Windows Live Writer to greatly enhance people’s blogging ability.  Although this post isn’t exactly ECM or ACM related, I think if you spend the time to follow the instructions you’ll be pleasantly surprised.

Getting Live Writer

If you are on a windows operating system, then getting windows live writer installed is as easy as going to http://explore.live.com/windows-live-writer and clicking the download now link.

If you’re not running windows, I would suggest you check out alternatives to windows live writer (one example list is @ http://bloggingbits.com/15-alternatives-to-your-boring-blog-editor/) for your specific operating system, you may even find one for windows you like more.  I suspect many of the steps for configuring alternative writers are very similar to configuring live writer, so you’ll probably want to read on to get some basic information that’ll help you out.

Adding the ECM Community Blog

Once you get Live Writer installed, you have to configure it for your ECM Community Blog account.  As it turns out, your account is actually a developer works account that happens to have access to the ECM Community Blog, thus you are really adding your developerWorks account.

As it turns out, Live Writer does not have native support for developerWorks, but there’s no need to worry as Live Writer can work with any publishing platform that implements the AtomPub API.  If you’re not too familiar with AtomPub, that’s ok as you won’t need it for this, but you should know that AtomPub is part of Atom which is the basis of CMIS which should mean a lot to you as an ECM developer.

For it’s 10th birthday developerWorks got an implementation of AtomPub, and every blog has an AtomPub service endpoint by just appending a /api to the blog url.  So since the ECM Community Blog’s URL is https://www.ibm.com/developerworks/mydeveloperworks/blogs/e8206aad-10e2-4c49-b00c-fee572815374/ it’s AtomPub Service API is located at https://www.ibm.com/developerworks/mydeveloperworks/blogs/e8206aad-10e2-4c49-b00c-fee572815374/api.  (FYI developerWorks does a lot of redirecting to append a lang=en query string parameter, but live writer and everything else seems to do a good job of respecting HTTP redirects, so for simplicity I omit it).

Armed with the AtomPub Service endpoint, you are ready to configure Live Writer.  When you start it up the first time it’ll will launch the Add Blog Account wizard.  If you’ve already used Live Writer (or dismissed this wizard) you can invoke it again by clicking on the account expando in the Home ribbon and selecting “Add blog account” as shown in this picture:

Adding a new Blog account in Windows Live Writer

This will bring up the welcome screen of the wizard in which you want to select the Other Services option and click next:

Welcome Page of Add New Blog Account Wizard

The next wizard page asks you for your blog’s url.  This is the ECM Community Blog’s homepage URL of https://www.ibm.com/developerworks/mydeveloperworks/blogs/e8206aad-10e2-4c49-b00c-fee572815374.  For the username and password you need to use your developer works user id (usually an email) and password.  You can of course choose to store your password (it’s stored encrypted in the windows registry).  By clicking next you will be taken to the blog type page.

In the blog type page the drop down has a lot of options that windows live supports natively.  The one you want is the “Atom Publishing Protocol” option.  For the Service document web address input, enter the ECM Community Blog Atom API service endpoint address of https://www.ibm.com/developerworks/mydeveloperworks/blogs/e8206aad-10e2-4c49-b00c-fee572815374/api.

Selcting the blog type

Now normally you should be taken to the final step of the wizard, but currently there appears to be a bug on the developerWorks site.  Atom organizes content into collections, and if you use your browser to access the API service endpoint address and view the XML returned you’ll see at least two collections, the entries collection (which contains blog posts) and the comments collection (which contains comments to the blog posts).  These collections are located at https://www.ibm.com/developerworks/mydeveloperworks/blogs/e8206aad-10e2-4c49-b00c-fee572815374/api/entries and https://www.ibm.com/developerworks/mydeveloperworks/blogs/e8206aad-10e2-4c49-b00c-fee572815374/api/comments respectively.  If you try to access the entries, it should work, but if you try to access the comments resource you will likely be given a message indicating developerWorks web site is currently under maintenance:

developerWorks comments resource unavailable

This maintenance error page causes Live Writer to process for a while and then fail with the following error message:

image

We performed a lot of investigation into this issue, and it turns out that the error page is forcing live writer to request the XHTML strict DTD located at

http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd (and a few after that ) a URL that is for some reason (I believe it to be load related, see http://www.w3.org/blog/systeam/2008/02/08/w3c_s_excessive_dtd_traffic/, FYI Live Writer does NOT send a user agent string) is generally unreachable.

So what can you do?

It’s this last one that I used, as I’m a huge fan of fiddler and often tweak HTTP responses to play with stuff (as you’ll see in my future blog posts).

However you decide to get past this error, the next page of the wizard ass you to choose which “blog” you want to connect to.  The list is equivalent to the content collections you have available in your AtomPub service endpoint, the one you should pick is “ECM Community Blog – Weblog Entries”:

Blogs Available on ECM Community Blog

After you click next, the fun really beings!  Live writer will download all the information about your blog, including categories/tags features, etc.  Eventually it will prompt you if you want to detect the theme.  DO NOT DO THIS, IT DOESN’T WORK.  We’ll cover how to get the theme info (and why it doesn’t work) later.

The next page asks you where you should put images you include in your post, there’s only one option “ECM Community Blog- Media Entries”:

Where image go for ECM Community Blog

After that page is the final page, which you can say OK to.  You’re now setup to blog using Live Writer!

Quick Live Writer Tour

Live Writer is a pretty simple WYSIWYG editor:

Basic Live Writer LayoutI just want to call out a few things:

  1. If you push the publish button, your blog post goes live on the site.  It shows up on the homepage, RSS feeds, etc.  So don’t do this, unless you’re sure you want to!
  2. Posting a draft to the blog puts it in the draft state, all the content is up on the site, but hasn’t been published to the public yet.  Editors can make drafts public from the site.  Think of this as a submittal process. Also most blog platforms (including developerWorks) have a preview mode for blog drafts, and this makes it really easy to access that feature.
  3. There’s the quick insert (the 3 to the right) and the insert ribbon (the 3 to the left).  This is a huge part of live writer, and will be talked about in the extending liv writer section.
  4. The category selector lets you see all the categories (or tags as developerWorks calls them) for you blog.  It’s  a great way to mark your posts as Jeff has pointed out a few times.  Here’s what the drop down looks like:

Selecting Tags in Live Writer

I don’t think you can argue with that simplicity!

One other really great feature is being able to browse existing posts.  You can do this from the main menu’s open recent posts option:

Open Recent Posts

Selecting this will bring up a nice interface that allows you to open existing posts for modification (fixing tags, typos) or as a way to start (you can republish), or cross publish to another blog!

Recent Posts Dialog

Many people are enabled as blog editors, so take care to stay away from the delete button unless you really want to delete things.  I know this was a quick tour, but I bet you agree that this interface offers a lot of power when blogging.

Downloading the Site Template

I just included this section for completeness.  I wouldn’t even suggest doing this, except for maybe updating the home page (so when you post it takes you to the right page). It was NOT easy, and requires fiddler knowledge and the benefit was minimal as the ECM Community Blog doesn’t have much styling.  None-the-less, here are instructions for retrieving the site template.

The first instructions are for fixing the homepage for the blog. Live writer expects AtomPub blogs to have entries at the root path.  This is not how developerWorks is structured so you need to help live writer find the blog.

  1. Open up RegEdit
  2. Navigate to HKCU/Software/Microsoft/Windows Live/Writer/Weblogs
  3. Find the child key for the ECM Community blog (it’s identified by the BlogName Subkey.
  4. image
  5. Change the HomepageUrl value from http://www.ibm.com to the ECM Community Blog URL (currently https://www.ibm.com/developerworks/mydeveloperworks/blogs/e8206aad-10e2-4c49-b00c-fee572815374/).

This next set of instructions is to retrieve the site template.  The normal path for this fails because the blog has restricted access.  If it is ever made public, the normal way should work.

  1. Start Fiddler in sniffing mode
  2. Access the ECM Community Blog
  3. In fiddler, inspect thee session for the ECM Community blog.  Copy the cookie http header string value.
  4. Edit the custom rules in fiddler and add the following code in the before request handler:
  1: oSession.oRequest.headers.Remove("Cookie"); 
  2: oSession.oRequest.headers.Add("Cookie", "<<VALUE OF COOKIE HEADER FROM 3>">);

This authenticates you to all requests on developerWorks as long as your session cookie is valid. Now you can do the normal theme update operations:

  1. In Live Writer access the Blog Account Ribbon.
  2. Click the update theme button.

After this go back and comment out those custom rules.

Again, I don’t believe this is worth the effort, but I wanted to capture this information in case someone wanted to know how to do it.

Extending Live Writer

I leave you with the concept of Live Writer plugins.  This goes back to the insert Ribbon.  You can insert all types of awesome rich content quickly by using this ribbon, and in some cases 3rd part plugins.  One of the ones I personally live by is the code formatter (what I used a few lines above) & flickr (Flickr4Writer) image insert plugins.  They also let you modify images (like instagram), upload files, and do other advanced features.  And writing a custom plugin is actually pretty easy (if you know .NET).  So browse the existing plugs over at http://plugins.live.com/writer/browse to find the ones that you want.

[{"Business Unit":{"code":"BU053","label":"Cloud & Data Platform"},"Product":{"code":"SSCTJ4","label":"IBM Case Manager"},"Component":"","Platform":[{"code":"PF025","label":"Platform Independent"}],"Version":"","Edition":"","Line of Business":{"code":"LOB45","label":"Automation"}}]

UID

ibm11281916