WordPress Favicon einfügen & ändern 💥 so geht’s (2019)

Das WordPress Favicon kannst du entweder mit einem Plugin oder mit deinem Theme auf deiner WordPress-Website einfügen. Durch die Einbindung deines Favicons sorgst du für ein einheitliches Branding und erhöhst deinen Wiedererkennungswert. Wie das funktioniert, zeige ich dir in dieser Anleitung.

Als Favicon wird in der Regel das Firmenlogo verwendet. Es muss eine spezielle Größe haben, damit du es in WordPress einfügen kannst..

WordPress Favicon erstellen

Ein Favicon ist eine sehr kleine Grafik, die im Browser links neben dem Titel dargestellt wird. Im folgenden Screenshot siehst du ein kurzes Beispiel. Das ist mein Logo und daneben steht der Titel dieses Artikels.

Nach dem Einfügen des Favicons erscheint es oben Links im Browser-Tab.

Das WordPress-Favicon ist zudem auch sichtbar, wenn die Website in den Lesezeichen im Browser gespeichert wird. Fast alle Browser stellen das Favicon in den Lesezeichen mit dar.

Die Vorgehensweise ist eigentlich ganz einfach. Dazu benötigst du als erstes eine Grafik, die du als Favicon nutzen möchtest. Beachte bitte, dass das Favicon quadratisch und sehr klein ist. Nach der Einbindung in WordPress sollte das Favicon gut erkennbar sein.

Das Erstellen deines Favicons benötigt 2 Schritte:

  1. Grafik auf die Größe 32 x 32 Pixel verkleinern (in manchen Fällen auf 16 x 16 Pixel)
  2. Umwandlung der Datei auf das Format .ico

Die Änderung der Größe kannst du mit deinem Grafikbearbeitungsprogramm durchführen. Das funktioniert mit jeder beliebigen Software. Wichtig ist, dass dein Favicon auch in der kleinen Größe noch gut erkennbar ist. Achte bitte darauf.

Als nächstes musst du die Grafik im Format .ico speichern. Da dies die meisten Grafik. Die meisten Grafikprogramme können allerdings nicht in dieses Format konvertieren.

Das ist aber kein Problem, denn es gibt viele Online-Dienste, mit denen du das Favicon ändern kannst. Mit dem Tool auf der Website www.favicon.pro/de kannst du aus deiner Grafik ein richtiges Favicon machen, dass du anschließend in WordPress einbinden kannst.

Klicke auf „Durchsuchen“, wähle die Datei aus und klicke auf „hochladen“. Jetzt kannst du sich das fertige Favicon herunterladen. Benne diese Datei so um, dass sie „favicon.ico“ lautet.

Favicon in WordPress einfühgen

Der finale Schritt ist nun, dass Favicon in WordPress einzufügen. Wie so oft gibt es verschiedene Wege, das zu tun. Im Folgenden 3 Möglichkeiten:

  • Favicon mittels deines WordPress Themes einfügen
  • Das Favicon per WordPress Plugin einfügen
  • Favicon per FTP-Programm hochladen

Ich empfehle dir die Variante mit Theme oder Plugin. Das ledigliche Hochladen des Favicons in WordPress ist oft nicht ausreichend genug. Dennoch möchte ich dir alle 3 Möglichkeiten in folgender Anleitung ausführlich zeigen.

Wenn du die Einbindung testen möchtest, solltest du zuvor immer deinen Browser-Cache leeren. Alternativ kannst du auch ein Inkognito verwenden.

Favicon mittels deines WordPress Themes einfügen

Jedes moderne und gut programmierte Theme bietet dir die Möglichkeit, ein Favicon ganz einfach einzubinden, bzw. zu ändern. Du kannst es über die Theme-Optionen einfügen.

Da es viele Theme-Hersteller gibt und jedes etwas anders angepasst wird, kann ich dir keinen allgemein gültigen Menüpunkt dafür sagen. Wenn dein Theme diese Funktion anbietet, findest du die Möglichkeit in den Theme-Optionen und kannst von dort das Favicon einfügen.

Das Favicon per WordPress Plugin einfügen

Falls die erste Möglichkeit nicht funktioniert hat, kannst du dein WordPress Favicon mit Hilfe eines Plugins einfügen. Ich empfehle dir dafür folgendes Plugin:

