How to install Hugo website generator on Ubuntu 22.04

Hello, friends. In this post, you will learn how to install Hugo on Ubuntu 22.04.

If you didn’t know, Hugo is a powerful static website generator. If we use as reference, the project’s website.

Hugo is one of the most popular open-source static site generators. With its amazing speed and flexibility, Hugo makes building websites fun again.

It is incredibly fast because it is written in Go and will be able to build your website in no time.

Hugo is open-source and completely free. So, you can use it without restrictions both for learning and for medium-scale information projects.

Hugo provides a robust theming system that is easy to implement but capable of producing even the most complicated websites. So, there will be no creativity problems when creating the site.

Therefore, it is an important tool, and we are going to install it.

Install Hugo on Ubuntu 22.04

First, open a terminal and make sure the system is up-to-date.

sudo apt update
sudo apt upgrade

To install Hugo, we have several methods. One of the easiest and that guarantees us to have the latest version, is to directly download the DEB package and install it.

Toachieveo this, in the terminal you can run

wget https://github.com/gohugoio/hugo/releases/download /v0.104.2/hugo_0.104.2_linux-amd64.deb

Remember that the command will change depending on the version to download. For this, I suggest you check which is the latest version and the corresponding link from here.

Then, proceed to install it

sudo apt install ./hugo_0.104.2_linux-amd64.deb

At the end, you can check the installed version with the following command:

hugo version

Sample Output:

hugo v0.104.2-84cbe724983b4b6153fd39aae0888cbb89a56cda linux/amd64 BuildDate=2022-09-29T10:31:09Z VendorInfo=gohugoio

With this,, we will be able to start Hugo.

Using Hugo for testing

With Hugo installed, the first thing to do is to create a new site. This is done with the following command.

hugo new site testblog.unixcop.com

You can replace testblog.unixcop.com with the name of yours or the project.

You will get an output screen like this

Congratulations! Your new Hugo site is created in /home/angelo/testblog.unixcop.com.

Just a few more steps and you're ready to go:

1. Download a theme into the same-named folder.
   Choose a theme from https://themes.gohugo.io/ or
   create your own with the "hugo new theme <THEMENAME>" command.
2. Perhaps you want to add some content. You can add single files
   with "hugo new <SECTIONNAME>/<FILENAME>.<FORMAT>".
3. Start the built-in live server via "hugo server".

Visit https://gohugo.io/ for quickstart guide and full documentation.

The above command will create a folder with the site name, but also the whole site structure with its configuration file.

Access it and display the contents

cd testblog.unixcop.com/
ls

Sample output:

archetypes config.toml content data layouts public static themes

Now create a new file that will serve as a post or page. To achieve this, follow this syntax.

hugo new [category]/[file-name]

For example,

hugo new posts/sample.md

As you can see, Hugo also works with MD files, which it will then convert to HTML correctly.

Just add some content

Once you have the whole site done, you can build it

hugo

You will have a screen output like this

                   | EN  
-------------------+-----
  Pages            |  3  
  Paginator pages  |  0  
  Non-page files   |  0  
  Static files     |  0  
  Processed images |  0  
  Aliases          |  0  
  Sitemaps         |  1  
  Cleaned          |  0  

Total in 23 ms

It would only remain to serve the project, so you have an idea of how it looks like.

hugo server

And it will be available at http://localhost:1313

That’s all. See how simple it was?

If you want additional information, I recommend you to take a look at the official documentation of the tool.