Eigenes Favicon einbinden

 Ein Kommentar zu diesem Tutorial

Ein Favicon stellt mittlerweile ein unverwechselbares branding dar, sei es im Browser, sozialen Netzwerken, etc. Doch fangen wir vorne an, wir möchten an dieser Stelle darauf eingehen „Was ist ein Favicon?“, „Wie kann ich das Favicon in Magento einbinden?“ und „Wie kann ich mein eigenes Favicon verwenden?“.

Was ist ein Favicon?

Wikipedia sagt dazu:

„Ein Favicon (kurz für favorite icon, engl. für Favoriten-Symbol) ist ein kleines, 16×16 oder 32×32 Pixel großes Icon, Symbol oder Logo, das unter anderem in der Adresszeile eines Browsers links von der URL angezeigt wird und meist dazu dient, die zugehörige Website auf wiedererkennbare Weise zu kennzeichnen. Von den Browsern werden aber nur 16×16 Pixel angezeigt. Das Favicon taucht auch in der Lesezeichenleiste (Favoriten), bei den Registerkarten (oder Tabs) und unter Windows beim Speichern einer Seite auf dem Desktop auf. Es wurde von Microsoft mit dem Internet Explorer 5 eingeführt.“

Wie kann ich das Favicon in Magento einbinden?

Man muss die entsprechende Grafik auf seinen Webserver laden. Anschließend muss diese Datei im <head> </head> Bereich mit einer Anweisung referenziert werden. Diese Anweisung lautet:

&lt;link rel="shortcut icon" type="image/x-icon" href="/favicon.ico"&gt;

Für verschiedene Arten von Icons benötigt man unterschiedliche Anweisungen für „type“:

  • Für beispiel.ICO: image/x-icon
  • Für beispiel.GIF: image/gif
  • Für beispiel.PNG: image/png

Eigenes Favicon hochladen

Magento ünterstützt standardmäßig das .ico-Format. Um ein eigenes Favicon zu verwenden reicht es aus das Favicon zu überschreiben/auszutauschen. Einen Favicon-Generator der ein Favicon aus einem hochgeladen Bild macht und ich empfehlen kann ist realfavicongenerator.net.

Im Magento Verzeichnis gibt es mehrere Favicons. Um das gewünschte Favicon immer (im Front- und im Backend) anzuzeigen muss an foglenden Orten das Favicon liegen:

  • Im Server-Hauptverzeichnis („Magento Verzeichnis“/favicon.ico)
  • Im aktivierten Frontend-Theme („Magento Verzeichnis“/skin/frontend/pfad-zum-theme/favicon.ico)
  • Im aktivierten Backend-Theme („Magento Verzeichnis“/skin/adminhtml/default/default/favicon.ico)

Dann den Cache von Magento und dem Browser aktualisieren. Es kann dennoch eine Weile dauern bis die neuen Favicons übernommen werden.

Eigenes Favicon im Backend hochladen

Magento bietet auch die Möglichkeit das Favicon im Backend hochzuladen. Dazu unter

  • System > Konfiguration > Design > Html Kopf > Favicon Grafik

das Icon hochladen das im Browser-Tab angezeigt werden soll.

Autor

Sebastian

Ich interessiere mich für eCommerce-Themen, vor allem im Zusammenhang mit dem Shopsystem Magento Commerce sowie alles rund um Web-Entwicklung und den damit verbundenen Möglichkeiten.

Ein Kommentar zu “Eigenes Favicon einbinden

  • 6. August 2013 um 14:16 Uhr
    Permalink

    Sehr schön zur pixelgenauen Erstellung von Icons eignet sich meiner Meinung nach auch das Program Fireworks von Adobe, welches zudem viele weitere Formate beherrscht! ;)

    Antwort

Schreibe einen Kommentar

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

*