How to create custom 404 Error Page in WordPress

How to create custom 404 Error Page in WordPress

If you found error i.e. Page not found on any site, it means that is 404 error which is originated by HTML protocol. It means that this page doesn't exist on site where you are trying to visit. Sometimes, we users trying to visit any relative url on your wordpress site which doesn't exists. So, it redirects to error 404 page. Most of the times this error obligate users for leaving the site which reflects your business growth. In this case, showing error 404 page with custom useful message will be a great idea.

Here, we are going to explain you that how can you create a custom layout for 404 page in WP with a custom useful message. For building a cusom layout of error 404 page, please follow steps metioned below :

Step 1) Content Page : 404.php

In WP, most of the themes have 404 error file i.e. 404.php. If you don’t have this file in active theme of WordPress, create new PHP file with name 404.php and add it into your directory of active theme i.e. wp-content/themes/current_theme. Here is our code for content file which you can add or replace inside your existing 404.php file.

Page Not Found!

Sorry There is something which is missing!

Due to some technical reasons, requested page could not be found here.

Step 2) Header Page : header-404.php

In first step, we have update 404 page content with custom layout with effective message. In this step, if you also want to change layout of your site header for 404 page, clone file i.e. header.php with name i.e. header-404.php at same path of theme folder i.e. wp-content/themes/current_theme.

After creating seperate header file for 404 page, update the following code in 404.php.


Step 3) Footer Page : footer-404.php

Similar Step 2, if you want to create a seperate footer layout for error 404 page. Follow same step 2 but with different file name i.e. footer-404.php and update the following code in 404.php.


After completion of above steps, just check any random url path which doesn't exist to your website. You’ll get new custom 404 page layout.