Creating custom 404 pages

Working with a specific static site generator?
Customize CloudCannon's documentation to suit your SSG.

Astro

Bridgetown

Docusaurus

Eleventy

Gatsby

Hugo

Jekyll

Lume

MkDocs

Next.js

Nuxt

Static

SvelteKit

Custom

Great! We'll show you documentation relevant to .
You can change this any time using the dropdown in the navigation bar.

CloudCannon serves a 404 page when it can’t find a file on your site. Create your own 404 page to blend in with the rest of your site.

To create a custom 404 page:

1. Create a file called 404.html at the root of your site
2. Add the content you want CloudCannon to serve

To use different 404 pages for parts of your site, you can use the 404 status code in a routing.json file.

For example, if we want a unique 404 page for blog posts, we might add a /404-blog.html page on our site. Your routing file can then be configured to use this:

{
  "routes": [
    {
      "from": "/blog/.*",
      "to": "/404-blog.html",
      "status": 404,
      "forced": false
    }
  ]
}

A 404 routing status will transparently proxy the original request. The URL will not change, and the contents of /404-blog.html will be returned.

Make sure to set forced: false, otherwise all requests that match the from regex will return a 404, regardless of whether the requested file exists.