How to Create a Custom 404 Error Page for Your Website

A default "404 Not Found" page is plain, unbranded, and gives a visitor no way to find what they were looking for. A custom 404 page can match your website's design, include a friendly message, and link back to your homepage or main menu, so a broken link doesn't send a visitor away for good.

What You'll Need

You'll need a 404 page (an HTML file with the message and design you want visitors to see) and access to your hosting control panel or File Manager to set it up. Keep the page simple: a short message, a link back to your homepage, and optionally your main navigation menu or a search box.

Setting Up a Custom 404 Page

In cPanel

cPanel includes a built-in tool for this, so you don't need to design and upload a separate file for a basic version:

1. Log in to cPanel and go to the Advanced section, or search for it using the search bar at the top.
2. Click Error Pages.
3. If you have more than one domain on the account, select the correct domain from the dropdown.
4. Choose 404 (Not Found) from the list of status codes.
5. Type or paste your custom message and formatting into the text box provided, then click Save.

If you'd rather use your own fully designed page instead of the built-in editor, upload your file (for example 404.html) to your site's root folder using File Manager, then add this line to your .htaccess file:

ErrorDocument 404 /404.html

In DirectAdmin

DirectAdmin doesn't include a dedicated error-page editor in every setup, so the reliable way to add a custom 404 page is directly through your .htaccess file:

1. Design your custom page and save it as 404.html (or any filename you prefer).
2. Log in to DirectAdmin and open File Manager.
3. Upload 404.html to your website's root folder, usually public_html or your domain's document root.
4. Open or create the .htaccess file in the same folder.
5. Add the following line and save the file: ErrorDocument 404 /404.html

Use a full, absolute path (starting with a forward slash) in the ErrorDocument line, and double-check the filename matches exactly, including capitalization. A small typo here means visitors will see the plain default error page instead of your custom one.

Testing Your Custom Page

Once it's set up, test it by visiting a page on your domain that doesn't exist, for example yourdomain.co.ke/this-page-does-not-exist. You should see your custom page instead of the plain server default. If you still see the default page, clear your browser cache or try a different browser, since 404 pages can sometimes be cached briefly.

You can use the same ErrorDocument approach for other status codes, such as 403 or 500, by adding an extra line for each one, for example ErrorDocument 500 /500.html.

If your site is actually showing errors like 500 or 403 rather than a missing page, see Common Website Errors Explained (404, 500, 403) and How to Fix Them for how to diagnose and fix the underlying cause.