Is there an easy way to redirect Blogger to WordPress with htaccess 301 redirects and canonical urls? We also started this blog on Blogger in 2004 and then migrated to WordPress in 2006. Long time readers will be aware of our challenges in making this major switch of a popular blog to a very new domain name. But being on our own domain name and paid hosting server has been a very useful step towards site freedom and full server control.
Blogger to WordPress
So what is the way we switched from Blogger to WordPress? While we kept the blogger blog live for many years, it was lot of duplicate content as we had migrated all posts to our domain name. Later we shortened the content, sometimes also tried a single page template with list of links to pointing to most visited articles, a big search box for new links – but readers would simply not click through to the new pages and there was very high bounce rate.
For some time we have set up the blogger blog such that links for the relevant articles redirect to same articles on main site. We found the following process resulted in better user experience as it let visitors be redirected to the actual posts from previous links. We tried to keep the SEO advantage of the links by pointing to the canonical urls.
I seek your valuable feedback if this a good technique.
Blogger Template Code
Here is the sample template code we use on our Blogger blog. Paste all the following code which we have tried to explain stepwise into the Blogger theme template.
First is the starting HTML code as used for any page.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>Now here is the canonical code which tells that the main blogger page is now on a new url.
<MainPage><link rel="canonical" href="http://www.quickonlinetips.com/" /></MainPage>
Now we add the canonical tags for the item pages. Note here we have not used the permalink of the final url, but instead used the domain.com/ItemNumber for the url. Blogger assigns each post a unique number and we take advantage of that.
<Blogger><ItemPage>
<link rel="canonical" href="http://www.quickonlinetips.com/<$BlogItemNumber$>" />
</ItemPage></Blogger>Now to add the script to redirect the main blogger page to your domain name and each item page to your Domain.com/ItemNumber.
<script type="text/javascript">
<MainOrArchivePage>window.location.href='http://www.quickonlinetips.com/';</MainOrArchivePage>
<Blogger><ItemPage>
window.location.href='http://www.quickonlinetips.com/<$BlogItemNumber$>';
</ItemPage></Blogger>
</script>
Now to add the title of the page for each page.
<title><$BlogPageTitle$></title>Close the Head tags and start the BODY tags
</head><body>Now to add h1 tags to the page which is linked to the main page or the blog post page. Added move notice to support noscript cases. Again linked via Blog ItemNumber.
<p>This page has moved to a new address.</p>
<h1>
<MainOrArchivePage><a href="http://www.quickonlinetips.com"><$BlogTitle$></a></MainOrArchivePage>
<Blogger><ItemPage>
<a href="http://www.quickonlinetips.com/<$BlogItemNumber$>"><$BlogItemTitle$></a>
</ItemPage></Blogger>
</h1>
</body></html>Full Code: Here is the complete code to cut and paste to your Blogger template. Remember to change your code for your domain name.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html><head>
<MainPage><link rel="canonical" href="http://www.quickonlinetips.com/" /></MainPage>
<Blogger><ItemPage>
<link rel="canonical" href="http://www.quickonlinetips.com/<$BlogItemNumber$>" />
</ItemPage></Blogger>
<script type="text/javascript">
<MainOrArchivePage>window.location.href='http://www.quickonlinetips.com/';</MainOrArchivePage>
<Blogger><ItemPage>
window.location.href='http://www.quickonlinetips.com/<$BlogItemNumber$>';
</ItemPage></Blogger>
</script>
<title><$BlogPageTitle$></title>
</head>
<body>
<p>This page has moved to a new address.</p>
<h1>
<MainOrArchivePage><a href="http://www.quickonlinetips.com"><$BlogTitle$></a></MainOrArchivePage>
<Blogger><ItemPage>
<a href="http://www.quickonlinetips.com/<$BlogItemNumber$>"><$BlogItemTitle$></a>
</ItemPage></Blogger>
</h1>
</body></html>This code does 3 things –
- Canonical urls – which points to a domain url, which will eventually 301 redirect to the correct page. Note Google allows Cross domain canonical urls, which means you can point canonical urls from one to another domain to avoid duplicate content.
- Redirects – The window in the browser refreshes to a new url and wordpress htaccess will eventually redirects the url to the new wordpress url. The user notices no change in the browser and has nothing to click to the new url.
- h1 tags – there are h1 tags which points to redirecting link with the blog / post title.
WordPress 301 Htaccess Redirects
Now all the urls will redirect to domain.com/ItemNumber. Now we will use the .htaccess on the domain name (which is under our control) to create 301 redirects from these Domain.com/ItemNumber urls to the appropriate post. Note we need to one redirect for each url, so if you have a large number of posts, you need to add all those redirects for them to work seamlessly.
Here is a snapshot of the htaccess codes in our file.
Basically you need to add in each line one redirect for each blog item number. Note that the .htaccess is a very powerful file in your server root folder which can bring your site down if not configured correctly. Always keeps htaccess backup before editing it.
redirect 301 /ItemNumber
redirect 301 /ItemNumber2
redirect 301 /ItemNumber3 Here is what the code does –
- Redirects users automatically from main blogger page to your domain name
- Redirects users automatically from each individual blogger url to the final WordPress url.
- Puts canonical urls in place. The canonical url points to a url, which has a 301 redirect to the final url.
This is good way if you want to completely move your blog to a new domain name and want a seamless transition of urls from Blogger to WordPress. If you are very concerned about SEO, Pagerank, traffic issues, please seek professional support on this.
Remarks
Note: Server side 301 redirects are the best way to redirect urls, along with passing pagerank. But blogger does not provide access to htaccess or server side redirects, so we use Javascript redirects – but note many do not recommend such redirects and they might not pass pagerank. There is no guarantee that search engines will honor the url suggestions by canonical urls linked in this way. We leverage the control of .htaccess 301 redirects (which is a good way) to redirect these urls further.
Warning: This will make the blogger blog and all its urls disappear from search engines, since they are now redirecting to new urls. So do this only if you are really ready for this. Also note incorrectly editing htacccess may take your site down.
Warning: This code is NOT approved by Blogger, Google, or anyone else. Please use this code AT YOUR OWN RISK. We don’t claim to be an expert on this can cannot provide support or predict in any way how it will affect your ranking, pagerank, indexing etc and bear no liability whatsoever.
IMPROVE THIS CODE – I seek your opinions and viewpoints on this technique. What are the drawbacks here and how can this code be made better. Post a comment.