How To Add Custom 404 Page in Joomla

How To Add Custom 404 Page in Joomla

Because you can't fix and avoid all the 404 errors on your Joomla website, it might be smart to keep your visitors into your pages even if they made a typo in an URL. To help you to create a nice 404 error page on your website, I've wrote this fast tutorial.

It might be interesting to display a nice 404 error page to keep longer on your website your lost visitors . In few steps and with a 100% Joomla solution, we gonna redirect our lost visitors to a new page, specificly created and totaly integrated to our template. Lets's go!

#1 Create a new menu item

  • Open your admin panel and navigate to Menu, then Main menu and select the sub-menu Add New Menu Item,
  • Adding new menu item in Joomla
  • Open the tab Link Type and for the parameter Display in Menu, select NO,
    Hidding menu item in Joomla
  • Indicate the name of your menu item (for example: 404 error page),
  • For the parameter Menu Item Type, click on the blue button Select and then, click on Articles and on Single article,
    Create an article in Joomla

#2 Create the new 404 article

  • Click on Create to create your new article,
  • First, indicate a title for your article (for example: 404 error article),
  • Add your content in the text area and fill all the relevant infos you may need for your article (meta description, author, etc.),
    Adding content in an article in Joomla
  • Once you've done, click on the blue button Save & Close in the bottom of the popup,
  • Click on the green button Save on the top left of your page,

Now, Joomla had generated the URL of your article index.php?option=com_content&view=article&id=XX (where XX is the ID of your article). Select and copy it to your clipboard.

Menu item created in Joomla
  • Click on the Save & Close button.

In the list of the menu items, note the ID of your 404 menu item. Copy it.

Menu item ID in Joomla

#3 Edit the template

  • From your admin panel, navigate to Extensions, then Templates and Templates,
    Edit the template in Joomla
  • Click on your template to open it,
  • In the left list, click on error.php to open this file in the editor,
    Edit the error.php file in Joomla
  • Just right after:
    defined('_JEXEC') or die;

    add this code:

    if (($this->error->getCode()) == '404') {
    	header('Location: ' . Jroute::_("index.php?option=com_content&view=article&id=XXItemid=YY", false));
    	exit;
    }

    Check that the XX is the ID of your article and the YY is the ID of your menu item created in the previous step.

    Template editor Joomla
  • Click on the Save & Close button.

Conclusion

Open any page of your website and add any dummy contenu in the URL. Your 404 error page must be displayed now.

For information, a 404 error page is also a good occasion to display something useful, informative, fun or completly offbeat for your visitors.
Here is mine: https://www.web-eau.net/page-404. Don't hesitate to post yours in comments below.

Daniel Dubois

Daniel Dubois

Passionné par le Web depuis 2007, Daniel défend la veuve et l'orphelin du web en créant des sites respectueux du W3C. Fort d'une expérience de plusieurs années, il partage ses connaissances dans un état d'esprit open source.
Très impliqué dans la communauté Joomla depuis 2014, il est actif au sein de plusieurs projets, conférencier et fondateur du JUG Breizh.