How to create a custom 404 error page

Posted by: admin in TutorialJoomla 1.5Error 404 on  

Creating a custom 404 page for your Joomla site can be very interesting. For some sites, there can be quit some users who get to the error 404 page.  If a user lands on your default error page, there is a good change he will leave your site. If you have an error page that has the same layout as your actual site, there is a good chance he will stay. So let's make a custom error page.

1. Copy the default page

The default error page in Joomla 1.5 is /templates/system/error.php. Just make a copy of this file to the root directory of your template (= /templates/yourtemplate/). Now you can change this file any way you like, so if you know php you can start changing it. The problem is that it won't be so easy to include modules like your menu, your search module or  other modules. There is a way to do this, but it's a real pain. So let's try a different approach.

2. Create an error 404 article

Create a new article for your error page. Choose your section and category wisely, so that it doesn't show up as a normal article on your site. As content, you can chose whatever you would like to see on your error page.  In my case, I just copied the text from the default Joomla error page and made a small modification to it. Save the article and make sure it's published.

3. Get the link to this article

In the Article Manager, you will see your new article in the list. In the last column, you will find the ID of your article. You need this for the link to your article. Just replace the domain and the ID in this link:

http://www.ultijoomla.com/index.php?option=com_content&view=article&id=136

If SEF is enabled, you can take the SEF url in stead of this one.

4. Include the content of this article in your error page

Now you will have to include the content of your article in the error page you've copied. Below I've put the contents of the default error page and I've added in red text, the lines you have to add. Of course you need to replace the link, with the one you've created. Don't forget the part at the bottom! After you have done this, you will have your custom error 404 page.

 

<?php
/**
* @copyright   Copyright (C) 2005 - 2008 Open Source Matters. All rights reserved.
* @license             GNU/GPL, see LICENSE.php
* Joomla! is free software. This version may have been modified pursuant
* to the GNU General Public License, and as distributed it includes or
* is derivative of works licensed under the GNU General Public License or
* other free or open source software licenses.
* See COPYRIGHT.php for copyright notices and details.
*/

// no direct access
defined( '_JEXEC' ) or die( 'Restricted access' );

if (($this->error->code) == '404') {
echo file_get_contents('#topofpage');
}
else
{
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" dir="<?php
echo $this->direction; ?>">
<head>
<title><?php echo $this->error->code ?> - <?php echo $this->title; ?></title>
<link rel="stylesheet" href="/</index_php_echo_$this-__gt;baseurl;_?__gt;/templates/system/css/error.css_.css" type="text/css" />
</head>
<body>
<div align="center">
<div id="outline">
<div id="errorboxoutline">
<div id="errorboxheader"><?php echo $this->error->code ?> - <?php echo $this->error->message ?></div>
<div id="errorboxbody">
<p><strong><?php echo JText::_('You may not be able to visit this page because of:'); ?></strong></p>
<ol>
<li><?php echo JText::_('An out-of-date bookmark/favourite'); ?></li>
<li><?php echo JText::_('A search engine that has an out-of-date listing for this site'); ?></li>
<li><?php echo JText::_('A mis-typed address'); ?></li>
<li><?php echo JText::_('You have no access to this page'); ?></li>
<li><?php echo JText::_('The requested resource was not found'); ?></li>
<li><?php echo JText::_('An error has occurred while processing your request.'); ?></li>
</ol>
<p><strong><?php echo JText::_('Please try one of the following pages:'); ?></strong></p>
<p>
<ul>
<li><a href="#topofpage" title="<?php echo JText::_('Go to the home page'); ?>"><?php echo JText::_('Home Page'); ?></a></li>
</ul>
</p>
<p><?php echo JText::_('If difficulties persist, please contact the system administrator of this site.'); ?></p>
<div id="techinfo">
<p><?php echo $this->error->message; ?></p>
<p>
<?php if($this->debug) :
echo $this->renderBacktrace();
endif; ?>
</p>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
<?php
}
?>


 

Trackback(0)
Comments (32)Add Comment
Works like a charm !

written by Effezien, December 11, 2008
It is really easy to get this working and you are flexible aswell ! Thanks for this tip .. smilies/grin.gif
Thanks for this

written by Justin, December 19, 2008
Hey thanks for this. Worked perfectly except you missed off the
issue with this tip

written by Robert, December 22, 2008
Well I tried this tip and got the following error:

Parse error: syntax error, unexpected '}' in /home/keepscre/public_html/globalteamdirect.net/templates/js_optimus_free/error.php on line 48

HELP!
issue with this tip

written by Largo, December 23, 2008
Robert,

Probably you didn't copy the complete red part of the code. Could you verify this? If you don't find it, just register on the forum here and post the complete code of your error.php there. Then I can easily see what's wrong.
relative url

written by Lehtóri, December 30, 2008
if you want a relative url use this code

echo file_get_contents(JURI::base() . '#topofpage');

so if you move the site to a different location it still works
correction

written by Lehtóri, December 30, 2008
there is a small error in the code above
its why Robert is getting the error
its between this code:

...
defined( '_JEXEC' ) or die( 'Restricted access' );
?>
if (($this->error->code) == '404')
...

either you remove the '?>' or open php again by setting ''

hope its clear smilies/cheesy.gif
...

written by Lehtóri, December 30, 2008
edit:
or open php again by setting '
edit

