Favicon in Joomla einfügen

In diesem Artikel beschreibe ich, wie ein Favicon in Joomla eingefügt werden kann.

Doch zunächst: Was ist ein Favicon, wofür ist es gut, und brauch man es überhaupt?

Nein, ein Favicon ist nicht zwingend notwendig. Es trägt jedoch ungemein zum Wiedererkennungswert einer Webseite bei. Daher finde ich es sehr sinnvoll ein solches einzusetzen.

Ein Favicon ist das Symbol, das oben in der Adresszeile des Browsers (Internet Explorer, Firefox, Chrome, Safari) angezeigt wird. Dasselbe Symbol wird aber auch angezeigt wenn die Seite zu den Favoriten (auch Lesezeichen genannt) hinzugefügt wird. So ist die Seite in der Übersicht der Favoriten klar von den anderen Favoriten abgegrenzt und durch ein eindeutiges Symbol schnell auffindbar.

Favicon its-webtime Blog

Wie muss ein Favicon aussehen?

Die Voraussetzungen für ein solches Favoriten-Symbol sind relativ einfach:

  • Die Größe muss 16×16 oder 32×32 Pixel sein.
  • Die Dateiendung muss .ico sein und das Format muss dazu passen.

Es gibt viele Favicon Generatoren, die nach dem Upload eines Bildes eine entsprechende Datei generieren. Dies wären ein paar Beispiele dafür:

Im Grunde lässt sich dies aber auch selbst erstellen, ganz einfach mit Paint. Besser geht es jedoch dem kostenlosen Bildbearbeitungsprogramm Gimp, da es bei PNG-Dateien auch mit durchsichtigem Hintergrund zurecht kommt. Paint zeigt den Hintergrund hingegen immer weiß an.

Favicon mit Gimp selbst erstellen

Um ein Favicon mit Gimp selbst zu erstellen, wird zunächst ein beliebiges Bild mit dem Programm geöffnet. Anschließend muss die Größe angepasst werden. Dazu gibt es die Skalieren-Funktion.

Gimp Bild Skalieren

Die Größe muss entweder auf 16×16 oder 32×32 Pixel geändert werden. Ist das Ausgangs-Bild nicht ganz quadratisch, so muss die Sperre für das Seitenverhältnis gelöst werden.

Bild Skalieren in Gimp

Nachdem die Bildgröße mit OK übernommen wurde, kann die Datei gespeichert werden:

Gimp speichern unter

Nun muss das Favicon den Dateinamen „favicon.ico“ erhalten.

Gimp speichern unter ico Datei

Die nächste Abfrage kann einfach mit OK bestätigt werden.

Gimp Windows icon speichern

Nun ist das neue Bild am angegebenen Ort auf dem Computer gespeichert. Es eignet sich nicht nur für Joomla, sondern auch für andere CMS Systeme (unter anderem WordPress) und HTML-Seiten.

Favicon in Joomla Theme einfügen

Jetzt muss das Icon noch in das aktive Theme von Joomla eingefügt werden.

Zunächst muss in Erfahrung gebracht werden, welches Theme aktuell eingesetzt wird. Dies geschieht in der Joomla Administration über Erweiterungen > Templates.

Joomla Templates

Das Template mit dem Stern in der Spalte Standard ist das aktuell aktivierte. Im genannten Beispiel heißt das aktive Theme „itswebtime5“.

Die favicon.ico Datei muss in das Hauptverzeichnis des Themes kopiert werden, demnach wäre das in diesem Beispiel:

<Joomla-Verzeichnis>/templates/itswebtime5

Dazu kann ein FTP-Programm verwendet werden, beispielsweise der beliebte OpenSource FTP-Client FileZilla.

Dies ist das Template bzw. Theme-Verzeichnis. Ist die Datei dort eingefügt, wird sie automatisch verwendet. Eventuell ist ein Leeren des Browser-Caches notwendig, bevor die Änderung sichtbar ist. Alternativ kann der Browser mit der Tastenkombination STRG+F5 dazu gezwungen werden die Seiten-Inhalte erneut herunterzuladen.

Bewerte den Artikel

Kommentare

  1. Danke für die Erklärung. Ich hatte bei unserer Seite http://teampaket.de leichte Schwierigkeiten.

    Gruss
    Jupp

  2. Danke für die wirklich gut bebilderte Anleitung. Ich persönlich finde es sehr schade dass das einbinden eines favicons in Joomla noch so kompliziert geschehen muss.
    Im Internet gibt es aber auch ein paar ganz gute Favicon Generatoren die einem direkt online aus einem beliebigen Bild ein Favicon generieren, dass man dann herunterladen kann. Finde ich noch einen kleinen Tick einfacher.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.