Christoph S. Ackermann

Bei WordPress Themes sollte das Favicon mit dem Theme mitgeliefert werden und nicht manuell in das Root der WordPress Installation kopiert werden.

 

Für den richtigen Einbau kann wie folgt vorgegangen werden:

 

  1. Das Favicon in das Theme-Verzeichnis kopieren (z.B. wp-content/themes/demo)
  2. Die Datei, welche den HTML-Header beinhaltet (oft header.php), mit einem Editor öffnen
  3. Im Bereich des <head>-Tags, folgende Zeile einfügen:
    <link rel="shortcut icon" href="<?php bloginfo('stylesheet_directory'); ?>/favicon.ico" />

 

Danach wird das Favicon auf jeder Seite angezeigt – und wechselt auch entsprechend mit dem Theme.

 

Der Codeschnipsel ist zudem universell einsetzbar – es müssen keine Pfade manuell angepasst werden, da diese mit der bloginfo-Funktion ausgelesen werden.

 

Noch ein paar Favicon Facts:

  • Alle Browser, bis und mit IE5, unterstützen die *.ico-Files
  • Es können auch *.png und *.gif’s als Favicons eingesetzt werden – jedoch rufen alle modernen Browser trotzdem ein favicon.ico ab. Um 404-Fehler zu vermeiden, sollte immer ein favicon.ico als Backup bereit stehen
  • *.ico kann mehrere Icons beinhalten – es ist nicht notwendig, mehrere Dateien für z.B. unterschiedliche Grössen bereit zu stellen

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Lust auf mehr?

Outing als Digital Rebels

Unser Outing als Digital Rebels mit Impact

Fabienne Mast
Im Grunde genommen waren wir schon immer digitale …
Blogbeitrag ansehen
Hosting

Swiss Hosting – Das Gütesiegel für Schweizer Qualität in der Schweizer Softwarebranche

Christoph S. Ackermann
«swiss hosting» ist in aller Munde. Innert kurzer …
Blogbeitrag ansehen
Gesicht mit UX Design Post-it auf der Stirn
UX

UX Irrtümer Teil 1 – Design ist nicht Design

Dominik Schendl
Das Wort Design und seine Interpretation im deutschen …
Blogbeitrag ansehen
Gesicht mit UX Design Post-it auf der Stirn
UX

UX Irrtümer Teil 3 – Unzertrennbares UI/UX

Dominik Schendl
Die Kombination UI/UX oder vice versa hat sich …
Blogbeitrag ansehen