Verwendung von Favicons
Favicons sind kleine Symbole (ähnlich eines kleinen Logos), die der Wiedererkennbarkeit einer Website dienen. Sie werden neben dem Seitentitel im Browser-Tab oder im Lesezeichen angezeigt. Insbesondere wenn ein User mehrere Tabs geöffnet hat, helfen Favicons bei der Orientierung.
In Joomla 4 werden 3 verschiedene Favicons verwendet:
- joomla-favicon.svg
- favicon.ico
- joomla-favicon-pinned.svg
Während ältere Browser nur das favicon.ico verwenden, nutzen moderne Browser das Dateiformat "svg".
Die Favicons von Joomla 4 liegen in folgendem Verzeichnis:
/media/system/images/...
Sie werden in der index.php vom Template (Cassiopeia) angegeben:
$this->addHeadLink(HTMLHelper::_('image', 'joomla-favicon.svg', '', [], true, 1), 'icon', 'rel', ['type' => 'image/svg+xml']);
$this->addHeadLink(HTMLHelper::_('image', 'favicon.ico', '', [], true, 1), 'alternate icon', 'rel', ['type' => 'image/vnd.microsoft.icon']);
$this->addHeadLink(HTMLHelper::_('image', 'joomla-favicon-pinned.svg', '', [], true, 1), 'mask-icon', 'rel', ['color' => '#000']);
Im HTML-Quellcode der Webseite schaut das dann folgendermaßen aus:
<link href="/media/system/images/joomla-favicon.svg" rel="icon" type="image/svg+xml">
<link href="/media/system/images/favicon.ico" rel="alternate icon" type="image/vnd.microsoft.icon">
<link href="/media/system/images/joomla-favicon-pinned.svg" rel="mask-icon" color="#000">
Wichtig: Die Reihenfolge ist zu beachten!
Joomla überprüft zunächst, ob es die Datei "joomla-favicon.svg" gibt und verwendet diese. Existiert diese nicht, wird die Datei "favicon.ico" gesucht und verwendet. Moderne Browser verwenden in aller Regel die svg-Datei. Ältere Browser können nur das favicon.ico nutzen.
Eigene Favicons verwenden
Möchte man seine eigenen Favicons verwenden, so kopiert man diese in folgendes Verzeichnis vom Cassiopeia-Template:
templates\cassiopeia\images...
(analog gilt das auch für andere Joomla4-Templates)
Wichtiger Hinweis:
Joomla überprüft zuerst, ob es eigene Favicons gibt. Hat man aber lediglich ein favicon.ico und nutzt einen modernen Browser, dann verwendet Joomla sein eigenes joomla-favicon.svg, da Joomla auch immer die Reihenfolge einhält. Deshalb sollte man mindestens eine joomla-favicon.svg und eine favicon.ico zur Verfügung stellen, um sowohl moderne als auch ältere Browser zu unterstützen!