So fügen Sie Ihrer WordPress-Website ein Favicon hinzu - Moyens I/O

So fügen Sie Ihrer WordPress-Website ein Favicon hinzu

Sie haben wahrscheinlich bemerkt, dass die meisten Websites ein kleines Symbol (normalerweise das Logo der Website) in der oberen linken Ecke ihres Browser-Tabs haben. Dies wird als Favicon bezeichnet. Abgesehen davon, dass Sie Benutzern helfen, Ihre Website in ihrem Browser wiederzuerkennen und so die Benutzererfahrung zu verbessern, das Favicon ist auch eine wesentliche Form des Brandings. Indem Sie Ihrer Site ein Favicon hinzufügen, stellen Sie sicher, dass Benutzer Ihre Site von anderen Sites unterscheiden können, die sie möglicherweise besuchen, und Sie stellen eine Verbindung zwischen dem Favicon-Bild und Ihrer Marke her.

Wenn Sie uns fragen, ist das Einstellen Ihres WordPress-Favicon eines der ersten Dinge, die Sie nach der Installation Ihres WordPress-Themes tun sollten. Heute zeigen wir Ihnen, wie Sie Ihrer WordPress-Website ein Favicon hinzufügen.

So erstellen Sie ein Favicon

Das Wichtigste zuerst, wir sollten uns damit befassen, wie Sie Ihr Favicon erstellen können. Wenn Sie eine schnelle Lösung suchen, Sie können ein Favicon mit einem Online-Favicon-Generator erstellen. Plattformen wie Favicon- und App-Symbolgenerator dich lassen Wählen Sie ein Bild von Ihrem Computer im .jpg-, .png- oder .gif-Format aus und konvertieren Sie es dann in das .ico-Format. Wenn Sie kein bereits vorhandenes Bild haben, können Sie auch die Symbolgalerie nach Schlüsselwörtern, Buchstaben oder Farben durchsuchen und dann ein Bild herunterladen oder bearbeiten, das Ihnen gefällt.

Eine weitere großartige Website zum Generieren von Favicons ist favicon.cc. Auf dieser Plattform können Sie nicht nur Ihr Bild importieren oder eines ihrer eigenen auswählen, sondern auch ein neues Favicon von Grund auf neu erstellen.

Wenn Sie keine Online-Favicon-Generatoren verwenden möchten, können Sie jederzeit Photoshop oder Gimp verwenden, um entweder ein Favicon zu erstellen oder die Größe eines vorhandenen Bildes zu ändern. Denken Sie nur daran, dass WordPress erfordert die Abmessungen für Ihr Favicon-Bild müssen mindestens 512 × 512 Pixel betragen.

Bei den Formaten ist zu beachten, dass das .ico-Format generell zur Generierung von Favicons verwendet wird. Aber Seit der Veröffentlichung von WordPress Version 4.3 hat WordPress eine Site Icon-Funktion implementiert, die alles für Sie generiert. Das bedeutet, dass Sie, wenn Sie die Version 4.3 von WordPress (oder höher) verwenden, keine .ico-Datei selbst erstellen müssen und stattdessen ein .gif-, .jpeg- oder .png-Bild hochladen können. WordPress konvertiert es dann in das .ico-Format und generiert alle erforderlichen Abmessungen (stellen Sie nur sicher, dass das von Ihnen hochgeladene Originalbild 512 x 512 Pixel groß ist).

Verwandt :  Die 7 besten Slider-Plugins für WordPress

Wenn Sie jedoch noch eine WordPress-Version älter als 4.3 verwenden, müssen Sie Ihr Favicon manuell zu WordPress hinzufügen (worüber wir später mehr sprechen).

Wie man ein Favicon zu WordPress hinzufügt

Nachdem Sie Ihr Favicon erstellt haben, können Sie es zu Ihrer WordPress-Site hinzufügen. Das erste, was Sie tun sollten, ist zu Ihrem Admin-Panel zu gehen und Klicken Sie auf Aussehen > Anpassen.

WordPress-Farben anpassen

Von dort, Site-Identität auswählen.

WordPress-Site-Identität

Hier können Sie das Bild auswählen, das Sie als Site-Symbol verwenden möchten.

Wähle das Bild aus

Falls Ihr Bild die empfohlene Größenbeschränkung überschreitet, können Sie es mit WordPress zuschneiden. Um dies zu tun, klicke auf Bearbeiten Bild.

Beschneide dein Bild

Sobald Sie mit dem Zuschneiden fertig sind (was Sie tun können, indem Sie auf Ihr Bild klicken und es mit dem Mauszeiger ziehen), wähle aus Ernte Taste und dann drücke Speichern.

Auf der rechten Seite des Bildschirms haben Sie außerdem die Möglichkeit, Ihr Bild zu skalieren, und im Bild zuschneiden können Sie sogar die gewünschten Bildabmessungen eingeben und das Seitenverhältnis manuell festlegen.

Vergessen Sie nicht, auf die Schaltfläche zu klicken Aktualisieren Taste, wenn Sie fertig sind.

Ernte
Wählen Sie die Schaltfläche Zuschneiden und klicken Sie dann auf Speichern

Und das war’s – Sie haben Ihr Favicon erfolgreich in WordPress hochgeladen.

