So änderst du dein Favicon in jedem Website-Baukasten
Favicon ändern
Favicon ändern in Webflow, Wix, Shopify und mehr | We.Inc
Favicon Schritt für Schritt ändern in Webflow, Squarespace, Wix, Shopify, WordPress und HTML, veröffentlichte Größenregeln und warum Google noch dein altes Symbol zeigt.
Um ein Favicon zu ändern, lädst du in den Website-Einstellungen deines Baukastens ein neues quadratisches Bild hoch und veröffentlichst anschließend. Webflow, Squarespace, Wix, Shopify und WordPress haben jeweils ein eigenes Feld für das Symbol, bei einer selbst programmierten Website ersetzt du die Datei und den Tag link rel=icon. Browser und Google speichern Symbole im Cache, daher kann das alte noch eine Weile sichtbar bleiben.
Wo sich die Favicon-Einstellung befindet, Stand Oktober 2026
Baukasten
Wo du sie findest
Größe laut Hilfeseite
Webflow
Website-Einstellungen (suche nach dem Favicon- oder Symbolfeld)
Prüfe die aktuellen Größenregeln auf der Hilfeseite von Webflow
Squarespace
Favicon-Bereich
100x100 bis 300x300 px, .png, maximal 100 KB
Wix
Einstellungen, Website-Einstellungen, Favicon
Quadratisch, Vielfaches von 48 px, außer bei SVG
Shopify
Theme bearbeiten, Theme-Einstellungen, Logo oder Favicon
16x16 oder 32x32 px
WordPress 6.5+
Einstellungen, Allgemein, Website-Icon
Quadratisch, mindestens 512 px, .png empfohlen
Suche unten deinen Baukasten. Die Schritte stammen jeweils von der Hilfeseite des jeweiligen Baukastens. Wenn du eine selbst programmierte Website betreibst, schreibt dir die letzte Karte die Link-Tags. Erstelle das Symbol zuerst mit unserem Favicon-Generator, falls du noch keins hast.
Suche deinen Baukasten in der Liste, folge den Schritten und beachte eventuelle Tarifregeln.
Bei einer selbst programmierten Website gibst du den Ordner mit deinen Symboldateien ein und erhältst die Link-Tags.
Lade hoch oder füge ein, veröffentliche deine Website und öffne sie dann in einem privaten Fenster, um das neue Symbol zu sehen.
Gib Google Zeit für einen erneuten Crawl. Laut der Favicon-Hilfe von Google kann das einige Tage bis mehrere Wochen dauern.
Gestalte das Symbol quadratisch. Google verlangt ein Seitenverhältnis von 1:1 und empfiehlt mehr als 48x48 Pixel.
Lass das Symbol unter derselben Adresse, sobald es live ist. Google wünscht sich eine stabile Favicon-URL.
Prüfe, dass robots.txt die Symboldatei nicht blockiert. Googlebot und Googlebot-Image müssen sie beide abrufen können.
Verwende eine kräftige, einfache Form. Feine Details verschwinden in Tab-Größe.
Häufige Fragen
Warum zeigt Google noch mein altes Favicon?
Google übernimmt ein neues Favicon, wenn es deine Startseite erneut crawlt, was laut der Hilfeseite einige Tage bis mehrere Wochen dauern kann. Du kannst einen schnelleren Crawl anstoßen, indem du im URL-Prüftool der Search Console die Indexierung der Startseite beantragst.
Warum zeigt mein Browser noch das alte Symbol?
Browser speichern Favicons lange im Cache. Die Hilfeseite von Squarespace empfiehlt, den Browser-Cache zu leeren und den Browser neu zu starten. Die Website in einem privaten Fenster zu öffnen ist eine schnelle Prüfung, ob das neue Symbol wirklich live ist.
Kann ich im Starter-Tarif von Shopify oder auf einer kostenlosen Wix-Website ein Favicon hinzufügen?
Stand Oktober 2026 nicht. Laut der Hilfeseite von Shopify kann im Starter-Tarif kein Favicon hinzugefügt werden. Wix verlangt einen Premium-Tarif und eine verbundene Domain, außerdem musst du die Website zuerst veröffentlichen.
Kann ich im Dark Mode ein anderes Favicon haben?
Bei manchen Baukästen ja. Squarespace lässt dich eine Dark-Mode-Version hochladen, nachdem du das Standardsymbol festgelegt hast. Bei einer selbst programmierten Website kannst du auf ein SVG-Symbol verweisen, das seine Farbe über eine prefers-color-scheme Media Query innerhalb des SVG ändert.
Was Google braucht, bevor es dein Symbol anzeigt
Google liest den Link-Tag im head-Bereich deiner Startseite. Unterstützt werden die rel-Werte icon, shortcut icon, apple-touch-icon und apple-touch-icon-precomposed, akzeptiert werden Formate wie ICO, PNG, GIF und JPEG.
Google zeigt ein Favicon pro Hostname. Eine Subdomain wie shop.example.com kann ein eigenes haben, ein Ordner wie example.com/shop dagegen nicht.
Wenn die Einstellung im Baukasten fehlt
Wenn dein Tarif das Favicon-Feld ausblendet, ist ein Upgrade bei gehosteten Baukästen meist der einzige Weg, weil du den head-Bereich der Seite nicht selbst bearbeiten kannst. Bei selbst gehosteten Websites kannst du den Link-Tag jederzeit von Hand hinzufügen.
Die Favicon-Regeln von Google
Aus der Favicon-Hilfeseite von Google, Oktober 2026
Regel
Detail
Form
Quadratisch, Seitenverhältnis 1:1
Größe
Mindestens 8x8 px, größer als 48x48 empfohlen
Formate
Jedes gültige Favicon-Format, etwa ICO, PNG, GIF, JPEG, BMP
Pro Website
Ein Favicon pro Hostname
Crawling
Googlebot und Googlebot-Image müssen es abrufen dürfen
Aktualisierungen
Einige Tage bis mehrere Wochen, beantrage die Indexierung, um es zu beschleunigen
Codebeispiel
Ein SVG-Favicon, das im Dark Mode umschaltet
Speichere das SVG als icon.svg. Der style-Block darin ändert die Füllfarbe, wenn das System des Besuchers im Dark Mode ist. Behalte zusätzlich eine favicon.ico, da nicht jeder Browser SVG-Symbole liest.
Schritte für deinen Baukasten
Selbst programmierte Website (HTML)
Ordner mit deinen Symbolen
Ich habe auch ein SVG-Symbol
In den head-Bereich jeder Seite einfügen
Kopieren
Kopiert.
Lade zuerst favicon.ico, icon.png (mindestens 48x48) und apple-touch-icon.png (180x180) in diesen Ordner hoch.
Webflow
Öffne die Einstellungen deiner Website und suche das Feld für Favicon oder Website-Symbol.
Lade ein quadratisches Bild hoch.
Speichere und veröffentliche dann die Website, damit das neue Symbol live geht.
Die Hilfeseite von Webflow war bei unserer Prüfung nicht lesbar, folge also den Bezeichnungen in deinem eigenen Dashboard für die genauen Menünamen und Größen.
Squarespace
Öffne den Favicon-Bereich.
Ziehe dein Bild in das Upload-Feld oder klicke darauf, um eine Datei auszuwählen.
Füge optional eine Dark-Mode-Version hinzu (erst nachdem ein Standard-Favicon festgelegt ist).
Klicke auf Speichern.
Die Hilfeseite empfiehlt 100x100 bis 300x300 Pixel, .png-Dateien und nicht mehr als 100 KB.
Wix
Gehe im Dashboard deiner Website zu Einstellungen.
Klicke auf Website-Einstellungen.
Klicke unter Favicon auf Bild hochladen.
Wähle deine Datei aus.
Erfordert einen Premium-Tarif, eine verbundene Domain und eine veröffentlichte Website. Das Bild muss quadratisch und ein Vielfaches von 48 px sein, außer es ist ein SVG.
Shopify
Gehe in deinem Shopify-Adminbereich zu Onlineshop.
Suche dein Theme und klicke auf Theme bearbeiten.
Klicke auf das Symbol für Theme-Einstellungen und dann je nach Theme auf Logo oder Favicon.
Klicke unter Favicon-Bild auf Bild auswählen, wähle oder füge das Bild hinzu und klicke dann auf Fertig.
Klicke auf Speichern.
Shopify nennt 16x16 oder 32x32 px als ideale Größe. Im Starter-Tarif nicht verfügbar.
WordPress
Lade ein quadratisches Bild mit mindestens 512 px in die Mediathek hoch.
Gehe zu Einstellungen und dann zu Allgemein.
Klicke auf Website-Icon auswählen.
Wähle das hochgeladene Bild aus.
Vor Version 6.5 befand sich die Einstellung unter Design, Customizer, Website-Informationen.