WordPress themes on Live Writer

One of the reasons I moved to WordPress was the ability to write posts offline, for which I use Windows Live Writer most of the time. The beauty of this is that I can preview the post exactly as it will appear on my site. Nothing else that I know is as WYSIWYG, and it’s very useful to be able to type knowing exactly where each word will be.

The only hitch is: if you write your own WordPress theme, Live Writer probably won’t be able to detect your theme — unless you’re an expert theme writer.

I hunted on Google to see how to get my theme to work with Live Writer. I didn’t find any tutorials. So after a bit of hit-and-miss, I’m sharing a quick primer of what worked for me.

Open any post on your blog (using your new theme) and save that as view.html in your theme folder. Now replace the page’s title with {post-title} and the page’s content with {post-body}. For example:

<html><head>
<link rel="stylesheet" href="your-stylesheet" >
</head><body>
<h1>{post-title}</h1>
<div class="entry">{post-body}</div>
</body></html>

This is the file Live Writer will be using as its theme. This page will be displayed exactly as it is by Live Writer, with {post-title} and {post-body} replaced with what you type. You can put in anything you want in this page — but at least make sure you include your CSS files.

To let Live Writer know that view.html is what it should display, copy WordPress’ /wp-includes/wlw-manifest.xml to your theme folder and add the following lines just before </manifest>.

<views>
  <default>WebLayout</default>
  <view type="WebLayout" src="{blog-postapi-url}/../wp-content/themes/name/view.html"/>
</views>

Live Writer searches for wlmanifest.xml in the <link rel="wlmanifest"> tag of your home page. Since WordPress already links to its default wlwmanifest.xml, we need remove that link and add our own. So add the following code to your functions.php:

function my_wlwmanifest_link() { echo 
  '<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="'
  . get_bloginfo('wpurl') . '/wp-content/themes/<i>name</i>/wlwmanifest.xml" />';
}
remove_action('wp_head', 'wlwmanifest_link');
add_action('wp_head', 'my_wlwmanifest_link');

That’s it. Now if you add your blog to Live Writer, it will automatically detect the theme.

  1. vivek says:

    Hi,

    Thanks great information

  2. Thank you, thank you, thank you! I was trying for hours to fix this before I found your post! Actually, the way you described it didn’t exactly work for me (I guess I did something wrong with the paths), but I ended up just adding the

    WebLayout

    with the absolute path to the regular wlwmanifest.xlm inside the includes folder and now it works!

    Thanks again, your post was the only one describing this problem and helping me fix it!

  3. Note to my first post as it doesn’t show correctly:

    What I did is I ended up adding the part between the tags to the regular wlwmanifest.xlm file.

  4. zimmi says:

    What if it still doesn’t work? Anything else I can try?

  5. shawn says:

    I was having this issue today and came across this page. I came up with a very simple fix that requires no coding.

    When setting up your blog in WLW, go to your admin settings in the wordpress dashboard and temporarily set your “Reading” settings to “Front page displays -> Your latest posts “. WLW will successfully download the theme, then set your Front page displays back to your custom setting.

  6. S says:

    Thank you so much!!!!!!!!!! this worked.

  7. this worked for me tanks for sharing

  8. […] came across this page by http://www.s-anand.net which helped me a lot in understanding how Live Writer and WordPress get along together. So follow […]