Hinzufügen eines Favicon zu einer älteren Version von WordPress (4.3 oder weniger)

Obwohl wir Ihnen empfehlen, Ihre Website immer mit der neuesten Version von WordPress zu aktualisieren, müssen Sie Ihr Favicon manuell zu Ihrer WordPress-Site hinzufügen, wenn Sie zufällig eine ältere Version als 4.3 verwenden.

Das Wichtigste zuerst, Sie müssen eine .ico-Datei mit einem der oben genannten Online-Generatoren generieren. Als nächstes solltest du Laden Sie Ihre favicon.ico-Datei per FTP in das Stammverzeichnis Ihrer Website hoch. Wenn Sie sich nicht sicher sind, wie das geht, lesen Sie unbedingt unseren FTP-Einsteigerleitfaden.

Wir sollten erwähnen, dass es einige Diskussionen darüber gibt, ob das Favicon dem Stammverzeichnis oder dem Themenordner (oder beiden) hinzugefügt werden sollte. In jedem Fall empfehlen wir Ihnen, es zumindest in das Stammverzeichnis hochzuladen, da dadurch Ihr Favicon in Feedreadern angezeigt wird.

Vergessen Sie nicht, in Ihrem Header auf den Dateispeicherort des Favicons zu verlinken, da dies eine Garantie dafür ist, dass alle Browser es finden können. Dazu müssen Sie Verwenden Sie ein HTML-Link-Tag in der header.php-Datei Ihres Themes, um den Code hinzuzufügen. Sie finden Ihre header.php-Datei unter Aussehen > Theme-Editor und dann suchen Sie es in der Themendateien Abschnitt rechts.

Erscheinungsbild des WordPress-Theme-Editors
Auffinden im Abschnitt Theme-Dateien

Der Code sollte zwischen den <head> und </head> Stichworte:

Code zwischen den Kopf-Tags hinzugefügt
1.
Wenn Sie auf das Favicon in Ihrem Stammverzeichnis verlinken möchten, sollten Sie diesen Code verwenden (ändern Sie einfach die URL und den Namen der Favicon-Datei an Ihren eigenen):
<link rel="icon" type="image/x-icon" href="http://www.yourdomain.com/favicon.ico">
2.
Wenn Sie den Link zum Favicon in Ihrem Theme-Ordner hinzufügen möchten, fügen Sie einfach diesen Code zum Head-Tag hinzu (ändern Sie einfach den Namen der Favicon-Datei, falls erforderlich):
<link rel="icon" type="image/x-icon" href="https://qodeinteractive.com/magazine/add-favicon-wordpress/<?php echo get_stylesheet_directory_uri(); ?>/favicon.ico">
Verwandt :  So verifizieren Sie Ihre WordPress-Site auf Pinterest

Hinzufügen eines Favicon zu WordPress mit Hilfe eines Plugins

Falls Sie Ihr WordPress-Favicon mit einem Plugin hinzufügen möchten, können Sie dies durch die Installation tun Favicon von RealFaviconGenerator. Dieses Plugin ist einfach zu bedienen und hilft Ihnen, ein Favicon für verschiedene Geräte wie Desktop, Android, iPhone und iPad zu erstellen und einzurichten.

Favicon von RealFaviconGenerator

Nachdem Sie das Plugin installiert und aktiviert haben, gehen Sie zu Aussehen > Favicon und klicken Sie dann auf „Aus der Medienbibliothek auswählen“ Taste.

Einstellungen des Favicon-Plugins
Favicon-Plugin

Auch wenn Sie ein Bild von mindestens 512 × 512 px hochladen sollten, wenn Sie ein Favicon über das hinzufügen Anpassen Bildschirm, erfordert das Favicon by RealFaviconGenerator-Plugin, dass Sie ein Bild hochladen mindestens 70×70 px groß, vorzugsweise 260×260 px.

Nachdem Sie Ihr Bild ausgewählt haben, klicken Sie auf Favicon erstellen.

Favicon mit Plugin erstellen

Von da an werden Sie auf die RealFaviconGenerator-Website weitergeleitet. Dort angekommen musst du ganz nach unten scrollen und auswählen Generieren Sie Ihre Favicons und HTML-Code:

Generieren Sie Ihre Favicons

Nach kurzer Zeit werden Sie zu Ihrer WordPress-Site zurückgeleitet und Sie sehen eine Nachricht auf Ihrem Dashboard, die Sie darüber informiert, dass Ihr Favicon eingerichtet ist.

Favicon ist fertig

Außerdem erhalten Sie hier eine Vorschau, wie Ihr Favicon auf verschiedenen Geräten aussieht:

So sieht Ihr Favicon auf verschiedenen Geräten aus

Abschluss

Und das fasst den Prozess des Hinzufügens eines Favicons zu Ihrer WordPress-Website zusammen. Wie aus den oben vorgestellten Schritten hervorgeht, ist der Rest des Prozesses wirklich ein Kinderspiel, sobald Sie das Design gefunden haben, das Sie oder Ihre Marke am besten repräsentiert.

Moyens Staff
Moyens I/O-Personal. motivierte Sie und gab Ratschläge zu Technologie, persönlicher Entwicklung, Lebensstil und Strategien, die Ihnen helfen werden.