Die Original-Fehlerseite liegt hier: /templates/system/error.php
Will man eine eigene Fehlerseite machen, legt man sich eine eigene error.php in seinem verwendeten Template-Verzeichnis an: /templates/MeinTemplate/error.php
Joomla greift zunächst stets auf die Dateien im eigenen Template-Verzeichnis zu. Die Systemdatei wird also quasi überschrieben mit der eigenen Datei.
Möglichkeit 1
Diese eigene error.php kann nach Belieben selbst gestaltet werden. Allerdings wird nur HTML-Code (und PHP-Code natürlich) erkannt. Modulpositionen hingegen werden nicht erkannt und ergo nicht dargestellt.
Möglichkeit 2
Man kann aber auch einen Beitrag anlegen mit dem Fehlertext und diesen direkt aufrufen bei einem Fehler und bleibt damit im Template des Webauftritts. Oder man kann natürlich auch ein neues Template wie gewohnt erstellen und das explizit diesem Beitrag zuweisen. Der Vorteil ist, dass man stets ein Template hat, dass alles bietet und kann, was für andere Beiträge auch gilt.
Der Beitrag, der erstellt wurde, muss nun noch einem Menü zugeordnet werden. Damit niemand die Fehlerseite per Menülink aufrufen kann, gibt es die Möglichkeit eines Schattenmenüs. Also eines Menüs, dass öffentlich arbeitet, aber niemand sieht.
Dazu legen wir zunächst ein neues Menü an:
Diesem Schattenmenü, dass ich in meinem Beispiel auch so genannt habe, weise ich jetzt meinen Beitrag zu. Also alles so, wie wir es immer machen. Allerdings positioniere ich kein Menümodul in meinem Template, das dass Schattenemnü beinhaltet. Ich ignoriere die Module komplett. Dadurch wird das Menü nirgends angezeigt, dennoch verweist es auf einen öffentlich zugänglichen Beitrag und ich kann dadurch diesen Beitrag ansprechen, in dem ich ihn explizit aufrufe in meiner error.php:
<?php defined( '_JEXEC' ) or die;
// variables
$app = JFactory::getApplication();
$doc = JFactory::getDocument();
$tpath = $this->baseurl.'/templates/'.$this->template;
?><!doctype html>
<!--[if IEMobile]><html class="iemobile" lang="<?php echo $this->language; ?>"> <![endif]-->
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="<?php echo $this->language; ?>"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="<?php echo $this->language; ?>"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="<?php echo $this->language; ?>"> <!--<![endif]-->
<head>
<title><?php echo $this->error->getCode(); ?> - <?php echo $this->title; ?></title>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" /> <!-- mobile viewport optimized -->
<link rel="stylesheet" href="/<?php echo $tpath; ?>/css/error.css?v=1">
<link rel="apple-touch-icon-precomposed" href="/<?php echo $tpath; ?>/images/apple-touch-icon-57x57-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="/<?php echo $tpath; ?>/images/apple-touch-icon-72x72-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="/<?php echo $tpath; ?>/images/apple-touch-icon-114x114-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="/<?php echo $tpath; ?>/images/apple-touch-icon-144x144-precomposed.png">
<link rel="shortcut icon" href="/android-icon.png" sizes="196x196">
<meta name="msapplication-square70x70logo" content="images/smalltile.png" />
<meta name="msapplication-square150x150logo" content="images/mediumtile.png" />
<meta name="msapplication-wide310x150logo" content="images/widetile.png" />
<meta name="msapplication-square310x310logo" content="images/largetile.png" /></head>
<body>
<?php
if (($this->error->getCode())==403) {
header('Location: ' . JRoute::_("https://www.IhreDOMAIN.de/403.html", false));
exit;
} elseif (($this->error->getCode()) == '404') {
header('Location: ' . JRoute::_("https://www.IhreDOMAIN.de/404.html", false));
exit;
} else {
header('Location: ' . JRoute::_("https://www.IhreDOMAIN.de/fehler.html", false));
exit;
}
?>
</body>
</html>
Der Code sorgt zunächst dafür, dass die Site auch auf mobilen Endgeräten funktioniert, also responsive ist.
rel="apple-touch-icon-precomposed"
: Auf vielen Browsern in mobilen Endgeräten, kann man Favoriten anlegen. Bei diesen Favoriten werden meist auch Grafiken - so eine Art Favicons - angezeigt. Definiert werden sie in diesen Zeilen. Wenn keine entsprechenden Grafiken hinterlegt sind, werden diese Zeilen einfach vom Browser ignoriert. Sie können auch gelöscht werden, wenn man keine passenden Grafiken hat oder das nicht möchte. Dann wird vom Browser ein Screenshot von der Website als Icon angelegt.
Bis vor kurzem war es so, dass diese Icons auch von Android oder Windows benutzt wurden (und wohl auch noch benutzt werden). Allerdings haben diese jetzt auch ihren eigenen Aufruf:
<link rel="shortcut icon" href="/android-icon.png" sizes="196x196">
<meta name="msapplication-square70x70logo" content="images/smalltile.png" /> <meta name="msapplication-square150x150logo" content="images/mediumtile.png" /> <meta name="msapplication-wide310x150logo" content="images/widetile.png" /> <meta name="msapplication-square310x310logo" content="images/largetile.png" />
Es können weitere Größen angegeben oder auch weggelassen werden. Es sind letztlich nur Beispiele in diesem Tutorial, damit sichtbar ist, was möglich ist.
Weitere Informationen, auch mit Beispielen, gibt es hier: Nina Boecher Blog
Danach wird die Fehlernummer abgefragt und der zugehörige Beitrag wird dann angezeigt. Und mit dem Beitragsaufruf wird praktischerweise auch das zugeordnete Template geladen.
Wobei "404" der Alias-Name des Menüverweises darstellt und bei eingeschalteten SEO dann das "html" angehängt wird. Wer nicht mit SEO arbeitet oder eine anderen URL-Aufbau hat, muss natürlich dann den Alias und die URL entsprechend in diese Datei eintragen. Wichtig ist, dass die gesamte URL angegeben wird, da sonst in "Unterverzeichnissen" die Datei nicht gefunden wird.
Damit ich auch andere Fehler abfangen kann und nicht nur die "Seite nicht gefunden"-Fehler, habe ich im obigen Code noch eine zweite Fehler-Seite angegeben, die einen allgemeinen Text enthält und immer dann aufgerufen wird, wenn die Fehlernummer außerhalb 400 bis 500 liegt. Voraussetzung ist allerdings, dass der Fehler nicht so gravierend ist, dass überhaupt nicht mehr Joomla geladen wird. Wenn das passiert generiert der Webserver seine eigenen Fehlermeldungen.
Ich selber benutze die zweite Möglichkeit. Wer sich das mal anschauen möchte - hier wird eine Seite aufgerufen, die es nicht gibt:
Fehlernummern (Statuscode) und ihre Bedeutung