Brief

Today i tried to setup static site builder called HUGO, for blogging. It comes in handy once you set up all the parameters. It is a combination of markdown + config files. With few hours of efforts was able to set it up.

Installing HUGO is very straightforward, you can find instructions for your platform here.

Main problems that one could face are:

• version of HUGO and the reference blogs might be outdated, hence please refer to the latest docs of HUGO
• it is worth spending sometime to go through the directory structure
• images and paths can get pretty cumbersome, i could not setup markdown based rendering in hugo for images
• using shortcodes for rendering images in between the content came in handy

HUGO needs some additional setup to get started with Math symbols in blogs using Katex, have attached relevant link in the references for the same.

Below are some commands to get started with HUGO.

Commands

 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

# install HUGO (macOS)
brew install hugo

# create HUGO site called "blog"
# choose format yaml
hugo new site blog --format yaml

# add desired theme as submodule
git submodule add https://github.com/reorx/hugo-PaperModX.git themes/PaperModX

# update submodule
git submodule update --init --recursive

# go to respective site directory
cd blog

# generate static website
hugo

# live rebuild server
hugo server -D

# using python http server
python3 -m http.server -d public

# before deploy
hugo --minify

# pagefind build index
npx pagefind --site public

# copy public folder to your hosting platform

References

1. PaperModX features
2. Adding images in HUGO is pain
3. Math in HUGO
4. Emoji support
5. Using Local fonts HUGO
6. Shortcodes super useful
7. Setting up internal search using pagefind

Written By

Sagar Sarkale