Redirecting from Blogger with JavaScript

While it’s possible to redirect a whole site from Blogger to the exact same URLs, redirecting to similar URLs is hard.

Let’s say you want to redirect:

  • from: https://yoursite.blogspot.com/2012/01/blogpost-name.html
  • to: https://newsite.com/blogpost-name

The way to do this is to drop a snippet of JavaScript into your Blogger site’s template. Adding a redirect like this also makes it impossible for you to view your blog, so be careful :-). Also, adding a redirect like this means you won’t be able to edit your site’s theme using the simple tools (you’ll need to edit the HTML) - usually that’s no big deal since you want the old site to disappear, right?

1. Ed1t the theme’s HTML

You can do this in the Theme sidebar menu, click on the dropdown next to your theme, and select Edit HTML.

2. Embed a test JavaScript snippet

Here’s a test snippet I used:

<script type='text/javascript'>
    let newhost = 'https://johnmu.com/';
    let pathname = window.location.pathname.slice(0, -5); // drop .html
    let justname = pathname.split('/').pop(); // drop /YYYY/MM/ in the URL
    let redirtarget = newhost.concat(justname); // make full URL
    console.log(redirtarget);
</script>

Click the archaic diskette drive symbol to save, and try it out :-). Blogger’s editor is pretty horrible and re-encodes quotes so you’ll see &quot; or &#39; after saving. Don’t mind that, it works regardless.

3. Test the code by browsing

When you open the blog’s pages, in the developer console you’ll see the redirect target URL shown. This is a good way to check that you’ve set things up properly. You can get to the developer console in Chrome with right-click on an empty space, and selecting Inspect.

Make sure to check all kinds of pages, such as the homepage, an archive/tag page, and a post. Usually the homepage and posts are the more important ones to redirect though.

4. Add the redirect

When you’re happy that the URLs are correct, just add the redirect:

window.location.href = redirtarget;

The full snippet will now be:

<script type='text/javascript'>
    let newhost = 'https://johnmu.com/';
    let pathname = window.location.pathname.slice(0, -5); // drop .html
    let justname = pathname.split('/').pop(); // drop /YYYY/MM/ in the URL
    let redirtarget = newhost.concat(justname); // make full URL
    console.log(redirtarget);
    window.location.href = redirtarget;
</script>

Test your blog again by checking random URLs. Search for your blog and click on the links you find there. They should all redirect you to the new site.

If the goal is to just have the new site indexed in Google, submit a site-removal request for the blog. The site-removal request doesn’t block crawling and indexing (so Google will find the redirects), it just hides the old blog in search.

These requests become active within less than a day, and can be canceled at any time.

Comments / questions

There's currently no commenting functionality here. If you'd like to comment, please use Twitter and @me there. Thanks!

Tweet about this - and/or - search for latest comments / top comments

Related pages