/ Home / Blog

Adding Netlify redirect rules for Hugo

February 22, 2019

The initial jump into the netlify.toml file is a bit daunting at first, especially if you only want to make a small change. Once your Hugo site it deployed on Netlify, you’ll want to redirect traffic pointed to the provided subdomain to your primary domain.

netlify.toml #

Create a netlify.toml file in the root directory of your Hugo site. This file can be set up to do quite a bit. For our purposes, we’ll only configure the provided redirect from the deployment.

  ├── archetypes/
  ├── content/
  ├── themes/
  ├── config.toml
+ └── netlify.toml

The options specified in this configuration are merged with the settings specified in your Netlify console for your project. So, with the file in place, you can now phase in and test options as you become more familiar with the options.

Configuration #

The redirect information is available once the site is deployed and configured with a custom domain. Grab that configuration and add it to the [redirect] field in the netlify.toml file. The information is located in the Domain management section in the Netlify console.

The example below illustrates a site that has HTTPS enabled through Netlify. Note the https://.
# Redirect default Netlify subdomain to primary domain
https://<your-site-name>.netlify.app/* https://www.<your-custom-domain>/:splat 301!

Modify the netlify.toml:

# netlify.toml

  from = "https://<your-site-name>.netlify.app/*"
  to = "https://www.<your-custom-domain>/:splat"
  status = 301
  force = true #COMMENT: ensure that we always redirect

The same pattern can be repeated if more than one redirect is needed in the future. For example:

# netlify.toml

  from = ...
  to = ...

  from = ...
  to = ...

Deploy #

After deploying, you’ll see the below (or something similar) in the Deploy Summary confirming the redirect rule.

Extending netlify.toml #

The Hugo documentation provides a generic configuration baseline. You can adopt a more robust deployment over time by modifying the netlify.toml configuration as needed. Give it a look - I’m sure that you’ll find some interesting nuggets that will be helpful for your next project! 🎉