Mit dem WordPress Update 4.3 „Billie“ ist es Benutzern nun fernab von Plug-ins direkt im Backend möglich, Website-Icons hinzuzufügen. Wie genau das funktioniert und was ein Website-Icon eigentlich besonders macht, erklären wir Ihnen in diesem Beitrag.
Inhalt
Was sind Website-Icons?
Website-Icons sind ein kleiner und praktischer Zusatz für Ihre Website, der ihr einen spürbaren Wiedererkennungswert gibt. Im Browser sorgen Icons (auch Favicons genannt) in den Tabs dafür, dass wir schnell wissen, wo wir welche Inhalte geöffnet haben. Als Lesezeichen abgespeichert, prägen sich Besucher die Website-Icons schnell ein und wissen, welcher Website, welches Icon besitzt. Es ist also sehr empfehlenswert, das eigene Logo angepasst als Icon zu nutzen und so einen Wiedererkennungswert bei seinen Besuchern zu schaffen.
Aber auch für mobile Benutzer, die Ihre Website regelmäßig über ihr Smartphone erreichen wollen, ist das Website-Icon von Vorteil. Legen regelmäßige Besucher Ihrer Website Ihre Website auf ihrem Home-Bildschirm als Icon ab, um jederzeit einen schnellen Zugriff zu haben, können Sie mit dem Website-Icon das Aussehen professionalisieren.
Und so geht es
Um nun Ihrer eigenen Seite dieses kleine Extra zu verpassen, müssen Sie dank des neuen Updates von WordPress gar nicht mehr viel unternehmen. Zunächst suchen Sie die zentrale Anpassungsfunktion in WordPress auf. Diese erreichen Sie entweder, indem Sie in der Hauptebene der Toolbar auf „Anpassen“ klicken, oder im Backend unter Design → Anpassen aufsuchen. Beides erfordert wenige Klicks.
Nun befinden Sie sich bei den Anpassungsfunktionen. Da es hier um ein Icon für die Website geht, ist diese Einstellung unter den Website-Informationen zu finden.
In diesem Bereich können Sie den Titel der Website, einen Untertitel und wie erwartet das Website-Icon anpassen. Hier wählen Sie nun „Datei auswählen“.
Das folgende Fenster ist das Bildupload-Fenster, in welchem Sie mehrere Dinge beachten sollten. Zunächst werden Sie darauf hingewiesen, dass das Bild, welches Sie hochladen, nicht kleiner als 512px (Höhe und Breite) sein darf, größer ist hingegen in Ordnung. Achten Sie auf die Datengröße Ihrer Datei.
Nun haben Sie drei Möglichkeiten Ihr Bild hochzuladen:
- Sie haben es zuvor in die Mediathek geladen und müssen es nun nur noch auswählen.
- Sie ziehen es aus Ihrem Ordner per Drag-and-Drop in dieses Fenster.
- Sie wählen das Bild nach einem Klick auf den „Dateien auswählen“ Button in Ihrem Ordner aus.
Ist das soeben gewählte Bild größer als 512px zu 512px, gibt Ihnen WordPress nun die Möglichkeit, einen passenden Bildausschnitt für Ihr Website-Icon aus diesem Bild auszusuchen. Rechts erhalten Sie bereits eine Vorschau Ihres Icons, wie es als Browser und als App-Icon bei iOS/Android erscheinen wird. Sobald Sie zufrieden mit dieser Vorschau sind, dürfen Sie gerne auf „Bild zuschneiden“ klicken.
Nun erscheint Ihr Website-Icon auch unter Website-Informationen. Zu guter letzt drücken Sie auf „Speichern & Publizieren“ und Ihr Icon erscheint Ihren Besucher.
Ein Extra: Das Add to home screen WP Plugin
Da Sie nun ein funktionierendes Website-Icon besitzen, welches auch von mobilen Benutzern als Home-Bildschirm Icon verwendet werden kann, zeigen wir Ihnen hier noch ein sehr praktisches Plug-in, welches gut in Verbindung mit der neuen Funktion von WordPress funktioniert. Das „Add to home screen WP Plug-i“ sorgt dafür, dass die mobilen Besucher Ihrer Website aufgefordert werden, diese als Icon zum Hauptbildschirm ihres Smartphones hinzuzufügen.
Installieren Sie das Plug-in bei WordPress und aktivieren es. Das ist alles, was Sie unternehmen müssen, damit diese Funktion auf Ihrer Website ermöglicht ist. Im Dashboard → Plug-ins → Installierte Plug-ins können Sie bei dem neuen Plug-in natürlich noch Änderungen an den Optionen vornehmen, damit diese Aufforderung Ihren Wünschen entspricht.
Wer braucht jetzt noch eine eigene App?
1 Kommentar. Wir freuen uns über Ihren Kommentar
Hallo – danke für den Beitrag. Gibt es noch eine alternative für das Plugin “Add to home screen WP Plugin”? Denn das klappt leider nur für IOS Geräte.