Migrating the Blog Part - 5

This is part of a series of posts about how I completed the migration of my blog from Blogger to a self-hosted solution based on AWS S3.

  • Part 1 - Decide on where to host the new blog and which platform I would use
  • Part 2 - Export all the content out of Blogger and new blog design
  • Part 3 - Import all the content into the new blog
  • Part 4 - Fix up all the content issues
  • Part 5 - Redirect all old content to the new site (This post)

Post URLs

When generating the blog post URL's for my relocated blog they did not necessarily match the URL's that existed in the past

Let's take an example

The old URL

https://technodrone.blogspot.com/2019/02/goodbye-docker-and-thanks-for-all-fish.html

And the new URL that was auto-generated by Hugo.

https://blog.technodrone.cloud/2019/02/goodbye-docker-and-thanks-for-all-fish/

As you can see they are not the same.

The annoying thing about this is that there is no real mechanism within Blogger to redirect posts - unless you are interested in redirecting a URL within the same site itself. This was not useful, or helpful.

The Blogger template itself is mostly HTML and some javascript.

So the two options were:

  1. Redirect each and every single post to the newly created URL
  2. Create a global redirect from the site to redirect to a new FQDN, and maintain the post URL's

The first option became really ugly, really fast

I would have to insert a code snippet such as the one below to redirect a post:

<b:if cond='data:blog.url == &quot;https://technodrone.blogspot.com/2019/02/goodbye-docker-and-thanks-for-all-fish.html&quot;'>
<link href='https://blog.technodrone.cloud/2019/02/goodbye-docker-and-thanks-for-all-the-fish/' rel='canonical'/>
<meta content='0;url=https://blog.technodrone.cloud/2019/02/goodbye-docker-and-thanks-for-all-the-fish/' http-equiv='refresh'/>
</b:if>

That meant adding in another ~3,500 lines into the template for redirection of the blog posts - this is ridiculous.

So I went with the second option. A global redirect. In order for that I needed to add in an additional value into each of the blog posts to modify the generated URL.

title: 'Goodbye Docker and Thanks for all the Fish'
date: 2019-02-25
draft: false
url: /2019/02/goodbye-docker-and-thanks-for-all-fish.html <<<===
tags : [docker, Kubernetes, Miscellaneous, Cloud]

I now had the same same suffixes for all my posts - I just had to redirect the first part of the URL - the FQDN to a new site.

Global redirect

This was accomplished with a few small lines of javascript in the template.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:loop values='data:posts' var='post'>
<script>
var oldURL = &quot;technodrone.blogspot.com&quot;;
var newURL = &quot;blog.technodrone.cloud&quot;;
var url = location.href;
var newURL = url.replace(document.domain,newURL);
window.location = newURL
</script>
</b:loop>
</b:if>

All this does is replace a old FQDN with a new one, with a new one.

So when someone would access

https://technodrone.blogspot.com/2019/02/goodbye-docker-and-thanks-for-all-fish.html

it would take out the technodrone.blogspot.com and replace it with blog.technodrone.cloud and redirect the client to

https://blog.technodrone.cloud/2019/02/goodbye-docker-and-thanks-for-all-fish.html

Special cases

There were 2 exceptions to this rule.

The front page

I wanted everyone that did not access a specific post (i.e. https://technodrone.blogspot.com), to still go to the main page and not be automatically redirected to the new blog. I did not want them to be redirected to new URL - and above and beyond that - having an “This is my last post, I am moving” as a post on my new blog - did not feel right to me. The javascript above actually took care of this for me. So I did not need to do anything for this to work.

Static pages

Since the static pages were not part of the same content (they are not considered posts in the blogger platform), I needed to create static redirects (like the first option mentioned in the beginning of this post) which was ok - because I only had 4 static pages.

There you have it, all in all I think this took me about 2-3 weeks of work, not working on this full time of course.

I am really happy with the result, with the way I can now easily create content which suits my flow, the way I work, and hopefully will be the home for my content for foreseeable future.

I hope this series was useful.

I would be very interested to hear your thoughts or comments so please feel free to ping me on Twitter.