How to Create a Custom 404 Page in WordPress?

There are different types of HTTP errors shown while browsing and 404 Page Not Found is one of the frequent errors that almost every user encounter. It relates to an issue indicating that the page you are trying to open is missing and cannot be found. In WordPress, the theme uses a template to show 404 page to visitor. However, traditionally designed 404 pages do not show sufficient information and affect user’s experience. In this article, we will explain how to create custom 404 page in WordPress and offer all the necessary details to your visitors.

Related: How to setup custom 404 page in free Weebly site?

404 Page Not Found Error

404 is a HTTP status code a web server returns when one of the following situations happen:

• The page you are trying to visit has been moved to another permalink.
• The site owner permanently deleted the page.
• You might have mistyped the URL or the page never existed.

You may also see the error due to a momentary glitch that can be resolved by refreshing the page in your browser. Still, at the same time, it could be something more complex, like the page may be temporarily unavailable or no longer existing.

Default Behavior of 404 Page in WordPress

WordPress application package does not contain any 404 page by default. Therefore, the appearance of your 404 page completely depends on the theme you use and each theme comes with its own 404 page. You can browse through the theme files from “Appearance > Theme Editor” menu in your admin dashboard and find 404.php file.

This 404.php file is the source for showing relevant information in your 404 error page.

Need of Custom 404 Page in WordPress

As a site owner, you have different ways to fix the 404 error. However, it is not possible to eliminate the error completely due to various internal external factors. For example, a comment author link on one of your pages may result in 404 error which you can’t monitor frequently. For internal links, you may think the simplest solution is to redirect users to your homepage. Well, that would be a classic case of lousy user experience. The user will be confused how they landed up on homepage when they wanted to visit an entirely different page.

Unfortunately, most themes use simple 404 page and don’t provide sufficient information to guide users. Below is the 404 page for the default twenty-twenty-one theme simply saying, “Nothing here” and offers a search box for users to search the entire site.

You can modify the 404.php file in your theme to add additional elements and show in 404 error page. However, this needs PHP knowledge and you need a child theme to edit the file so that theme update will not wipe out your changes. Most free and commercial themes also don’t offer a way to customize 404 page in the frontend.

This lack of information in 404 page leaves the visitor confused and force them to leave your website. And that’s where the custom 404 page comes into play. The 404 page clearly explains to the user that the page they are looking for is no more available and provide alternate options to navigate from there.

Create Custom 404 Page in WordPress

By following this guide, we will help you create your own custom 404 page in WordPress website by using the most popular 404page plugin. The 404page plugin is free and helpful to create user-friendly custom 404 error pages.

Install and activate the 404page plugin

• Open your WordPress admin dashboard and go to “Plugins > Add New” section.
• Search for the 404page plugin to install it.

• Activate the plugin after installing by clicking on the “Activate” button.

Setup Your Custom 404 Page

The great thing about this plugin is that it will let you set your 404 page like any other page using the basic WordPress page editor. Later, you can assign this page to be your default 404 page for the site.

• So, to get started with the page setup, go to “Pages > Add New”.
• Give a title to your page. Something along the lines of “404 page”, “page not found”, or “page doesn’t exist” would work well here. For the sake of simplicity, we’ll use “404 page” as the page title for demonstration purposes, but feel free to name the page whatever you think works best.

• You can use any Gutenberg blocks to insert required content. Add helpful content and important links to your website in the paragraph block. Pages such as your homepage, about page, blog page can be listed and linked here. This will help anyone who lands on this page find a way out and navigate to more relevant pages of the website.
• Next, you can also add a featured image via the page block editor to add a banner to your 404 page. This is an optional step and is only necessary if you want to improve the page’s overall aesthetics and presentation element.

• Once you feel that the page contains all the information you want to include, it is time to publish it.

While this tutorial focuses on the basics of using the page editor to create a 404 page, you can use advanced page builder plugins to design the 404 page as per your specific design and branding preferences.

Assigning Your Custom 404 Page

Well, now that your 404 page is setup, populated with content, and published, all we need to do is assign it as your default 404 page. When visitors enter a non-existent URL on your website, they will land on this page. To select this new page, we just built as our default 404 page, follow the steps provided below:

• Go to “Appearance > 404 Error Page” in your WordPress admin dashboard. This new menu item is now available on your dashboard because of the 404page plugin.
• Select the custom 404 page from the dropdown as your page to be displayed as the 404 page for your website, as shown in the image below.

• Click on “Save Changes” button.

Other Plugin Settings

If you click on the “Advanced” tab of the 404page plugin, you’ll find a few custom options that will allow you to make the following modifications.

• You can hide the custom 404 page from the standard pages list. This will help to remove the page from listing on archive and other sitemap. However, the 404 page will remain visible to all admin users though even if this setting is turned on.
• Show an error when someone tries to access the custom 404 page directly with its URL. Enable this and previous options so that custom 404 page is not indexed in search engines.  
• Instead of sending 404 status code, you can send a HTTP 410 status code for any pages or resources that have been deleted or are currently in your WordPress trash folder.
• Try to use compatibility mode when you have problems in using 404page plugin with your theme.

Final Words

And there you have it! By following our tutorial and using the super convenient and straightforward 404page plugin, you can quickly and effortlessly create a custom 404 page in WordPress websites in a matter of minutes. And better yet, you don’t need to hire a developer to do this, as you can do it all yourself. Though you can setup custom 404 page, we still recommend finding broken internal links using plugins like Redirection and setup proper 301 redirects to retain the search engine ranking of the unavailable page.