Favicon in WordPress: How to insert your site icon correctly (2025)

Kurzantwort: In WordPress lädst du dein Favicon als Website-Icon im Customizer hoch (mind. 512×512 PNG). WordPress erzeugt automatisch die nötigen Größen und bindet alles korrekt ein. Für Spezialfälle (Custom Themes, Headless, Plugin-Konflikte) helfen die Snippets unten.

Schnell-Referenz: Größen & Formate in WordPress

Use Case	Empfohlene Größe(n)	Format
Browser-Tab (Standard & HiDPI)	16×16, 32×32	PNG oder ICO
Apple-Touch (iOS/iPadOS)	180×180	PNG
Google/Android & SERPs	48×48 (Vielfache: 96, 192)	PNG
Quelle/Source für Generatoren	512×512	PNG, optional SVG (mit Fallback)
Kompatibilität (Fallback)	/favicon.ico (Mehrgrößen)	ICO

*Für Details zu sinnvollen Größen siehe Favicon-Größen für jede Plattform. Wenn das Icon trotz korrekter Schritte nicht auftaucht, hilft Favicon wird nicht angezeigt: Ursachen & Lösungen. Für die Erstellung kompletter Sets inkl. Code siehe den Favicon-Generator-Vergleich 2025.

Praxis: drei Wege, die sicher funktionieren

Customizer (empfohlen) – schnell, einfach und sicher. Pfad: Design → Website-Informationen → Website-Icon (PNG ≥ 512×512). Dashboard → Design → Website-Informationen → Website-Icon (512×512 PNG)

Manuell im <head> – für eigene Themes oder Spezialfälle.

<link rel="icon" href="/favicon-32.png" sizes="32x32"><link rel="apple-touch-icon" href="/apple-touch-icon.png" sizes="180x180"><link rel="icon" href="/favicon.ico" type="image/x-icon">

Plugin-Weg – wenn Themes Einträge überschreiben. Tipp: Danach doppelte Head-Einträge prüfen und Cache leeren. Nach Installation: doppelte <link rel="icon"> entfernen → Cache leeren

MIME-Types & Caches: zwei typische Stolpersteine

1) Korrekte Content-Types ausliefern

Der Server sollte Folgendes senden (DevTools → Network prüfen): image/pngimage/x-iconFalsche Typen (z. B. text/plain) verhindern die Anzeige.

2) Cache richtig leeren

Browser: Hard-Reload (Strg/Cmd + Shift + R). Server/CDN: Cache/Purge im Hosting/Plugin (z. B. LiteSpeed/Cloudflare). Erst testen, dann ggf. eine Version anhängen (?v=2), aber nicht inflationär verwenden.

Wenn’s hakt: so findest du Doppel-Einbindungen

Öffne den Quelltext (Strg/Cmd + U) und suche nach rel="icon" und apple-touch-icon. Es darf je Typ nur eine aktive Zeile geben. Entferne alte Einträge im Theme/Plugin, damit nur ein Icon-Set greift. Fazit: In WordPress reicht der Customizer mit einer 512×512-PNG in den meisten Fällen. Prüfe bei Problemen doppelte Head-Einträge, korrekte MIME-Types und leere Caches. Für Größen/Generatoren siehe den Hauptartikel.