The Blogger Page Title by default isn’t SEO friendly to say the least. I added a Title tag code snippet to my blogger template ( Blogger - Change Page Title Tags for your Blog ) a while back. Everything looked good on my Page Title, but when I did a Google search for each of my page Titles, my blogs homepage always showed up, instead of each specific page Title, in the Google search results, which wasn’t what I wanted at all!
The answer…
I started searching for a better way of handling my blog page Title problem, what I found was a snippet of code that would change everything about my page Titles in a far better way than I was looking to accomplish. This new code snippet not only added my blogs specific page Titles to all my Google searches, for my blogs page Titles, it also added all my Labels to my Google Search results (Very Cool)!
By adding my Blogger Labels to the Title of each page, I’m adding keywords to the Google search results, so that moves my blog post one step closer to the top of Google search.
The code…
Below are the steps to add your Labels to your Blogger page Title:
1) Backup your blog template .xml file, to your local PC
2) Go to your Blogger Dashboard & Layout –> Edit HTML
3) Find the <title><data:blog.pageTitle/></title> tags at the top of your template, & delete them.
4) Add this code, above the <head> tag, at the top of the template :
<!-- Start Widget: Changing the Blogger Title Tag -->
<b:if cond='data:blog.pageType == "item"'>
<b:section id='titleTag'>
<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'><data:post.title/></b:includable>
<b:includable id='status-message'/>
<b:includable id='comment-form' var='post'>
<div class='comment-form'>
<a name='comment-form'/>
<h4 id='comment-post-message'><data:postCommentMsg/></h4>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='275' id='comment-editor' name='comment-editor' scrolling='no' src='' width='100%'/>
<data:post.friendConnectJs/>
<data:post.cmtfpIframe/>
<script type='text/javascript'>
BLOG_CMT_createIframe('<data:post.appRpcRelayPath/>', '<data:post.communityId/>');
</script>
</div>
</b:includable>
<b:includable id='backlinkDeleteIcon' var='backlink'/>
<b:includable id='postQuickEdit' var='post'/>
<b:includable id='main' var='top'><head>
<title>
<b:loop values='data:posts' var='post'>
<b:include data='post' name='post'/>
<b:if cond='data:post.labels'>—
<b:loop values='data:post.labels' var='label'>
<data:label.name/>
<b:if cond='data:label.isLast != "true"'>,
</b:if>
</b:loop>
</b:if>
</b:loop> —
<data:blog.title/>
</title>
</head></b:includable>
<b:includable id='commentDeleteIcon' var='comment'/>
<b:includable id='feedLinks'/>
<b:includable id='feedLinksBody' var='links'/>
<b:includable id='comments' var='post'/>
</b:widget>
</b:section>
<b:else/>
<title><data:blog.pageTitle/> AnyCustomTextHere</title>
</b:if>
<!-- End Widget: Changing the Blogger Title Tag -->
5) Replace the text AnyCustomTextHere in the new code snippet (towards the bottom of the code), with any text that you would like to show at the end of your blogs Title.
Note:
This code does have a couple of things I don’t really like, still it does a much better job at blog post SEO than the default Title tags, or any other Title tags I’ve tried on any of my Blogger blogs, not to mention adding all your Blogger Labels into Google Search results :
- If you want to change anything on your Blogger Dashboard Layout (edit gadgets, etc…) make the changes, but don’t click the SAVE button at the top right side of the screen. Blogger should still save your changes.
- If you want to add any new gadgets to the Blogger Layout, remove the entire Title code snippet, from the Blogger HTML editor, then save your template, paste the Title code snippet into another text editor (Windows Notepad), until you are done adding gadgets in the Blogger Dashboard Layout, when finished adding gadgets, replace the Title code snippet you saved inside of Windows Notepad.
- This new Title code snippet will also add all your comments from each blog post, to Google search results, I don’t like this feature & have tried to remove it, only to have blogger keep adding the code back to my Title tags, in the template, this is probably my biggest complaint about this code snippet, because each time someone adds a comment to your blog post, it will change your blog post rank in the search engines for better or worse.
Update:
Here is a link to a 2nd text file that includes similar code as this tutorial, this new code will only return Blogger Labels in the Page Title, everything installs the same on both versions.
(Download Blogger Labels Only - File)
Update:
Here is a link to a 3rd text file that includes similar code as this tutorial, this new code will only return Blogger Titles (without labels) in the Page Title, everything installs the same on all versions.
dxf file