This is a quick article on what I change the error page for Joomla websites to. I like a clean error page, for a demo visit http://www.joellipman.com/my_error_page.
- Applies to Joomla 1.6.x, 1.7.x, 2.5.x
How?
- Backup the file \templates\system\error.php
- Create a replacement file called error.php including the below code
- Change the message "The Page you are looking for..." to what you want.
- Change the link "www.joellipman.com" to the "www.yoursitename.com".
- [Optional] If you want the image that creates the shadow you can download it here. I put it in the folder \templates\system\images.
copyraw
<?php
/**
* @package Joomla 2.5.x - Clean Error Page
* @copyright Copyright (C) 2013 Joel Lipman .Com. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/
defined('_JEXEC') or die;
if (!isset($this->error)) {
$this->error = JError::raiseWarning(404, JText::_('JERROR_ALERTNOAUTHOR'));
$this->debug = false;
}
//get language and direction
$doc = JFactory::getDocument();
$this->language = $doc->language;
$this->direction = $doc->direction;
?>
<!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->getCode(); ?> - <?php echo $this->title; ?></title>
<style>
.error > span {position:relative;}
.error > span:before {content:"";position:absolute;top:70%;left:-30px;right:-30px;height:80px;background:url(/templates/system/images/error_shadow.png) no-repeat;background-size:100% 100%;}
.error {text-shadow:0 -1px 0 rgba(0,0,0,0.9), 0 1px 0 rgba(255,255,255,0.7);font-size:200px;font-weight:700;position:relative;top:50px;}
h1,h2,h3,h4,h5,h6 {color:#505050;font-weight:400;}
h1 {line-height:36px;font-size:2em;font-weight:700;}
.center {text-align:center;}
body {font:normal 14px/20px Arial, Helvetica, sans-serif;color:#777;}
.title {margin:20px 0 0;}
h2 {font-size:24px;line-height:24px;}
.message {width:400px;margin:20px auto 0;text-align:justify;}
</style>
</head>
<body>
<div class="center">
<h1 class="error">
<span>
<?php echo $this->error->getCode(); ?>
</span>
</h1>
<h2 class="title"><?php echo $this->error->getMessage(); ?></h2>
<p class="message">The Page you are looking for no longer exists or another error occurred. <a href="javascript:history.go(-1)">Go back</a>, or head over to <a href="http://www.joellipman.com/">Joel Lipman .Com</a> to choose a new direction.</p>
</div>
</body>
</html>
- <?php
- /**
- * @package Joomla 2.5.x - Clean Error Page
- * @copyright Copyright (C) 2013 Joel Lipman .Com. All rights reserved.
- * @license GNU General Public License version 2 or later; see LICENSE.txt
- */
- defined('_JEXEC') or die;
- if (!isset($this->error)) {
- $this->error = JError::raiseWarning(404, JText::_('JERROR_ALERTNOAUTHOR'));
- $this->debug = false;
- }
- //get language and direction
- $doc = JFactory::getDocument();
- $this->language = $doc->language;
- $this->direction = $doc->direction;
- ?>
- <!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->getCode(); ?> - <?php echo $this->title; ?></title>
- <style>
- .error > span {position:relative;}
- .error > span:before {content:"";position:absolute;top:70%;left:-30px;right:-30px;height:80px;background:url(/templates/system/images/error_shadow.png) no-repeat;background-size:100% 100%;}
- .error {text-shadow:0 -1px 0 rgba(0,0,0,0.9), 0 1px 0 rgba(255,255,255,0.7);font-size:200px;font-weight:700;position:relative;top:50px;}
- h1,h2,h3,h4,h5,h6 {color:#505050;font-weight:400;}
- h1 {line-height:36px;font-size:2em;font-weight:700;}
- .center {text-align:center;}
- body {font:normal 14px/20px Arial, Helvetica, sans-serif;color:#777;}
- .title {margin:20px 0 0;}
- h2 {font-size:24px;line-height:24px;}
- .message {width:400px;margin:20px auto 0;text-align:justify;}
- </style>
- </head>
- <body>
- <div class="center">
- <h1 class="error">
- <span>
- <?php echo $this->error->getCode(); ?>
- </span>
- </h1>
- <h2 class="title"><?php echo $this->error->getMessage(); ?></h2>
- <p class="message">The Page you are looking for no longer exists or another error occurred. <a href="javascript:history.go(-1)">Go back</a>, or head over to <a href="http://www.joellipman.com/">Joel Lipman .Com</a> to choose a new direction.</p>
- </div>
- </body>
- </html>
Additional
IMPORTANT: After each update of the Joomla CMS, check that this file has not been overwritten as the Joomla update patches often reset this file.
Category: Joomla :: Article: 500