Link: Hier gehts zum Plugin

Die Einbindung funktioniert folgendermaßen:

  1. Erstelle ein quadratisches Bild aus deinem Logo mit den Maßen 260 x 260 Pixel (JPG- oder PNG-Datei).
  2. Installiere das gerade genannte Plugin.
  3. Lade die Bilddatei hoch und binde sie beim WordPress Favicon Plugin ein.

Favicon per FTP-Programm hochladen

Wie schon erwähnt, empfehle ich dir die ersten beiden Varianten. Diese letzte Möglichkeit ist lediglich die Notlösung, falls die anderen beiden Varianten aus welchem Grund auch immer nicht möglich sind.

Dazu öffnest du dein FTP-Programm und stellst die Verbindung mit deinem Webserver her.

Achte darauf, dass der Dateiname des WordPress-Favicons „favicon.ico“ lautet. Danach lädst du die Datei in das Root-Verzeichnis deiner WordPress-Installation. Das war es schon, jetzt ist dein Favicon in WordPress eingebunden.

WordPress Favicon testen

Der letzte Schritt besteht darin, das WordPress Favicon zu testen. Dazu solltest du vorab den Cache (Zwischenspeicher) deines Browsers leeren, damit das neue Favicon auch angezeigt wird. Alternativ kannst du bei deinem Browser die Inkognito-Funktion verwenden. Nur wenn du das machst, wird sich dein Favicon ändern.

Wieso das Branding so wichtig ist

Du hast sicherlich nach diesem Thema gesucht, weil du deine Website optimieren oder besser gesagt dein Branding verbessern möchtest. Sobald ein Website-Besucher deine Seite in seinen Lesezeichen speichert, wird im Browser links neben dem Eintrag das Icon dargestellt. Sicherlich kennst du das von Lesezeichen, die du selbst gesetzt hast.

Dadurch erhöhst du den Wiedererkennungswert und die Chance ist groß, dass dieser Besucher deine Website zu einem späteren Zeitpunkt wieder besuchen wird. Das ist übrigens ein wichtiger SEO-Aspekt. Denn wenn ein Besucher deine Website mehrmals besucht, ist das für Google natürlich ein positives Zeichen.

Bei deinem WordPress Favicon solltest du dich natürlich an deinem Logo und deiner CI (Corporate Identity) orientieren.

Klicke hier, um unten einen Kommentar zu hinterlassen 4 Kommentare
Michael Rudolf Widmer - 26. März 2019

Hallo Oliver
Frage zuvor betreffes Löschen des Favicon Generators nach erfolgtem Favicon Installation hat sich erledigt. Muss aktiv bleiben 😉

Dank Deines Videos, bzw. Deinen Ausführungen habe ich es geschafft,
alles läuft bestens, und das beim ersten Versuch.
Super
und vielen Dank
Michael

Antworten
    Oliver Pfeil - 26. März 2019

    Hallo Michael,

    ja, damit das Favicon auf allen Endgeräten dargestellt wird und er Prozess funktioniert, muss das Plugin aktiv sein.

    Falls du dafür nicht ein extra Plugin nutzen möchtest, solltest du dir mal deine Theme-Einstellungen ansehen. Vielleicht bietet dein Theme die Möglichkeit, ein WordPress Favicon zu hinterlegen.

    Antworten
Michael Rudolf Widmer - 26. März 2019

Hallo Oliver
Vielen Dank für dieses super gute und klar aufgezeigtes Video.
Eine Frage dazu:
Wenn ich das Plugin installiere um das Favicon auf WordPress zu installieren, kann ich nachdem das Favicon installiert ist, dieses Plugin wieder deaktivieren, bzw. entfernen?

Zweite Frage:
Ich habe im Video gesehen, dass du Thrive Architect verwendest.
Programmierst Du damit selber Homepages, bist Du ein Thrive Crack?
Bin immer noch auf der Suche nach Einem, den ich mir auch leisten kann 🙂

Beste Grüße
Michael

Antworten
Patrick - 28. April 2013

Hi Oliver,
danke für den Tipp. Hat super geklappt!

Antworten

Hinterlasse eine Antwort: