Create better titles for your Blogger posts (SEO)

A simple way to make the titles of your blog posts a little bit more search engine-friendly.

By Donald Ritchie

In this article, I'll show you how to shorten the titles of your Blogger posts, in particular by removing the name of the blog from the title. Why would you want to do that? Put simply, to improve your blog's search engine rankings.

Let me explain. Suppose you have a blog named My Granny's Secrets. One of those secrets is Grandma's recipe for old-fashioned cornbread stuffing. You write up the recipe as a blog post, and give it the title Cornbread Stuffing Recipe. So far, so good.

The trouble is that Blogger will then combine that title with the name of the blog itself. So the actual text you see in your browser's title bar will be:

My Granny's Secrets: Cornbread Stuffing Recipe

Now, one of the best way to improve a web page's search engine ranking is to make its title match the actual words your visitors are likely to search for - no more, no less. In this case, anyone looking for this particular recipe is unlikely to include Granny or Secrets in their search term. Those words merely dilute the title and diminish the effectiveness of the more important terms. Cornbread Stuffing Recipe on its own makes a much more effective title. That's because it's the actual phrase (or a close variation of it) that visitors are likely to search for.

Some experts also believe that the words at the start of the title carry more weight than those at the end. Removing the name of the blog from the start of the page title will therefore enhance the value of the remaining words.

Editing the HTML

In order to remove the blog title from the page title, you need to edit your template's underlying HTML.

This is not particularly difficult, but it is potentially dangerous. Do it carelessly, and you risk ruining the entire blog - perhaps even making it completely unreadable. To safeguard against that, take a backup of the template before you start (here's how). Also, be sure to preview your changes before save them.

The main template screen

Figure 1: The main template page in the Blogger dashboard.

To edit the template's HTML, start by navigating to the main template page. You reach this page by clicking Template (in the left-hand panel) from anywhere in the blog's dashboard (see Figure 1). You should see an image of your main page, under the heading "Live on Blog".

Immediately below this image, you will see a button labeled Edit HTML. Click that button to bring up the HTML editor (Figure 2).

The HTML editor

Figure 2: Use this screen to edit the template's HTML.

You now need to look through the code in the editing window to locate the following line (if necessary, use your browser's "Find on this page" feature to locate it):

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

Carefully delete this line, then type (or paste) the following five lines in its place:

<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/></title>
</b:if>

To check that you haven't done anything disastrous, click the Preview button (do not click Save Template at this stage). If all is well, you will see an image of the blog's home page.

A little background

Before we go any further, let me explain what you have done.

The first line of code shown above (the one you deleted) tells Blogger to use the blog's pageTitle property as the title of the post. That property contains the concatenation of the blog title and the post title. You need to change the code so that it shows just the post title. This is contained in the pageName property.

You could simply change pageTitle to pageName in the relevant line. But there's a complication. The blog's home page doesn't have a pageName, so it would show up with a blank title, which is undesirable.

The five lines that you inserted will check to see if the current page is the home page (by looking for a pageType equal to "index"). If it is, it will use the blog title as the page title, otherwise it will use the pageName.

Save your changes

If you're happy that you've correctly edited the code (and that you know how to restore the original if necessary), go ahead and click Save Template. (If you're in any doubt, click Clear Edits instead.)

Next, navigate to the blog itself. Visit some of your posts, checking the browser's title bar as you do so. In each case, you should see the title of the post, not that of the blog. The obvious exception is the home page, where you should just see the blog title. (In all cases, you'll also see the name of the browser in the title bar, but that's not relevant to this exercise.)

What happens next?

Don't expect to see an immediate improvement in your search engine ranking. It often takes several days or weeks for this sort of change to take effect. Nor should you expect this simple tweak to take you to the very top of the results page. In most cases, it will give a noticeable boost to your rankings, but probably not a dramatic one. But given the relatively small amount of effort involved, it is certainly a worthwhile thing to do.

June 2012

Please note: The information given on this site has been carefully checked and is believed to be correct, but no legal liability can be accepted for its use. Do not use code, components or techniques unless you are satisfied that they will work correctly with your sites or applications.

If you found this article useful, please tell your friends: