Custom 404 Error Page in Joomla!

What is a 404 error?

A web server should send a 404 Not Found response if the resource corresponding to the requested URL does not exist.

What is a 404 error page?

In this case, the server must return the 404 Not Found response, and not redirect users to a page with the 200 OK status. This is very important, because search engines rely on server responses to decide if a page should be indexed. Incorrect responses can lead to indexing non-existent pages, causing duplicates and harming site rankings.

404 Error Page in Joomla! Templates

Professional Joomla templates usually include a functional 404 error page, displayed when entering non-existent addresses.

As a rule, the external interface of these pages differs greatly from the general interface of the template, which can negatively affect behavioral factors: some users may find it confusing and leave the site. To avoid such losses of site visitors out of the blue, we recommend creating a customized page for the 404 error, displayed in the Joomla template interface.

Creating a 404 page in the template interface

Let's look at the steps to correctly create and configure your own 404 error page in the body of the standard Protostar template for Joomla 3 with content displayed in the component area.

1. Create and publish an article, which will be displayed when a non-existent page is requested. Here’s an example setup:
   • Title: "Page not found".
   • Alias: "error-404".
   • Contents: "The specified page does not exist. It has probably been removed or moved to another address."
   • Category: "Uncategorised".
2. Create and publish a hidden menu item for this article with the alias error-404:
   • In the Options tab, you must disable the display of all unnecessary information (Author, Hits, Publish Date, etc.).
   • In the Link Type tab, you need to set the Show in Menu option to No to hide the menu item.
   • In the Page Display tab, you can specify the <title> tag, which will be displayed instead of the title of the article. For example: "Error 404 - page not found."
   • In the Metadata tab, select the value of the Robots meta tag noindex, nofollow.
3. In the template folder (/templates/template), create or replace the existing error.php file, which should contain only the following code:
   

   <?php
   defined( '_JEXEC' ) or die( 'Restricted access' );
   if($this->error->getCode() == '404'){
       header("HTTP/1.1 404 Not Found");
       echo file_get_contents(JURI::root().'error-404');
       exit;
   }

4. We check the functionality of the page. When a non-existent document is requested, the created article should be displayed.
5. Check the server response for a non-existent page. To do this, you can use the developer panel in the browser or a third-party web service.
6. To make the 404 error page more visual, we recommend adding a corresponding image to its content, which can be easily found in image search results, and also disabling unnecessary modules on it.

Custom 404 Error Page plugin

The method described above works, but it has one significant drawback: when updating the Joomla template, the error.php file code will also be updated to the default state, so you will have to manually change its code again. While this process is simple, it can be easy to overlook during updates, potentially reverting the custom 404 page to the template default. The Custom 404 Error Page plugin allows you to make sure that the custom error page does not change when updating the template. To do this, you need to:

• purchase, download, and install the plugin Custom 404 Error Page;
• create the article with the required content that will be displayed on the 404 page;
• create a menu item for this article;
• go to the Custom 404 Error Page plugin settings and select the menu item that will be used as the error page.