Custom 404 Error Page for Joomla

The default 404 Error Page for Joomla is not only ugly and uninformative, it blatantly tells users that you are using the Joomla CMS system and provides messages only useful to the developer and confuses the typical end user.

Override the default error page

This default error page is located in the 'templates/system/' folder and is named 'error.php'. And like modules, components and parts of the templating chrome, developers can easily override the default error page simply by copying the 'error.php' file into our active template folder.

Once copied over, you can make whatever changes you like; however I like to provide my clients with the ability to edit and update their 404 page in the same way they would any other article within the Joomla CMS system. Additionally, I also want the 404 Error Page to return a true status of 404 in the response headers.

Here's a simple way to achieve this.

Create a 404 error article

Create a new article named something like "Page not found [error 404] " and add a useful explanation to the user inside the content area, something along the lines of:

This might be because:

* You have typed the web address incorrectly, or
* the page you were looking for may have been moved, updated or deleted.

Please try the following options instead:

* Use the search facility to see if it's available elsewhere
* Use the site navigation to browse the site

The next step is to retrieve this article via the 'error.php' page; doing so ensures that a 404 status is returned. You'll often see examples of forwarding users to a 404 page, but this isnt good practise.

Create a file called 'error.php' inside your active template folder and open it up for editing. There are two methods we can use to retrieve the 404 article content and depending on your server enviroment you may need to use the second method.

Method 1: file_get_contents()

This method uses the PHP function 'file_get_contents()' to call a local file with the given URL. Use the following code example to pull the contents of your 404 article into your new 404 Error Page.

1
2
3
4
5
6
<?php
// no direct access
defined( '_JEXEC' ) or die( 'Restricted access' );

echo file_get_contents(JURI::root().'/index.php?option=com_content&view=article&id=412');
?>

On line 5, change the 'id=412' to correspond with your 404 article ID.

Note: Some server environments (shared hosting for example) have the 'allow_url_fopen' option set to OFF by default. This needs to be set to ON for the 'file_get_contents()' function to work. Some hosts will allow you to change PHP configuration via 'php.ini' files; however, it is set to OFF for a reason so it's best to leave it like this and use method 2.

Method 2: cURL

The following method will work, provided your PHP has cURL enabled, across any domain. cURL is a common PHP module that is typically enabled on most hosting environments.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?php
// no direct access
defined( '_JEXEC' ) or die( 'Restricted access' );

// Use cURL to call the 404 article directly.
$ch = curl_init();
$timeout = 5; // set to zero for no timeout
curl_setopt ($ch, CURLOPT_URL, JURI::root().'/index.php?option=com_content&view=article&id=412');
curl_setopt ($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt ($ch, CURLOPT_CONNECTTIMEOUT, $timeout);
$file_contents = curl_exec($ch);
curl_close($ch);

// display output
echo $file_contents;
?>

On line 8, change the 'id=412' to correspond with your 404 article ID.

Testing your custom 404 Error Page

Once you have followed the above suggestions, you should now be provided with a more useful 404 Error Page by your Joomla site. Test it by entering a URL you know doesn't exist on your site, for example 'www.mydomain.com/404test'.

You should now be presented with your 404 Error Page article. Additionally, if you were to view the response headers of the returned page, the HTTP status should still be 404.

Why is it important to return a 404 instead of a 200?

By returning a status code of 200 for a page that doesn't exist you could be damaging your web sites page ranking.

The status code of 200 would tell, Google for instance, that the requested page exists. Now if every hit to a non-existing page on your site returned a 200, Google may well index some or all of these non-existing pages - and additionally they'd all have the same duplicate content!

By ensuring a 404 status code is returned, such pages will simply not be indexed.