Creating this blog using Zola, Abridge and Netlify

I have been thinking about setting up a blog for a long time and that time has finally come.

Tech Stack

This blog relies mainly on Zola which is a static site generator written in Rust and Abridge which probably is the most advanced theme for Zola. This stack makes the website particularly fast to build, load and offers great SEO out of the box.

For hosting, I use Netlify for free which allows building this website directly from a private Git repository.

Setup

The first step was to install Zola on my system. I could then start setting up my blog and Abridge.

# Create Zola website
yes "" | zola init mysite
cd mysite

# Turn it into a git repository and add Abridge as a submodule
git init
git submodule add https://github.com/jieiku/abridge.git themes/abridge
git submodule update --init --recursive
git submodule update --remote --merge

# Copy essential files for Abridge to my website
rsync themes/abridge/.gitignore .gitignore
rsync themes/abridge/config.toml config.toml
rsync themes/abridge/content/_index.md content/
rsync -r themes/abridge/COPY-TO-ROOT-SASS/* sass/
rsync themes/abridge/netlify.toml netlify.toml
rsync themes/abridge/package_abridge.js package_abridge.js
rsync themes/abridge/package.json package.json

I then went to the config.toml file and uncommented the following line.

#theme = "abridge"

Making it my own

In my config.toml, I changed a few things such as the base_url, title, description, author and keywords keys. I also commented out the textlogo so that the name of my blog would appear instead of the Abridge logo.

I then added a favicon-32x32.png file to the static folder and commented out all the other icons in config.toml. It doesn't look great but at least it's mine.

PWA

I could then easily turn my website into a progressive web app thanks to Abridge. This allows users to install my website as if it was a native application.

I copied the necessary manifest.json file.

cp themes/abridge/static/manifest.json static/

I then modified it with the name of my blog and added my icon files.

And finally, I ran the abridge script to generate the minified manifest file.

npm install
npm run abridge

Netlify

The last thing I had to do before publishing was modify the netlify.toml file to adapt it to my url.

Conclusion

Building a performant static blog with advanced features is pretty easy nowadays. And I hope I will be publishing many articles on this blog.