written by Lehtóri, December 30, 2008
edit:
or open php again by setting '< ? p h p'
without the spaces, its why its not showing in my previous posts smilies/tongue.gif
Thanks

written by Largowww, January 02, 2009
you're right, there was a typo in my code. It's updated now.
Does not work

written by andrea, January 08, 2009
Sorry but it does not work. Tried but where there's an error a completely blank page appear...
Error message

written by andrea, January 08, 2009
this is the error

PHP Warning: file_get_contents(http://www.xxx.xx/site/index.php?option=com_content&view=article&id=239) [function.file-get-contents]: failed to open stream: Connection timed out in /home/xxxxx/public_html/site/templates/xxxxxx/error.php on line 16
...

written by Largowww, January 09, 2009
Line 16 is this line:
echo file_get_contents('#topofpage');

Did you change this to match your own error page? The url and the id have to change. To check if it works, you can copy the complete url in your browser address bar and you should see your error page.
I can't get the custom 404 page to work.

written by roma, February 12, 2009
Okay, I tried to follow this tutorial (great by the way) but I might be missing something for I get the following error after I implement the changes:
Parse error: syntax error, unexpected '?' in /homepages/25/d204605642/htdocs/templates/foreverace/error.php on line 68

Your assistance would be very much appreciated and I thank you in advance!

My error.php is as follow:





" lang="" dir="">

-
/templates/system/css/error.css" type="text/css" />





-













/index.php" title="">















...

written by roma, February 12, 2009
Sorry for the above missing information. I tried to follow this tutorial (great by the way) but I might be missing something for I get the following error after I implement the changes:

Parse error: syntax error, unexpected '?' in /homepages/25/d204605642/htdocs/templates/foreverace/error.php on line 68


My error.php is as follow:





" lang="" dir="">

-
/templates/system/css/error.css" type="text/css" />





-













/index.php" title="">















custom 404 error page

written by roma, February 12, 2009
Sorry! I just can't add the error.php information. Any reason why? thank you!
JomComment problem

written by Largo, February 13, 2009
It seems there is a problem with JomComment if you try to add code, as it tries to convert it to html code. Could you register on the forum and ask your question there?
THX

written by JanMazurek, February 24, 2009
That was very helpfull.
Thank you very much.
didn't work for me

written by Michael Labadie, March 07, 2009
smilies/sad.gif

I managed to follow this exceptionally clear, step-by-step process without a hitch. It didn't work. I am getting 403 messages now instead.


url

written by Largowww, March 07, 2009
Strange, error 403 is the forbidden error. Could you give me the url of your site?
...

written by Heidi, May 06, 2009
I followed the steps but no matter what I do, I get the following error:

Parse error: syntax error, unexpected T_VARIABLE in /home/xzu81ltm/public_html/templates/shopper_frenzy/error.php
...

written by Largowww, May 06, 2009
Then you didn't follow the steps exactly smilies/wink.gifDid you try to copy past the complete error page of the article?
Did not work

written by Henrik, July 28, 2009
This fix does not do it for my page, I have JoomComment installed, maybe that is whats causing the problem, its seems like its just reading the code as HTML. Anyone know of any other fix?
...

written by Largowww, July 29, 2009
JoomComment can not be the cause of your problem. If it's reading the code like html, then probably you have forgetten a < ? php (without the spaces)
My Custom 404 error page

written by Erwin Schro, November 08, 2009
Hi thanks for the tips. Take a look at my custom 404 error page for working example.

Have fun
...

written by Graciela, February 14, 2010
Thanks for this simple solution. I'd tried lot of other approach, and no one works, but this is really clean and easy. smilies/cheesy.gif
Blank page

written by Sarah, February 25, 2010
Hi - thanks this is really easy to follow and it worked fine with the link to your custom 404 page however when I replaced the domain with my own it does not work, I just get a blank page.

The article is definitely published and when pasted in to the address bar it shows up fine.

http://www.newtonmore.com/index.php?option=com_content&view=article&id=149
...

written by Largo, March 01, 2010
@sarah: it seems you fixed the problem as it works fine as far as I can see. Nice site btw.
You saved my day !

written by finc, April 18, 2010
I copied it and paste it, changed the get content into what I wanted, by using the full address with "http://www.domain.com/index.php...."

this way "index.php...." it does not work

Thank You very much!
Thank you

written by liz, July 30, 2010
All I did was copy those two bits in red just like you said. Worked perfectly. You are a champion. Been trying to do this for weeks but no single article out there explained ho to do it clearly and simply.
A bit of struggling but finally it's working. Brilliant solution!

written by Sharon, August 04, 2010
I had missed the php code at the very bottom. There are TWO areas of red code to add not just the one at the top with the URL.

Also, I had to add a menu module (disabled) for this article so it would show up. Just using the SEF didn't work.

Here's how it looks: www.smallbusinesswebsitesonly.com/site

"Site" is not a real page which is why the error page pops up.

Very cool! Thanks so much for sharing.
Not working?

written by Michelle, February 16, 2011
Hey, I just can't seem to get this to work?

I have copied both the top & bottom red code & changed the link but I still get the default 404 error. I even tried copying all your code exactly & changing the link & still no luck. Can anyone help please?
Customize joomla 404 page

written by Contact , January 31, 2013
Thanks for helpful advice you can also see my side Url.

Customize joomla 404 page

Write comment

security code
Write the displayed characters


busy