github/hugo
1
0
Fork 0
mirror of https://github.com/gohugoio/hugo.git synced 2024-11-07 20:30:36 -05:00
Code Issues Projects Releases Packages Wiki Activity
hugo/content/en/templates/404.md
Bjørn Erik Pedersen ec920363cd Squashed 'docs/' changes from 63386081c..4c5edacfe 
4c5edacfe cSpell config update (#1700)
9df788b25 Fix broken link (hugo modules) (#1710)
9928a70d6 Fix workspace formatting (#1707)
55467e7c8 Update partials.md
9f4bd0023 Update formats.md
9b3913c86 Remove footnoteAnchorPrefix and footnoteReturnLinkContents (#1704)
94502a09b Code block render hooks are introduced in v0.93.0 (#1701)
c447270ef Update sitemap-template.md
78665c1e0 Update sitemap-template.md
60653c17d Update the caddy error docs link (#1696)
9a3675aad Update sitemap templates (#1699)
e0d08cdbb Add wpxr-to-static to list of migration tools (#1512)
b53eb5a08 Add page for deploying with rclone (#1511)
4207c57ff netlify: Hugo 0.96.0
a18d646ea docs: Regen docshelper
e3e0981ed docs: Regen CLI docs
fda988d01 Merge commit 'd276e901b36d2576ef8350ed96b17f66254eac1b'
e4a26dbca tpl/crypto: Add optional encoding arg to hmac function

git-subtree-dir: docs
git-subtree-split: 4c5edacfeebd13eb7f876723c065466cd50e0cae
2022-04-08 13:32:01 +02:00

2.9 KiB
Raw Blame History

title linktitle description date publishdate lastmod categories keywords menu weight draft aliases toc
Custom 404 Page 404 Page If you know how to create a single page template, you have unlimited options for creating a custom 404. 2017-02-01 2017-02-01 2017-03-31
templates
404
page not found
docs
parent weight
templates 120
120 false
false

When using Hugo with GitHub Pages, you can provide your own template for a custom 404 error page by creating a 404.html template file in your /layouts folder. When Hugo generates your site, the 404.html file will be placed in the root.

404 pages will have all the regular page variables available to use in the templates.

In addition to the standard page variables, the 404 page has access to all site content accessible from .Pages.

▾ layouts/
    404.html

404.html

This is a basic example of a 404.html template:

{{< code file="layouts/404.html" download="404.html" >}} {{ define "main"}}

<a href="{{ "/" | relURL }}">Go Home

{{ end }} {{< /code >}}

Automatic Loading

Your 404.html file can be set to load automatically when a visitor enters a mistaken URL path, dependent upon the web serving environment you are using. For example:

  • GitHub Pages and GitLab Pages. The 404 page is automatic.
  • Apache. You can specify ErrorDocument 404 /404.html in an .htaccess file in the root of your site.
  • Nginx. You might specify error_page 404 /404.html; in your nginx.conf file. Details here.
  • Amazon AWS S3. When setting a bucket up for static web serving, you can specify the error file from within the S3 GUI.
  • Amazon CloudFront. You can specify the page in the Error Pages section in the CloudFront Console. Details here
  • Caddy Server. Use the handle_errors directive to specify error pages for one or more status codes. Details here
  • Netlify. Add /* /404.html 404 to content/_redirects. Details Here
  • Azure Static website. You can specify the Error document path in the Static website configuration page of the Azure portal. More details are available in the Static website documentation.

{{% note %}} hugo server will not automatically load your custom 404.html file, but you can test the appearance of your custom "not found" page by navigating your browser to /404.html. {{% /note %}}