WordPress: Favicon einbinden – so funktioniert’s

In der Tab-Leiste Ihres Browsers öffnet sich mit jeder neuen Seite ein eigener Tab. In diesem sind der Seitentitel der Website sowie ein kleines Symbol abgebildet – das Favicon. Beide Informationen erleichtern dem User die Identifizierung einer Homepage und die Orientierung, wenn mehrere Tabs gleichzeitig geöffnet sind. Das Favicon einer Website ist darüber hinaus Teil des Unternehmens-Brandings und verbessert die User Experience. Ihnen stehen drei Möglichkeiten zur Verfügung, ein Favicon in WordPress einzufügen. Wir erklären Schritt für Schritt, wie diese funktionieren und welche Vorteile jede einzelne Möglichkeit mit sich bringt.

Der Begriff Favicon ist die Abkürzung für „Favorite Icon“. Dies kleine Icon ist ein integraler Bestandteil des Web-Auftritts eines Unternehmens. Es wird in der Tab-Leiste, der Lesezeichen-Leiste, bei WordPress-Mobile-Apps, Home-Icons sowie in mobilen Suchergebnissen angezeigt. Dementsprechend ist es empfehlenswert, ein aussagekräftiges und eindeutiges Symbol als Favicon auszuwählen. Das bringt viele Vorteile:

• Es steigert die Seriosität und Professionalität einer Website.
• Es erleichtert dem User, das Unternehmen und seine Dienstleistung im Web leichter zu erkennen und verbessert so die User Experience der Website.
• Es wirkt sich positiv auf die Suchmaschinenoptimierung aus.
• Hat ein User im Browser viele Tabs gleichzeitig geöffnet, sind die Seiten-Titel ausgeblendet. Das Favicon hingegen bleibt immer sichtbar.

Ihnen stehen drei Möglichkeiten offen, ein Favicon in WordPress einzufügen: Mit dem WordPress Customizer, einem Plug-in oder manuell. Im Folgenden stellen wir Ihnen die Optionen genauer vor.

Die einfachste und schnellste Methode, ein Favicon in WordPress einzufügen, steht seit der WordPress-Version 4.3 zur Verfügung. Mit diesem Favicon-WordPress-Tool laden Sie das Favicon hoch, schneiden es bei Bedarf zu und richten es mit wenigen Klicks ein.

Bei dieser Variante ist die empfohlene Mindestgröße für ein Favicon 512 x 512 Pixel. Im Browser-Tab wird das Bild jedoch in einer Größe von 16 x 16 Pixel angezeigt. Achten Sie daher darauf, dass Ihr Favicon auch in dieser Größe leicht erkennbar ist. Wir erklären Schritt für Schritt, wie Sie mit dem Customizer ein Favicon in WordPress einfügen.

WordPress übernimmt das Favicon automatisch. Um das WordPress-Favicon zu ändern, kehren Sie zu diesem Einstellungsbereich zurück.

WordPress bietet für (fast) alle Funktionen ein passendes Plug-in, so auch für das Einfügen eines Favicons. Eines der beliebtesten kostenlosen Plug-ins ist der Favicon by RealFaviconGenerator. Dieser bietet gegenüber dem WordPress Customizer zusätzliche Einstellungsoptionen, um die Kompatibilität des Favicons mit verschiedenen Geräten und App-Icons zu verbessern. Im Folgenden erklären wir, wie Sie mit diesem Plug-in ein Favicon in WordPress einrichten.

WordPress bietet in vielen Fällen auch die Möglichkeit, Einstellungen manuell vorzunehmen. Ein WordPress-Favicon lässt sich daher auch per File Transfer Protocol (FTP) hinzufügen. Dazu benötigen Sie ein Favicon-Paket mit verschiedenen Dateien sowie einen HTML-Code. Beides lässt sich problemlos mit einem kostenlosen Online-Tool erstellen.

Greifen Sie per FTP auf die WordPress-Daten zu. Öffnen Sie das Hauptverzeichnis und laden Sie dort das Favicon-Paket hoch. Achten Sie darauf, dass es sich im selben Ordner wie der WP-Admin-Ordner oder der WP-Content-Ordner befindet.

Anschließend öffnen Sie die Datei header.php und fügen den HTML-Code des Favicons im Header-Bereich ein. Achten Sie darauf, dass Ihre Domain und der Favicon-Pfad korrekt angegeben sind.