mirror of
https://github.com/gohugoio/hugo.git
synced 2025-08-31 22:41:53 +02:00
Merge commit 'f96384a3b596f9bc0a3a035970b09b2c601f0ccb'
This commit is contained in:
@@ -2,18 +2,13 @@
|
||||
title: Custom 404 Page
|
||||
linktitle: 404 Page
|
||||
description: If you know how to create a single page template, you have unlimited options for creating a custom 404.
|
||||
date: 2017-02-01
|
||||
publishdate: 2017-02-01
|
||||
categories: [templates]
|
||||
keywords: [404, page not found]
|
||||
menu:
|
||||
docs:
|
||||
parent: "templates"
|
||||
parent: templates
|
||||
weight: 120
|
||||
weight: 120 #rem
|
||||
draft: false
|
||||
aliases: []
|
||||
toc: false
|
||||
weight: 120
|
||||
---
|
||||
|
||||
When using Hugo with [GitHub Pages](https://pages.github.com/), you can provide your own template for a [custom 404 error page](https://docs.github.com/en/pages/getting-started-with-github-pages/creating-a-custom-404-page-for-your-github-pages-site) by creating a 404.html template file in the root of your `layouts` folder. When Hugo generates your site, the `404.html` file will be placed in the root.
|
||||
@@ -31,13 +26,13 @@ In addition to the standard page variables, the 404 page has access to all site
|
||||
|
||||
This is a basic example of a 404.html template:
|
||||
|
||||
{{< code file="layouts/404.html" download="404.html" >}}
|
||||
{{ define "main"}}
|
||||
<main id="main">
|
||||
<div>
|
||||
<h1 id="title"><a href="{{ "" | relURL }}">Go Home</a></h1>
|
||||
</div>
|
||||
</main>
|
||||
{{< code file="layouts/404.html" >}}
|
||||
{{ define "main" }}
|
||||
<main id="main">
|
||||
<div>
|
||||
<h1 id="title"><a href="{{ "" | relURL }}">Go Home</a></h1>
|
||||
</div>
|
||||
</main>
|
||||
{{ end }}
|
||||
{{< /code >}}
|
||||
|
||||
@@ -45,7 +40,7 @@ This is a basic example of a 404.html template:
|
||||
|
||||
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](/hosting-and-deployment/hosting-on-github/) and [GitLab Pages](/hosting-and-deployment/hosting-on-gitlab/). The 404 page is automatic.
|
||||
* [GitHub Pages](/hosting-and-deployment/hosting-on-github/), [GitLab Pages](/hosting-and-deployment/hosting-on-gitlab/) and [Cloudflare Pages](/hosting-and-deployment/hosting-on-cloudflare-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](https://nginx.org/en/docs/http/ngx_http_core_module.html#error_page).
|
||||
* Amazon AWS S3. When setting a bucket up for static web serving, you can specify the error file from within the S3 GUI.
|
||||
@@ -57,10 +52,4 @@ Your 404.html file can be set to load automatically when a visitor enters a mist
|
||||
* DigitalOcean App Platform. You can specify `error_document` in your app specification file or use control panel to set up error document. [Details here](https://docs.digitalocean.com/products/app-platform/how-to/manage-static-sites/#configure-a-static-site).
|
||||
* [Firebase Hosting](https://firebase.google.com/docs/hosting/full-config#404): `/404.html` automatically gets used as the 404 page.
|
||||
|
||||
{{% 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 %}}
|
||||
|
||||
[pagevars]: /variables/page/
|
||||
|
Reference in New Issue
Block a user