And Now For Something Mildly Different

2023-10-21 650 words 4 minutes

/something-mildly-different/images/HotelExistenceOnWordPress2014Theme.jpg

Contents

On October 18th 2023, I migrated this website from WordPress hosted on an AWS EC2 VM, to a static website built with Hugo, now hosted on AWS S3. And this morning (October 21st), I just shut down the VM. I spun up the first version of this VM on February 5th, 2014 - so this setup has served me well for 9 years. It was rebuilt 3 times, starting with Ubuntu 13.04, ending with 20.04. The featured image is a capture of the last time it served up a page.

I really like WordPress, as well as the 2014 WordPress theme which was the default when I first installed it. But in 2020, I decided to try hosting some content generated with Hugo, and based on that experience, I have decided to switch the whole site over. For my purposes, I prefer the Hugo/S3/CloudFront setup for a few reasons:

1-2 a year, the server would go down, and I’d have to log into AWS and restart it
I had to patch the server and WordPress
The static pages generated by Hugo and served up by CloudFront/S3 will load faster
Stating hosting will save me a few dollars a month
Just because.

It took almost 2 weeks of my free time to migrate the content - I have about 100 posts. I used, and recommend, the wordpress-export-to-markdown script for the migration.

If I had more posts, I probably would have tweaked the migration script a bit to better suit my needs, but I ended up just taking the output and reviewing each post and manually tweaking it. The challenges I had were:

I wanted to show the post date vs the published date
The way it handled image captions did not seem to work with my Hugo theme
The way it handled images didn’t quite work either - I had numerous thumbnails leading to full sized images in WordPress, and this didn’t come over smoothly
The way it handled the WordPress featured image didn’t work with my Hugo theme
It did download all my images, which was awesome, but I had some video in my WordPress media, and it did not come over - I downloaded and linked to those videos manually

I am pleased that I have been able preserve all the links to this site - I think I have successfully avoided creating link rot. The previous WordPress version of this site used WordPress’s plain ?p= style links, and the site was receiving external traffic directly to those links. I built a page to redirect the plain ?p= links to the corresponding new pages on the site, such that requests for an old page, like https://www.hotelexistence.ca/me/?p=408, gets redirected to the new page, at https://www.hotelexistence.ca/fixing-ink-blobs-on-epson-xp-830-prints/. Here’s what I did:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34


<!doctype html>
<html>
<!-- HTML and Javascript to preserve and redirect WordPress plain links -->
    <head>
        <title>Redirect Old Links Page</title>
        <script>
            pagelinktable = [
            {'id':408, 'url':'/fixing-ink-blobs-on-epson-xp-830-prints/'},
            {'id':618, 'url':'/smart-dashcam-for-bicycles-part-5/'},
            ]
            function go_to_new_version_of_old_page() {
                searchparams=window.location.search;
                parsedsearchparams=new URLSearchParams(searchparams)
                pagenum=parseInt(parsedsearchparams.get('p') )
                if (!(isNaN(pagenum))) {
                    var result = pagelinktable.filter(obj => {
                    return obj.id === pagenum
                        })
                    if (result.length>0) {
                        window.location.href = result[0].url;
                    }
                    else {
                        document.getElementById('status').innerHTML = "No matching page found";
                    }
                }
                else {
                    document.getElementById('status').innerHTML = "No matching page found";
                }
            }
        </script>
      </head>
      <body onload="go_to_new_version_of_old_page()">
        <h1 id="status">This page has moved - redirecting</p>
</html>

Now that I’ve wrapped it up, I’m pleased with how the new version of the site looks, loads and is organized. I like how the LoveIt theme I used handles categories, has the menu on the top right, and has the short bio/social links at the top of the home page. Let’s see if I can keep this site going like this for the next 9 years.