How to create a custom 404 error page in WordPress

You hope your visitors click links to existing pages and no one ever reaches that dreaded 404 page, but what if they do? What do they find? Is it just a plain, “Sorry, no posts found” message? Let’s create a custom 404 error page and make it a little more helpful to those lost on their travels through your website.

Create a custom 404 error page template

Create a child theme if you haven’t done so already. In your child theme’s folder, create a 404.php file. WordPress will automatically use this template if a Page Not Found error happens.

Open the file to edit it, and insert the header and footer:

<?php
/**
* The template for displaying 404 pages (Not Found)
*/get_header(); ?>

<!-- content goes here -->

<?php get_footer(); ?>

You might want to copy some html that wraps the content from index.php or other page template files, to make sure the content on the 404 page shows up neatly styled like the rest of your site.

Write a message to let people know the page wasn’t found:

<?php
/**
* The template for displaying 404 pages (Not Found)
*/get_header(); ?>

<p>Sorry, this page doesn't exist.</p>

<?php get_footer(); ?>

Adding things to make it more helpful

Now, to make it a little more helpful, you could add a link to your homepage:

<p>Sorry, this page doesn't exist. Click the back button to try again or go to the <a href="<?php get_bloginfo('url'); ?>">homepage</a> to start over.</p>

Add a search box:

<?php get_search_form(); ?>

Or list all or some pages:

<ul>
<?php wp_list_pages(); ?>
</ul>

By default, this will list all of your pages, but you might want to keep some of them hidden here, which can be done like this:

<ul>
    <?php
         wp_list_pages( array(
               'title_li' => 'You might have been looking for:', // this will be the title above the list.
               'exclude' => '1, 2, 3'; // comma-seperated list of page IDs to exclude from the list.
          ) );
     ?>
</ul>

If you remove the title_li line entirely, it defaults to a heading “Pages”, if you want no title you need to make it empty: ‘title_li’ => ”

You can find the page ID of a page by hovering over the page link in your WordPress dashboard, and looking at the link, or clicking it and looking at the URL in the address bar of your browser. It says something like:

yourdomain.com/wp-admin/post.php?post=2&action=edit

The page ID is the number that is behind the ?post= (in this example, 2).

Don’t want to do this yourself, or perhaps want more, like setting it up to automatically e-mail you when someone clicks a link that lead them to the 404 error page (so you can fix it)? Let me take care of that for you.