Was ist ein Favicon? Und wie integrierst du ein Favicon in deinen WordPress-Blog?

Favicons sind die kleinen 16×16 Pixel großen Symbole, die neben deiner URL im Browserfenster auftauchen. Auch wenn du eine Webseite in deinen Lesezeichen speicherst, oder wie ich in der Lesezeichen-Symbolleiste in Firefox, findest du die Favicon-Icons wieder. So kannst du eine Webseite schnell wiederfinden.

1. Und wie erstellt du dein Favicon?

Am besten verwendest du dein Webseiten-Logo als Favicon. Doch bei einer so kleinen Größe (16×16 Pixel), ist das leider nicht immer möglich. Dann suchst du am besten ein einfaches Symbol in den Farben deiner Webseite, oder verwendest deine Initalien. Erstelle dein Symbol erst als .jpg oder .png Datei.

Jetzt gehst du auf die Webseite eines kostenlosen Favicon-Generators. Zum Beispiel: www.favicon-generator.de oder www.favicon-maker.de.

Favicon-Generator

Hier kannst du dein Favicon online generieren.

Dein Favicon mit der Dateiendung .ico kannst du dir dann als gezippte Datei herunterladen. Du kannst dir sogar ein animiertes Favicon-Icon erstellen, wenn du das möchtest.

Lade die favicon.ico Datei in das Hauptverzeichnis deiner Webseite auf deinen Server hoch.

2. Die Favicon-Datei im Head-Bereich deiner Webseite aufrufen

Als letzten Schritt muss du lediglich noch einen Code-Schnipsel in den Head-Bereich deiner Webseite einfügen.

Wenn du einen WordPress-Blog hast, öffne deine header.php Datei in deinem Theme-Ordner (wp-content/themes/DeinThemeName/header.php). Füge folgenden Code in den Head-Bereich ein:

[php]
<head>
<link rel="shortcut icon" href="<?php bloginfo(‚url‘); ?>/favicon.ico" type="image/x-icon" />
</head>
[/php]

Auf einer statischen Webseite fügst du folgenden Code in den Head-Bereich deiner Seiten ein:

[php]
<head>
<link rel="shortcut icon" href="favicon.ico" />
</head>
[/php]

Fertig, beim nächsten Aufruf deiner Webseite sollte dein Favicon-Icon zu sehen sein. Falls nicht, versuche doch einmal die Cookies in deinen Browser zu löschen. Dann klappt es bestimmt!

Wenn du Fragen oder Anregungen an mich hast, schreib doch einfach unten einen Kommentar. Ich freue mich über dein Feedback!

7 Kommentare zu “Was ist ein Favicon? Und wie integrierst du ein Favicon in deinen WordPress-Blog?

  1. Danke, dass du mich dran erinnert hast ;) Ich wollte mein Schaf schon lange als Favicon verwenden, und jetzt hab ichs endlich geschafft.

  2. Hey Barbara, dein Schaf sieht klasse als Favicon aus.

  3. Zunächst einmal danke für dieses tolle Theme. Ich verwende es auch seit gestern, bin allerdings immer noch dabei, es anzupassen. Leider hat das einbinden des Favicon wie oben beschrieben nicht geklappt. Habe dann allerdings den Tipp dieser Website http://www.tipps.1st-tec.de/wordpress/39-wordpress/96-favicon-erstellen-und-in-wordpress-einfuegen.html ausprobiert, und nun ist es drin. :-) Vielleicht eine kleine Hilfe für alle, bei denen es nicht funktioniert. Warum auch immer.

  4. Hallo,
    das wollte ich schon immer, einen eigenen favicon. bei blogger steht er gleich oben auf der seite design (supereinfach, wenn man keine ahnung hat, dachte ich). nun hab ich ein bild hochgeladen….aber es erscheint nicht!
    stöhn…selbst die einfachsten sachen gelingen mir nicht!
    LG

  5. Heyho,

    ich hab über diesen Post gerade mein Favicon eingebunden.
    Dass es manchmal nicht funktioniert, liegt vielleicht an einem Verständigungsproblem, dem WordPress-Anfänger aufsitzen.
    Es soll ja nur die Zeile
    <link rel="shortcut icon" href="/favicon.ico“ type=“image/x-icon“ />
    eingefügt werden, richtig?
    Wer den kompletten Code-Schnipsel inkl. und den Zeilenzahlen kopiert kommt nicht ans Ziel.

  6. Hallo,

    ich nutze ein Theme, wo ich bereits ein Favicon in die Theme Options hochladen kann. In der Header.php ist folgender Link:

    <link rel="shortcut icon" href="“ type=“image/x-icon“ />

    Das Favicon ist auch zu sehen, aber nun ist die Webseite nur noch halb so schnell. Wäre es eine bessere Lösung, den o.g. Code zu entfernen und alles manuell einzusetzen?

    Habe übrigens diesen Vorgang schon des Öfteren beobachtet (auch ohne Favicon-Uplaod-Onboard)

  7. Die einfachste Möglichkeit ein Favicon in WordPress zu implementieren: Plugin Favicon Rotator installieren und dem Menü folgen. That’s it!

Schreibe einen Kommentar

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