Singpolyma

XOXO (A Semantic Weblog)

Mostly hAtom in the New Blogger

Posted on

While 100% hAtom support under Blogger is impossible, we can get close. What is the use of that? Well, doing this will allow you to use the Backup Tool for one thing. Most other hAtom-related tools mentioned on this blog will also work with the results of these changes. Plus, it’s just generally an all-around good idea. (These instructions will work with most templates on the New Blogger, but if you cannot complete any steps for some reason, just skip them and it may still mostly work.) So, here’s how:

  1. Go to the ‘Edit HTML’ section under the ‘Template’ tab.
  2. Find the code that looks something like this:

    <b:includable id='post' var='post'>
    <div class='post uncustomized-post-template'>

    and replace it with this:

    <b:includable id='post' var='post'>
    <div class='post uncustomized-post-template hentry' expr:id='"post-" + data:post.id'>
  3. Find the code that looks something like this:

    <h3 class='post-title'>

    and replace it with this:

    <h3 class='post-title entry-title'>
  4. Find the code that looks something like this:

    <a expr:href='data:post.url'><data:post.title/></a>

    and replace it with this:

    <a rel='bookmark permalink' expr:href='data:post.url'><data:post.title/></a>
  5. Find the code that looks something like this:

    <div class='post-body'>

    and replace it with this:

    <div class='post-body entry-content'>
  6. Find the code that looks something like this:

    <span class='post-author'>
    <b:if cond='data:top.showAuthor'>
    <data:top.authorLabel/> <data:post.author/>
    </b:if>
    </span>

    and replace it with this:

    <span class='post-author author vcard'>
    <b:if cond='data:top.showAuthor'>
    <data:top.authorLabel/> <span class='fn'><data:post.author/></span>
    </b:if>
    </span>
  7. Find the code that looks something like this:

    <a class='timestamp-link' expr:href='data:post.url' title='permanent link'><data:post.timestamp/></a>

    and replace it with this:

    <a class='timestamp-link updated published' rel='bookmark permalink' expr:href='data:post.url' title='permanent link'><data:post.timestamp/></a>
  8. Find the code that looks something like this:

    <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>

    and replace it with this:

    <a class='comment-link' rel="comments" expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
    <b:loop values='data:post.feedLinks' var='f'><span style="display:none;">There is an <a expr:href='data:f.url + "?alt=rss"' rel='alternate comments'>RSS Feed</a> for comments on this post.</span></b:loop>
  9. Save your template.

4 Responses

Johan Sundström

I absolutely love your posts on picking up microformats. Thanks a lot for all useful legwork, Stephen!

I had to pick the “sign in with another account” link to the blogger comment page and tweak the URL of that 404 to manage posting this comment, by the way (firefox 2, greasemonkey off, for testing’s sake); I presume the cocomment integration is broken somehow.

Singpolyma

Thanks Johan 🙂

The comments thing was because I just upgraded all my blogs to the new Blogger and only changed the template on my main Tech blog. I’ve put in a temporary comments fix here now 🙂

Leave a Response