XML error on swapping blog and post title on new blogger

UPDATE: This hack is no longer valid as you will not be able to add it to your blogger template.

When you search for a post in a blog, say, with google, does the search result shows the title of the post? Or the name of the blog? If you say the latter, which is the default condition for blogger, then you'll need to swap the blog title and the post title on your blog.

Jacky Supit, on his blog, posted New way to swap Blog Title and Post Title on New Blogger.

What is this, exactly? To put it simply, it's turning this:

Into this:

Now why would anyone try to do that? One might wonder. It doesn't seem to worth the effort. However, this little change can mean a lot. Putting the title of the post before your website title means that when people search for something and google returns your site, the title of the page presented to the user will not start with the title of your site. Which in my case would mean, because of the title's length, it'll take up most of the space available on google search to show the title of the page, like so:

Which means that the user would less likely to click on it because they don't see the title of the page representing the topic they'd want to see. Not only this is SEO, this is just common sense.

Now, to remedy this, you'll need to swap the titles. To do that, you'll just need go to your blogger dashboard, go to template > edit html. You will then need to select expand widget template, and then look for:

<title><data:blog.pagetitle/></title>

Like so:

That single line is the only thing you'll need to replace. However, the hack to achive our purpose, is not that simple. The code is provided on Jack Supit's blog post, however, some users (like me) has reported that it returns an XML error, like so:

Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: Open quote is expected for attribute “{1}” associated with an element type “cond”.

So, after a bit of investigating, the code apparently contains some minor bugs. I think it's due to blogger's habit on changing punctuation marks. A little tweaking, and I managed to get the code to work on this blog. Here's the code that I end up using.

<b:if cond='data:blog.pageType == "item"'>
<b:section id='swaptitle'>
<b:widget id='Blog2' locked='false' title='Blog Posts' type='Blog'>
<b:includable id='nextprev'/>
<b:includable id='backlinks' var='post'/>
<b:includable id='post' var='post'>
<title>
<data:post.title/> - <data:blog.title/>
</title>
</b:includable>
<b:includable id='commentDeleteIcon' var='comment'/>
<b:includable id='status-message'/>
<b:includable id='feedLinks'/>
<b:includable id='backlinkDeleteIcon' var='backlink'/>
<b:includable id='feedLinksBody' var='links'/>
<b:includable id='postQuickEdit' var='post'/>
<b:includable id='comments' var='post'/>
<b:includable id='main' var='top'>
<b:loop values='data:posts' var='post'>
<b:include data='post' name='post'/>
</b:loop>
</b:includable>
</b:widget>
</b:section>
<b:else/><title><data:blog.pageTitle/></title>
</b:if>

If, somehow blogger decides to change some marks, here's a txt file of the code that you can download.

After that, just save the template and go see if it works.
The title hack only changes the titles of post pages, and not your main page.