Docs > Installing a Hugo theme

Guide to Installing a Hugo Theme

Hugo themes allow you to quickly change and customize the appearance of your website. Installing a new theme is a simple process that can be completed in just a few steps.

Preparations

Before you start, make sure that HugoCMS is installed on your server and that you have set it up. If you haven’t done this yet, please read our installation guide.

Step 1: Choose a Theme

  1. Visit the Hugo Themes Directory and select a theme that meets your needs.
  2. Note the Git repository link of the chosen theme. You will need this for the next step.

Step 2: Download the Theme

To download the theme, navigate in the terminal or command prompt to your Hugo website directory and use the git clone command, followed by the repository link of the theme. Make sure you clone the theme into the themes folder of your Hugo website.

cd path/to/your/Hugo-Website
git clone URL-of-the-Theme themes/Name-of-the-Theme

Replace path/to/your/Hugo-Website with the actual path to your Hugo website directory and URL-of-the-Theme with the Git repository link of the theme you have chosen.

Step 3: Activate the Theme

After you have downloaded the theme, you need to activate it in your website’s configuration file. This is usually done in the config.toml, config.yaml, or config.json file, depending on your choice of configuration language.

Open the configuration file and update the theme setting to use the name of the downloaded theme. For example, if your configuration file is config.json and the name of your theme is Name-of-the-Theme, update the file as follows:

"theme": "Name-of-the-Theme",

Step 4: Check the Changes

Simply use the HugoCMS for this, click on the Publish button.

Open a web browser and enter your domain to check if the new theme has been applied correctly.

Done!

Congratulations, you have successfully installed a new theme for your Hugo website. Experiment with different themes and customizations to find the perfect look for your website.

If you encounter any problems during the process, also check the theme’s documentation or the official Hugo documentation for further help.