Changing Blogger Titles from "Blog Title: Label/Page Title" to "Label/PageTitle: Blog Title"

2008-07-13T22:11:00.000-07:00

By default, Blogger displays titles "Blog Title: Label/Page Title." This is suboptimal from a Search Engine Optimization (SEO) perspective. Plus, it's just good practice to put the most important information first in a title. You probably didn't come her just to see "Rebecca's Workbench." No, you want to make Blogger behave in the desired manner.

Attempts to Make Blogger Behave in the Desired Manner

I found a number of pages with instructions on how to make blogger display page titles in the "Label/PageTitle: Blog Title" format, but none of them seemed to work for me. Additionally, when they do (or did) work, some of them required that the title be positioned outside of the head tags and were reported to break certain Blogger customization features.

I found that one problem I was having was that the most frequently cited technique involve using the if conditional "<b:if cond="'data:blog.pageType">." After some investigation, I discovered that label summaries return type "index," just like the blog's home page. This meant that the conditional didn't work for me. So I changed the conditional to see if the blog's page name is an empty string, as it is for the home page, but is not for both individual blog posts and label summaries.

Another problem I had was finding the data tag I needed to display the blog's title without the trailing ": Post/Label Name," resulting in "Post/Label Name: Blog Name: Post/Label Name." the magic data tag is "&ltdata:blog.title> (found at BLOGFixes.Com). So, to sum up, Blogger's title data tags (that I know of) are:

<data:blog.pageTitle/>: "Blog Title: Blog Page Name (the title of a post or the label)"
<data:blog.title/>: Just the Blog's Title
<data:blog.pageName/>: Just the Blog's Page Name

How to Change the Page Title

At last, I found a solution. As far as I can tell, this solution should not break any of Blogger's features. However, the blogs I am using it on all use a large amount of custom code, so it is difficult for me to tell. I know that it works for me. I hope that it works for you. If it doesn't, please leave a comment telling us what went wrong.

To change the page title:

Using your dashboard, go to "Edit HTML" in the "Layouts" section.
Back up your template. You can do this by clicking the "Download Full Template" link at the top of the page.
Replace the code "<title><data:blog.pagetitle/></title>" with the code in the code block below. This line of code is near the top, just inside the head tag (or you may be able to just search for it).
Click the "Save Template" button at the bottom of the screen. A yellow banner should appear at the top stating that "Your changes have been saved," and inviting you to "View Blog."

The Code Block

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

HTML Conditional Comments Tutorial Project

2008-07-13T07:18:00.001-07:00

Aren't class projects swell? This was a project I did for ENG 519.

Instructional Materials: Rebecca's Workbench

Changing Blogger Titles from "Blog Title: Label/Page Title" to "Label/PageTitle: Blog Title"

Attempts to Make Blogger Behave in the Desired Manner

How to Change the Page Title

The Code Block

OmniFocus and Applescript

HTML Conditional Comments Tutorial Project