Change Titles of Blogger Blog for Efficient SEO

After few hours of experimenting with the Blogger template variables, I revised the template for my blog to use the following template code for generating title tags:

<b:if cond='data:blog.pageName == &quot;&quot;'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/> | <data:blog.title/></title>
</b:if>

The title tag generated with this template code contains the post title first, followed by the blog title. This gives you search engine optimized titles as the post title is likely to contain more relevant keywords for a page than the blog title and relevant words should be placed near the beginning of title.

Secondly, I noticed that the blog.pageName variable contains valid title for regular Blogger posts and special pages such as search results, labels and archive pages. Also, in most cases the blog.pageName is same as blog.pageTitle minus blog.title. So by concatenating a few variables together, here are the titles generated by this template code:

• Home Page
  <title>Nine-One-One... Need Code, Help!</title>
• Blogger Search for "php gd library"
  <title>Search results for php gd library | Nine-One-One... Need Code, Help!</title>
• Label php
  <title>php | Nine-One-One... Need Code, Help!</title>
• Archive for May 2009
  <title>May 2009 | Nine-One-One... Need Code, Help!</title>
• Post
  <title>Change Titles of Blogger Blog for Efficient SEO | Nine-One-One... Need Code, Help!</title>

Usage

You need to insert this code in your Blogger template as follows:

1. Go to Blogger Dashboard › Layout › Edit HTML
2. Backup your original template using the "download full template" option.
3. Find the code in the Blogger template that says:
   <title><data:blog.pageTitle/></title>
• If you cannot find it, chances are that you already have a similar hack installed. In this case, proceed if you know exactly what you are doing.
4. Replace it with the code mentioned in the beginning of this article and save the template.
5. Test your blog thoroughly.

Update: Change Titles of Blogger Blog That Use Classic Template

Classic Blogger templates are harder to customize. However, I have found a way to change the title for blogs that use the classic Blogger templates. The following trick changes the titles for post pages from:

<title>Blog Title: Blog Post 1</title>

to:

<title>Blog Post 1 | Blog Title</title>

The titles for other pages remain the same. Here is the template code for classic templates:

<MainOrArchivePage>
<title><$BlogPageTitle$></title>
</MainOrArchivePage> 

<ItemPage>
<title><Blogger><$BlogItemTitle$></Blogger> | <$BlogTitle$></title>
</ItemPage>

The above code should replace the existing title code for your template, which normally looks like:

<title><$BlogPageTitle$></title>

And here are the resulting titles:

• Home Page
  <title>Blog Title</title>
• Blogger Search for "lorem"
  <title>Blog Title</title>
• Label php
  <title>Blog Title</title>
• Archive for October 2009
  <title>Blog Title: October 2009</title>
• Post
  <title>Blog Post 1 | Blog Title</title>