Favicon in Joomla! Einleitung: Was ist ein Favicon? Ein Favicon ist ein kleines Logo, welches im Browser links in der Adressleiste neben der URL angezeigt wird. Dieses Logo speichert der Browser, wenn eine Seite zu den Favoriten hinzugefügt wird. Das Logo wird folglich neben dem Seitentitel in den Favoriten angezeigt und hilft dem Benutzer die Übersicht zu bewahren. Erstellen eines Favicons Nutzen Sie Ihre Bildbearbeitungssoftware um das gewünschte Bild (bspw. Firmenlogo) auf die Grösse von 16x16 Pixel zu verkleinern. Hier können Sie ein Favicon direkt online erstellen, einfacher geht es nicht mehr: chami.com Mit dieser kostenlosen Software können Sie unter Windows ein Favicon erstellen, auch wenn Sie noch keine fertige Bildvorlage haben: Icon Edit. Für Adobe Photoshop gibt es ein Zusatzmodul, welches die Erstellung von Favicons vereinfacht: Photoshop Plugin. Beachten Sie dazu die Anweisungen am Ende der Anleitung. Speichern Sie das fertige 16x16 Pixel Favicon mit dem Dateinamen: favicon.ico Publizieren des Favicons Nun da Sie die Datei favicon.ico erstellt haben, möchten wir diese Datei in die Website einbinden. Dazu unterscheiden wir folgende Voraussetzungen: 1.) Sie verfügen über eine Joomla! Website und haben FTP-Zugriff auf den Server Das ist der einfachste Fall! Verbinden Sie sich mit Ihrem FTP-Server und laden Sie das erstellte Favicon in den Ordner "images" im Hauptverzeichnis. Überschreiben Sie dabei die vorhandene Datei. Voilà, für Sie endet die Anleitung hier! Bitte beachten Sie, dass Sie evtl. den Browser-Cache löschen müssen, bevor das neue Favicon angezeigt wird. Hat Ihnen diese Anleitung geholfen? Als Dankeschön freuen wir uns über Links auf unsere Website! 2.) Sie verfügen über eine Joomla! Website, haben Zugriff auf das Backend, aber keinen FTP-Zugriff In diesem Falle geht die Installation am einfachsten über Ihr Template: Entpacken Sie Ihr Template in einen Ordner auf Ihrem Computer. Kopieren Sie nun die Datei "favicon.ico" in das Unterverzeichnis "images" Ihres Templates. Öffnen Sie die Datei "templatesDetails.xml" mit einem Texteditor. Fügen Sie folgende Zeile direkt vor die Stelle, wo "</images>" geschrieben steht: <filename>images/favicon.ico</filename> Das sollte dann so aussehen an der Stelle: <filename>images/favicon.ico</filename> </images> Speichern Sie die Datei und schliessen Sie den Editor. Fügen Sie alle Dateien und Ordner im Templateverzeichnis wieder zu einem ZIP Archiv zusammen. Dieses Archiv muss wieder den selben Dateinamen wie zuvor haben. Wechseln Sie nun ins Joomla! Backend. Öffnen Sie den Template Manager (Site -> Template Manager -> Site Templates). Falls Sie das Template bereits installiert haben, löschen Sie es (Template Auswählen -> Delete). Klicken Sie auf "New", um das Template (wiederum) zu installieren. Wählen Sie die erstellte ZIP-Datei und klicken Sie auf "Upload & Install". Wechseln Sie nun in die "Globale Configuration" (Site -> Globale Configuration). Zu unterst gibt es das Feld "Favourites Site Icon". Fügen Sie dort folgende Quelle ein, unter der Berücksichtigung dass <templatename> durch den Namen der ZIP Datei des Templates (ohne .zip) ersetzt werden muss: ../templates/<templatename>/images/favicon.ico Beispiel Die Template ZIP-Datei heisst: iwebdesign.zip Dann ist <templatename>: iwebdesign Also: ../templates/iwebdesign/images/favicon.ico Klicken Sie abschliessend oben rechts auf "Save". Voilà, für Sie endet die Anleitung hier! Bitte beachten Sie, dass Sie evtl. den Browser-Cache löschen müssen, bevor das neue Favicon angezeigt wird. Hat Ihnen diese Anleitung geholfen? Als Dankeschön freuen wir uns über Links auf unsere Website! 3.) Sie verfügen über keine Joomla! Website, aber haben FTP-Zugriff Wenn das so ist, denken Sie zunächst darüber nach, ob Sie nicht auch eine Joomla! Website möchten. Laden Sie die Datei "favicon.ico" ins Hauptverzeichnis Ihrer Website. Fügen Sie bei all Ihren HTML-Dateien folgende Zeile in den Header , unter der Berücksichtigung, dass <ihrewebsite.endung> gemäss den Beispielen angepasst werden muss: <link rel="SHORTCUT ICON" xhref="http://www.<ihrewebsite.endung>/favicon.ico"> Beispiel Ihre Website hat die URL: http://www.iwebdesign.ch Dann ist <ihrewebsite.endung>: iwebdesign.ch Also: <link rel="SHORTCUT ICON" xhref="http://www.iwebdesign.ch/favicon.ico"> Nun noch speichern und auf den FTP-Server laden. Überschreiben Sie die vorhandenen Dateien. Voilà, für Sie endet die Anleitung hier! Bitte beachten Sie, dass Sie evtl. den Browser-Cache löschen müssen, bevor das neue Favicon angezeigt wird. Hat Ihnen diese Anleitung geholfen? Als Dankeschön freuen wir uns über Links auf unsere Website! Anhang Installation des Zusatzmodules für Adobe Photoshop 1. Verschieben Sie das entsprechende Zusatzmodul in den "Dateiformate" Ordner in Ihrem Photoshop Zusatzmodule Ordner: Unter Windows: ICOFormat.8bi Unter Mac OS X/Classic: icoformat Unter 68K MacOS: icoformat(68K) 2. Starten Sie Photoshop neu, falls er bereits geöffnet ist. Speichern von Favicons mit Adobe Photoshop (erfordert das Zusatzmodul) Wenn Sie das Bild erstellt haben und es die Grösse 16x16 Pixel aufweist, können Sie das Bild als Favicon speichern. Vorgehen: Datei -> Speichern unter Wählen Sie aus der Liste *.ico   < zurück   weiter > [ Zurück ]