Jekyll 4 CMS
It’s been a week since I switched this website to Jekyll 4 CMS, and I’ve been quiet because based on website stats I’m still migrating 10+ posts each day - didn’t realise quite the power of SEO long tail.
I also used this opportunity to put final touches on the blog, so this is a follow-up to the original Migrate Wordpress to Jekyll 4 project.
I opted for using the standard jekyll-feed plugin.
That’s it - rebuild your Jekyll and you’ll find that feed is available at /feed.xml location.
I also used this opportunity to enhance image functionality for pages and posts. Initially I integrated images by adding fields like this to each post:
and then showing them using element like this in _layouts/post.yaml template:
layouts/post.html template in Jekyll_
But published via RSS feed, such posts will have no image in the post text, because technically it’s not the content of a post but a metadata. So I ended up adding images to each post like this:
and then removing the _post.yaml template functionality to show images.
End result: image/image_description fields are used to show postcards (image thumbnails) on the main and other index pages in Jekyll. Also, these fields are used for RSS thumbnails. Same images are included via Markdown to become part of content and be shown in post text in RSS.
Netlify are worth the money of pro plan, but most features are available even on the free plan (that I’m using for now). Forms are one of such features.
Just follow the Netlify guide for configuring JAMstack forms and Netlify, here are just short notes:
In your contact form, the standard HTML variety, add netlify word after the form action URL:
In Netlify, you’ll see form submissions under the Form section of your account: Netlify Forms
If you want to receive email notification when someone submits a contact for, add this: Form notifications - Netlify
I think my Markdown skills are certainly improving lately, but in the interest of time I decided to use snippets. Since Sublime Text 3 is still my favourite text editor, that’s where I configured snippets.
You configure new snippet by using this option in Sublime Text 3: Adding new snippet in Sublime Text 3
After that I just update the code with my snippet changes and save the file.
IMPORTANT: you must save the file with .sublime-snippet extension, otherwise Sublime Text won’t pick it up as snippet.
Here’s where I have my snippets on macOS:
I have the following snippets now, meaning I type the short code, press Tab and get it expanded:
I have just recently learned how to annotate images in Jekyll properly, so this contruction lets me show image with caption:
After snippet expansion, I modify the code to the actual image I’m planning to use, like this:
The result looks like this:
Here’s the Sublime Text 3 snippet code for the above:
I’m really enjoying the staightforward way to publish code snippets - at last there’s no more messing with formatting, let alone HTML tags to make it look proper. Markdown and Jekyll support for syntax highlighting do all the work for me here.
Sublime Text 3 has this snippet for me now:
meaning I just type hs and expand it with Tab to get everything ready for pasting my console text:
hs - snippet to start syntax-highlighted code
I also have this snippet to complete the syntax-highlight code:
it simply insets this block, when expanded:
he - snippet to end syntax-highlighted code
I cover 99% of my Unix Tutorial posts with these 3 code snippets. Will probably create something for posting image galleries later.
There’s still a handful of really old posts that use ancient URL structure and get traffic. These are useful pieces of content and valuable pages on my blog, so I don’t want them to just return “not found” page. I use redirects for such pages - used the same thing in Wordpress as well.
Redirects are done using special plugin in Jekyll: jekyll-redirect-from.
The way redirects are configured is simple. Just edit the post that needs to be redirected and add the redirect_from element to it:
What this does is it redirects page from redirect location: /2009/02/how-to-change-ownership-of-files-and-directories-in-unix
to the default post URL, in my case it’s just /how-to-change-ownership-of-files-and-directories-in-unix.
I believe this makes my Wordpress to Jekyll migration project complete enough, but expect to be working and sharing Jekyll knowledge going forward. Specifically, I will have another small project documenting my Jekyll on WSL2 setup.