BUSOBOSS - Good riddance WP & Gutenberg, Long live Hugo!

DD1

Joined
Oct 2, 2017
Messages
79
Likes
76
Degree
0
Hi Builders,

I finally took the courage to leave WP behind and migrate to Hugo.

Since there isn't much material about that online, at least from a beginner's point of view, and this forum has given me so much knowledge and motivation, I decided I wanted to give back something to the community. I believe this is unique enough to help others who might be in the same situation.

I am not a programmer. I know my way around HTML and CSS because I have bought three magazines in a newsstand, before the Y2K, and I copied code from others, back when Geocities and having your own private email address as a teen were a big thing.

Nevertheless, I made the jump.

Going around the inconveniences of WP was bearable because WP used to be practical: what you see used to be what you get! Gutenberg made it a terrible experience for my 3G internet connection and my old, basic laptop. Hugo allowed me to have a static site without having to (properly) having to learn CSS, which is huge for me. In short, more control, less bloat.

Plus, there's the added security. No more hackers trying to implement malicious code in my WP install; no more time wasted fighting comment spam.

The end result at the moment looks very, very similar to my previous site, which used the BuSo Lightning. Oddly enough, I find the end result more satisfying than my previous WP site. Naturally, under Hugo I still have to deal with the frustration of not finding whatever it is I need, I don't know the proper tech terms/slang/lingo to search them, there are considerably less resources to helping people with issues - not to mention non-programmers like me.

Still, my difficulties customizing Hugo are the same in comparison with WP. However, I can work with my old laptop and generate a new site much faster than having to deal with Gutenberg blocks. I can also get a live preview, offline, without having to be connected (which is insane to even consider in the day and age of optic fiber, but those are my circumstances at the moment and I have to live with them).

I'm NOT planning to sell the site in the future. And even if I were, it'd be easy to replicate URL structure, tags, and categories, plus all my content is in front matter .md files using HTML code and it'd be a matter of copying and pasting the content.

All in all, the main message I want to leave here is: I'm a very happy camper. I'll post what I consider were the main highlights of the process so far, feel free to ask any questions as well.

Thanks for reading!
 
Challenge I: migrating from (slow) Gutenberg to SSG (4 days mostly spent on the learning curve)

My main reason for choosing Hugo is because it seemed the most newbie-friendly and most documented of the static site generators.

I saw some tutorials on YouTube, it's a channel called Giraffe Academy - this is his website. After watching the videos, I noticed some of them embedded on Hugo's official website.

I also downloaded Atom and it has been a game changer, I always used Notepad to code my HTML. I feel very stupid for never having heard of it before.

I chose a Hugo theme and tweaked it to my needs - changed colors and added my logo on the header. It looks just like @Ryuzaki 's BuSo Lightning, as I said above.

Finally, I tweaked Hugo front matter to include Buso's On-Page SEO advice.
 
Challenge II: content migration & review, changing URL structure, updating .htaccess

My goal here was get the updated site online ASAP.

I have manually downloaded all 135 posts and manually recreated all Tablepress tables. I tried 4 different ways of doing this part of the process in a somewhat automated way, but I couldn't make anything work. I figured I'd waste less time and move forward by doing things manually than by trying to make an automated process work because I'd still need to review all content to make sure everything looks sharp.

I also shortened and simplified my URL structure. I'm also building a physical silo with 3 categories, which is more than enough in my case.

I also updated all of the dates on the articles. Some were as old as 2017.

I ended with 85 posts, from 135, by trimming 45 short posts and combining the remaining 5. I uploaded the entire site yesterday.

Today I checked Webmaster's Tools, or whatever it's called, and Google has already crawled the new sitemap; however, the SERPs still display the old results.
 
Challenge III: re-generate all images

Rather than working around with the result of WP compression plugins and 5-6 different image sizes, I re-generated all images from scratch.

I had all PNG originals in a separate folder, as well as the original JPG product pictures (it's an Amazon affiliate site).

So I used Irfanview to resize and compress all images. Currently I have just under 1,000 images on the site, and the size went down from 720 MB to 62 MB.
 
Are you generating the site locally using the command line and then uploading with FTP? Or are you running/generating everything at your host? I’m trying to figure out how to get started and all the documentation is vague. Help another non-programmer out...how did you learn that part?
 
  • Like
Reactions: DD1
Are you generating the site locally using the command line and then uploading with FTP? Or are you running/generating everything at your host? I’m trying to figure out how to get started and all the documentation is vague. Help another non-programmer out...how did you learn that part?

I know, right? Often it feels like someone finished the joke, everybody else is laughing, and you're the only one who didn't get it.

I'll do my best to explain things. English is not my first language, so I might not be using proper vocab.

Just like you type hugo server -D to build a virtual copy of your website and see what it looks like, when you type hugo, Hugo creates a new folder, called public, and will publish all your website files there. It might take a while if you have more files -- in my case sometimes even 30 seconds/30,000 ms, so be patient.

Then, all you have to do is to upload that folder to your site. Like you said, I do it via FTP. (BTW, yesterday, when I was doing it all for the first time, I found out there were files on my shared host to configure my FileZilla FTP client. Super handy, very fast.)

Please let me know if you understood it. It's simple once you figured it out, but it's like saying you need to release the clutch slowly with the left foot and accelerate the car gradually with the right foot at the same time when driving a stick -- easier to actually do it than explain it in words.
 
Welcome to the uncool kids club. This will likely be the best decision you've ever made as a webmaster.

Now that you've broken free from the shackles of wordpress I'm looking forward to seeing how you evolve as a webmaster and as a marketer.
 
Apparently, my migration only caused "mobile usability isssues" in two pages, due to a big table in each of the pages that I completely overlooked.

I fixed one of the tables: the other had too many data and was useless, so I transformed it into bullet points and H3 headers and got rid of it completely.
 
Back