Blogging With Hugo

What’s the latest version as of writing this post With version 0.146.0, the Hugo template system was re-architected for very good reasons. This simplifies a lot of things for template lookups. However, there are breaking changes despite the best efforts of the authors. Not all websites and themes that use Hugo, keep up with the pace of Hugo’s development. Many of these projects are open source like Hugo, furthermore many of the maintainers have more than 1 job and aren’t paid to keep their source code up to date. ...

I have been using Hugo-PaperMod as a theme for quite some time. It is pretty lightweight and yet flexible. For the past 4-5 years, I have been working with this Hugo based blog and I have definitely learned a lot about the structure of a Hugo website and made several modifications to the original theme but just on my blog and shared about it earlier. There was one thing that I hadn’t done for quite sometime. Primarily because I really don’t have the time to keep modifying themes. I barely have time to write about things I want to write. But today I bit the bullet and decided that I was going to do it. This is partly because my wife was reviewing the latest Resume page that I added and she told me that the navigation had to be scrolled horizontally! And as someone who has built user friendly platforms most of my professional career, this hurt. So off to work I went. ...

Did you know Hugo has this feature called Modules? Apparently built on the same concepts of Go Modules, which shouldn’t be a surprise. So having used all my hugo themes so far as Git Submodules, I wanted to switch over to this method. Hugo modules are considered to be the building blocks of Hugo. It is the Hugo way of modularising your static website. Apparently you can create a theme as a module and content as another module and use them together in a third module to serve as your static website. I didn’t go that far just yet. ...

This post is more of a note to self. PaperMod Update So last week, after a very long time, I actually spent some time doing some housekeeping on this blog. I decided to check Hugo versions and what’s new on paperMod. Found that there were many new things. Pulled in the latest and built the site only to realize it broke! How did you get the latest version? git submodule update --recursive --remote So some of the features introduced in the latest version of PaperMod weren’t supported in the version of Hugo that I had running, which was v0.109.0. I am not aware of what features exactly, so can’t really tell you. I didn’t have the time to explore. ...

By now you are already aware that at this time, this blog is using Hugo-PaperMod as its theme. This theme, as I have repeatedly mentioned, is pretty minimalistic yet full of necessary features. One such feature is search. As this is a static website, search is implemented on the client-side. When Hugo builds the website, it generates a certain index.json that is indexed for this very purpose. PaperMod uses Fuse.js for its search. You can read all about it in the GitHub hosted documentation. ...

Before I used PaperMod as my website’s base theme, I had it using Hugo-clarity. Both these themes couldn’t be further apart from one another. When I look back today, I still wonder why I chose Clarity, maybe it was the fact that it came with an abundant feature-set, of which I probably only used like 50% or less. But it was my first experience with Hugo. Back then, I used Disqus to enable users to comment on my posts. It was easy to get started with in that theme, there was built-in support. All I had to do was link my Disqus account, which I created just for this purpose. ...

If you are reading this post, you might already be wondering what theme I use. It is not a secret. I use Hugo-PaperMod for this blog. It is a minimalistic looking theme which just so happens to be pretty feature rich at the same time. Hugo-PaperMod offers you three modes in which you can display the landing page of your blog. Regular Mode Home Info Mode Profile Mode I appreciate these modes as they are. But I wanted something different. If you have seen my landing page, you already know where I am going with this. ...

I wanted to give a shout-out to a GitHub Repository that I came across, which hosted some custom CSS for modifying the look of PaperMod by a tiny bit. I thought I’d try it and hence the shout-out. Checkout hugo-PaperMod-Mod. The styles include: thumbnails sidebar table of contents wider posts on landing page

So you have started using Hugo for your website or blog or whatever you have built, and you came across something called a Shortcode. If Hugo were a programming language, shortcodes would be sub-routines, or reusable units of code. - Eakan But the truth is, Hugo is not a programming language. It is a static site generator that generates content based on markdown files. Markdown syntax is pretty limited. So how do you make your website as attractive and engaging as any other modern website with these limitations? ...

Featured Image is “Search!” by Jeffrey Beall is licensed with CC BY-ND 2.0. To view a copy of this license, visit https://creativecommons.org/licenses/by-nd/2.0/ In an earlier post about migrating from wordpress to self hosted on Azure, I took you through some steps to host a blog on Hugo. But I don’t know if you realised the blog didn’t have a search function. I couldn’t really search for articles! That I felt was a step back from my wordpress blog where I had the ability to search. Not just me, but you know, if anyone ever wants to search for a particular content in my blog, they really didn’t have a way to do that, unless google let them search. ...