Near the end of 2024, my home parish had GoDaddy build us a WordPress site. Not long after this decision, I became the admin of the parish website. The primary purpose of the site is to display the calendar for the services and other events at church for each month, which was easy enough; however, any other task was daunting (e.g. adding a flyer or image to the homepage) and sometimes seemingly impossible (e.g. editing the text on the homepage) with however the site was configured by GoDaddy. Eventually, the editor plugin… bricked.
How did the editor plugin brick, rendering the site un-editable? Well, our PHP version needed to be updated (in order to keep getting security patches), so we updated it. Apparently, this change was incompatible with our editor’s plugin’s version. In order to be updated, it wanted an activation key (that I knew absolutely nothing about). This broken proprietary software configuration broke along with it my technological camel’s back, so I decided to rebuild the site the right way: with Hugo.
Here was my goal: create an identical site with HTML, CSS, and MINIMAL (or ideally no) JavaScript–Keep It Simple, Silly. Although I used Hugo, I basically wrote the site in HTML, making a shortcode for each page (the .md files merely call shortcodes and have the title, nothing else). I began with copying and pasting all the text from the site into HTML files (in the shortcodes directory) and downloading all media files, as well as the cool CyrillicOld font the site had. I converted the downloaded images to .webp files in compliance with this guide, and I organized the gallery page by year/event and created captions for each image. I even added in a couple videos! Even with the 20MB of videos, the whole front end of the site is only 35MB as of the time of writing.
Once I got the Hugo site to look like an improved version of the WordPress one, it was time to deal with the contact info. On the WordPress site, email addresses and phone numbers were in plain text–not a good practice if you don’t want spam. On the other hand, creating a contact form would require adding in PHP (contrary to my goal stated above), and whatever messages of value submitted to the WordPress site’s contact form were drowned in irreverent spam. In pursuit of the royal path of proper website development, I came across this tool to turn the email addresses into an image file that would be deciphered by JavaScript (a fair use of the scripting language). I used a similar tool for the phone numbers. I will admit that these cipher techniques appear to be a little buggy on certain browsers, so I might re-strategize how I display contact info on this site.
In summary, the Hugo site is simple, loads fast, and does what it needs to do without a bunch of unnecessary “features” that steer the site off course from its intended purpose. Additionally, it is way cheaper to run a Hugo site on a VPS than it is to run a WordPress site on GoDaddy.