Add a 404 Not Found Page

In an ideal world, every web page would exist, but sometimes links go to pages that doen’t exist. This is why we make “404 - not found” pages. In Hugo you can do the same. Many of our sites are hosted with Netlify which also support these files - automatically returning the correct http status code for them.

To make yours, you can add a file into your layouts folder.

Below is an example of a basic one, which you can change to anything you’d like.

{{ theme }}/layouts/404.html

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
{{ define "main" }}

<main>

    <br><br>    
    <h1>We couldn't find this Page!</h1>

    <p>
        Please try our search page to look for it or go back 
        to the <a href="/">home page</a>.
    </p>

</main>

{{ end }}
See Our 404 Page (for example)