WordPress: Favicon einbinden – so funk­tio­niert’s

In der Tab-Leiste Ihres Browsers öffnet sich mit jeder neuen Seite ein eigener Tab. In diesem sind der Sei­ten­ti­tel der Website sowie ein kleines Symbol ab­ge­bil­det – das Favicon. Beide In­for­ma­tio­nen er­leich­tern dem User die Iden­ti­fi­zie­rung einer Homepage und die Ori­en­tie­rung, wenn mehrere Tabs gleich­zei­tig geöffnet sind. Das Favicon einer Website ist darüber hinaus Teil des Un­ter­neh­mens-Brandings und ver­bes­sert die User Ex­pe­ri­ence. Ihnen stehen drei Mög­lich­kei­ten zur Verfügung, ein Favicon in WordPress ein­zu­fü­gen. Wir erklären Schritt für Schritt, wie diese funk­tio­nie­ren und welche Vorteile jede einzelne Mög­lich­keit mit sich bringt.

Der Begriff Favicon ist die Abkürzung für „Favorite Icon“. Dies kleine Icon ist ein in­te­gra­ler Be­stand­teil des Web-Auftritts eines Un­ter­neh­mens. Es wird in der Tab-Leiste, der Le­se­zei­chen-Leiste, bei WordPress-Mobile-Apps, Home-Icons sowie in mobilen Such­ergeb­nis­sen angezeigt. Dem­entspre­chend ist es emp­feh­lens­wert, ein aus­sa­ge­kräf­ti­ges und ein­deu­ti­ges Symbol als Favicon aus­zu­wäh­len. Das bringt viele Vorteile:

• Es steigert die Se­rio­si­tät und Pro­fes­sio­na­li­tät einer Website.
• Es er­leich­tert dem User, das Un­ter­neh­men und seine Dienst­leis­tung im Web leichter zu erkennen und ver­bes­sert so die User Ex­pe­ri­ence der Website.
• Es wirkt sich positiv auf die Such­ma­schi­nen­op­ti­mie­rung aus.
• Hat ein User im Browser viele Tabs gleich­zei­tig geöffnet, sind die Seiten-Titel aus­ge­blen­det. Das Favicon hingegen bleibt immer sichtbar.

Ihnen stehen drei Mög­lich­kei­ten offen, ein Favicon in WordPress ein­zu­fü­gen: Mit dem WordPress Cus­to­mi­zer, einem Plug-in oder manuell. Im Folgenden stellen wir Ihnen die Optionen genauer vor.

Die ein­fachs­te und schnells­te Methode, ein Favicon in WordPress ein­zu­fü­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 emp­foh­le­ne Min­dest­grö­ß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 Cus­to­mi­zer ein Favicon in WordPress einfügen.

WordPress übernimmt das Favicon au­to­ma­tisch. Um das WordPress-Favicon zu ändern, kehren Sie zu diesem Ein­stel­lungs­be­reich zurück.

WordPress bietet für (fast) alle Funk­tio­nen ein passendes Plug-in, so auch für das Einfügen eines Favicons. Eines der be­lieb­tes­ten kos­ten­lo­sen Plug-ins ist der Favicon by Re­al­Fa­vicon­Ge­ne­ra­tor. Dieser bietet gegenüber dem WordPress Cus­to­mi­zer zu­sätz­li­che Ein­stel­lungs­op­tio­nen, um die Kom­pa­ti­bi­li­tät des Favicons mit ver­schie­de­nen Geräten und App-Icons zu ver­bes­sern. Im Folgenden erklären wir, wie Sie mit diesem Plug-in ein Favicon in WordPress ein­rich­ten.

WordPress bietet in vielen Fällen auch die Mög­lich­keit, Ein­stel­lun­gen manuell vor­zu­neh­men. Ein WordPress-Favicon lässt sich daher auch per File Transfer Protocol (FTP) hin­zu­fü­gen. Dazu benötigen Sie ein Favicon-Paket mit ver­schie­de­nen Dateien sowie einen HTML-Code. Beides lässt sich pro­blem­los mit einem kos­ten­lo­sen Online-Tool erstellen.

Greifen Sie per FTP auf die WordPress-Daten zu. Öffnen Sie das Haupt­ver­zeich­nis 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.

An­schlie­ß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.