How to set up a custom 404 page

You picked a template. Now your server needs to show it whenever someone opens a page that does not exist. Find your host below and follow the steps. Each one takes a few minutes.

First, download a template and save it as 404.html. Change the brand name and links, and upload it to the main folder of your website.

Apache and most shared hosting

If your host uses Apache or LiteSpeed (most shared hosting plans do), add this line to the .htaccess file in your main folder, usually public_html. Create the file if it does not exist.

ErrorDocument 404 /404.html

Use a path that starts with a slash, not a full address with https. A full address makes Apache send a redirect instead of the 404 status.

cPanel

In cPanel, open Error Pages in the Advanced section, choose your domain, click 404 (Not Found), paste the template code and save. cPanel writes the .htaccess line for you.

Nginx

Add this inside the server block of your site configuration, then reload Nginx with sudo nginx -s reload.

error_page 404 /404.html;
location = /404.html {
    internal;
}

WordPress

WordPress uses the 404.php file in your theme. The safest way is a child theme: create 404.php in the child theme folder and paste the template's HTML into it. If you want your normal header and footer, put <?php get_header(); ?> at the top and <?php get_footer(); ?> at the bottom, and keep only the main content from the template. Many themes and page builders also have a 404 page setting.

Netlify, Cloudflare Pages and Vercel

Put 404.html in the folder you deploy, next to index.html. Netlify and Cloudflare Pages use it automatically. Vercel does the same for static sites. For Next.js, create app/not-found.js (or pages/404.js) and move the template's HTML into it.

GitHub Pages

Add 404.html to the root of the branch or folder you publish. GitHub Pages shows it for every missing page and sends the correct 404 status.

Keep your SEO safe

• Send the 404 status code. The page should look friendly, but the server must still say 404. If it says 200, Google may report a soft 404.
• Do not redirect everything to the home page. Only redirect pages that really moved, with a 301 redirect to the new address.
• Keep the noindex tag. Every template includes it, so the error page itself never shows up in search results.
• Use links that start with a slash, like / and /contact, so they work from any address.
• Check for broken links in Google Search Console, in the Pages report, and fix the most visited ones first.

Tip: open a made-up address on your site, such as /test-404, to see your new page in action.

Questions

Choose a template