Create Custom 404 Error Page in PHP and Apache Using .htaccess

What is 404 or Page not Found Error?
Why is Custom 404 Error Page Needed?
Let's Start - Create Custom 404 Error Page
Put the Custom 404 Error Page into ROOT Directory of Your Website
Create/Modify the .htaccess File
Testing the 404 Error Document
Does Custom 404 Error Page Return 200 OK or 302 response?

What is 404 or Page not Found Error?

Before creating a custom 404 page not found error page we should understand what is 404 page not found error code? The 404 code is a standard HTTP response code that tells the client browser that the server is communicable but could not find the requested resource. When the requested resource is not found on the server then server sends a 404 code in response of the client's request. This is also called page not found error. A 404 response simply means the server has not found anything matching the Request-URI. It does not indicate if the requested resource is unavailable temporarily or permanently. This status code is commonly used when the server does not wish to reveal exactly why the request has been refused, or when no other response is applicable.

Why is Custom 404 Error Page Needed?

User is shown a 404 error page when he/she tries to access a non-existent page on a site that has either been moved or deleted or user has mistyped a URL. A 404 error page is just an information for the user that the page requested by him/her is not available. This is site owner's responsibility to return a meaningful and well formatted 404 error page so that surfer gets useful information when the requested page is not available.

Let's Start - Create Custom 404 Error Page

To create a PHP version of custom 404 error page open any text editor of your choice and insert the following code and save it as 404page.php or any other name of your choice but the extension must be .php because here 404 error page is being demonstrated with PHP technology.

<?php
  header("HTTP/1.0 404 Not Found");
?>
<html>
  <head>
    <title>404 Error - Page Not Found</title>
  </head>
  <body>404 Error - Page Not Found!</body>
</html>

Following things you must remember while creating a 404 error page.

You must specify the 404 HTTP response header in your custom 404 error page else it would be treated as a normal page and 200 OK response will be sent to client browser.
The header() must be called before any actual output is sent, either by normal HTML tags, blank lines in a file, or from PHP. In above sample error page the header that starts with the string "HTTP/" (case is not significant) will be used to figure out the HTTP status code to send. Here we have configured Apache to use a PHP script to handle requests for missing files (using the ErrorDocument directive - will be explained shortly), we make sure that our script generates the proper status code.

The above page is just for demonstration, you can beautify your custom 404 error page as you like and add more relevant content depending upon how much information you want to convey to your audience.

Put the Custom 404 Error Page into ROOT Directory of Your Website

After having created a custom 404 error page you have to put this page into home or ROOT directory of your website. To do that connect to your website by ftp client or some file manager tool and upload the error page there.

Create/Modify the .htaccess File

Those who are beginners the .htaccess file is a file found in Apache servers that allows you to manipulate the behaviour of the server. A very common use of .htaccess is to create custom error messages for server errors. This article configures error page on Apache web server. If your web host is not running on Apache then this solution may not work for you; and in that situation you will have to find out from your web host what you need to do to enable the server to serve your customized file when a web page is not found.

If your website running Apache web server, the first thing you need to do is to add the following line to a file named .htaccess (note the preceding period). In most instances, no such file will exist, and you can simply create one with a text editor (such as Notepad on Windows). Incidentally, if you are using Notepad on Windows, you will need to enter ".htaccess" (including the opening and closing quotation marks) into the "Save As" dialog box when you create the file, otherwise Notepad will append a ".txt" extension behind your back when it creates the file. And unless you configured Windows to show you the full filename, you won't even realise that it has done so.

ErrorDocument 404 /404page.php

Now, upload your .htaccess to the root directory of your website. By doing above steps you are done with 404 error page and this is the time to test the error page.

Testing the 404 Error Document

Test your 404 error page by typing a URL that you know does not exist. Your error page should load up. Remember the domain name must be correct followed by a wrong page name. If domain name is not correct the request won't reach to your website.

For the custom 404 error page you must check if that returns a correct 404 response. If your page still returns 200 OK or 302 response code then something wrong there and your page won't serve the purpose it was designed for. Chrome's inspect element and Firefox's firebug extension may help you in checking response headers for your error page.

Does Custom 404 Error Page Return 200 OK or 302 response?

For custom 404 error page, the path given in .htaccess must be relative to ROOT directory else your page will return a 200 OK response, which will of course won't serve the desired purpose. This fact applies to almost all servers including both Apache and IIS. For example, see the following entries and accommodate the correct one in your .htaccess file. The second one having absolute URL for error document will return 200 OK response.

ErrorDocument 404 /404page.php        #Correct implementation of error page

ErrorDocument 404 http://cs-fundamentals.com/404page.php     #WRONG! Results in 200 OK

Last Word

Hope you have enjoyed reading this tutorial on creating custom 404 page not found error page. Please do write us if you have any suggestion/comment or come across any error on this page. Thanks for reading!

Share this page on WhatsApp