So fügen Sie Ihrer WordPress-Site eine Offline-Schriftart hinzu
Veröffentlicht: 2022-10-31Wenn Sie Ihrer WordPress-Site etwas mehr Persönlichkeit verleihen möchten, sollten Sie in Betracht ziehen, eine Offline-Schriftart zu laden. Obwohl es viele Möglichkeiten gibt, dies zu tun, zeigen wir Ihnen eine der einfachsten Methoden mit dem Font Squirrel Webfont Generator. Sobald Sie Ihre Schriftartdateien heruntergeladen haben, können Sie sie auf Ihre WordPress-Site hochladen und sie wie jede andere Schriftart verwenden. Lass uns anfangen!
Dieser Artikel lag schon seit geraumer Zeit auf meinem Schreibtisch und ich wollte ihn mit Ihnen teilen. Google Fonts werden vollständig lokal geladen. Ich verwende bisher die Google Fonts Oswald und Lato von Crunchify.com. Öffnen Sie einfach die URL im obigen Bild, die in der neuen Registerkarte erscheint, und Sie werden feststellen, dass 14 neue Schriftarten generiert wurden. Dieses Tutorial hilft auch, wenn Sie eine der folgenden Fragen haben. Nachdem Sie die Datei Lato.zip extrahiert haben, können Sie alle zehn Schriftarten von Lato mit der Erweiterung .ttf sehen. Auf den meisten Websites benötigen Sie nur normale, fette und kursive Schriftarten.
In Schritt 2 müssen Sie nun Ihre Schriften in die Formate woff2, eot,svg, ttf und wof umwandeln. Auf die Seite https://Font-Converter.net/en kann eine Datei hochgeladen werden, die die Schriftart in diese Formate konvertiert. Mehr muss man nicht sagen. Sie können jetzt Schriftarten aus Ihrem lokalen Dateisystem laden.
Wie füge ich benutzerdefinierte Schriftarten zum WordPress-Design hinzu?

Es gibt verschiedene Möglichkeiten, benutzerdefinierte Schriftarten zu Ihrem WordPress-Theme hinzuzufügen. Eine Möglichkeit ist die Verwendung der Google Fonts-Bibliothek. Eine umfassende Liste aller verfügbaren Schriftarten finden Sie auf der Website von Google Fonts. Sobald Sie eine Schriftart gefunden haben, die Ihnen gefällt, können Sie den Code zum Stylesheet Ihres Designs (style.css) hinzufügen. Wenn Sie beispielsweise die Schriftart „Open Sans“ verwenden möchten, fügen Sie Ihrem Stylesheet den folgenden Code hinzu: body { font-family: 'Open Sans', sans-serif; } Eine andere Möglichkeit, benutzerdefinierte Schriftarten zu Ihrem WordPress-Design hinzuzufügen, ist die Verwendung eines Plugins wie Easy Google Fonts . Dieses Plugin macht es einfach, benutzerdefinierte Schriftarten zu Ihrem Design hinzuzufügen, ohne Code bearbeiten zu müssen.
Das Easy Google Fonts-Plugin kann verwendet werden, um benutzerdefinierte Schriftarten zu Ihrer WordPress-Site hinzuzufügen. Auf diese Weise können Sie durch die Verwendung einer Vielzahl von Schriftarten auf Ihre Website aufmerksam machen. In der Forschung hat sich gezeigt, dass Typografie eine Reihe von Vorteilen hat. Eine einfache Website erleichtert es Ihren Kunden, mit Ihnen zu kommunizieren. Durch die Verwendung von CSS-Eigenschaften können Sie den Stil und die Positionierung Ihrer bevorzugten Schriftart zusätzlich zum Ändern des Stils und der Positionierung ändern. Zusätzlich zu Ihren eigenen Schriftsteuerelementen können Sie diese über die Einstellungsseite des WordPress-Plugins hinzufügen. Wenn Sie kein Plugin verwenden möchten, können Sie dieses anstelle von Adobe Fonts verwenden.
Installieren Sie das Plug-in „Custom Adobe Fonts“, um diese Schriftarten einfach in Ihre WordPress-Site zu integrieren. Installieren Sie das Plugin und navigieren Sie dann zu Adobes umfangreicher Schriftartenbibliothek, um eine Schriftart zu finden, die für Sie geeignet ist (Sie müssen sich registrieren, um sie zu verwenden). Nachdem Sie eine Schriftart ausgewählt haben, klicken Sie darauf und suchen Sie dann in der oberen rechten Ecke der Seite nach „Zum Webprojekt hinzufügen“. Mit Font Pair können Sie sehen, wie Ihre Schriftartkombinationen aussehen, und Sie können Schriftarten basierend auf dem, was Sie sehen, mischen und anpassen. Es gibt mehrere ausgezeichnete Websites, die benutzerdefinierte Schriftarten verkaufen, die vom Designer selbst erstellt wurden. Der Schriftart Squirrel liegt eine große Schriftbibliothek bei, die zudem einfach zu implementieren ist. Sie können das Webfonts-Kit von @Font-Face verwenden.
Ihre WordPress-Website sollte jetzt einsatzbereit sein. Das Kit enthält die Schriftdatei sowie ein Stylesheet, das den Code enthält, den Sie zum Erstellen Ihres eigenen CSS-Stylesheets benötigen. Beispielsweise müssten wir das folgende CSS für die Schriftart OpenSans-ExtraBold- web verwenden. Die beste Lösung besteht darin, alle Schriftdateien an einem Ort Ihrer Wahl zu speichern.
So laden Sie Google-Schriftarten in WordPress
Navigieren Sie zum WordPress-Adminbereich und wählen Sie Neu hinzufügen. Laden Sie Easy Google Fonts aus dem Google Play Store herunter und installieren Sie es. Nach der Installation des Plugins müssen Sie auf die Schaltfläche Aktivieren klicken, um es zu verwenden.

Auf Ihrer Website oder Ihren digitalen Produkten können Sie Google Fonts verwenden, um mit über 1000 verschiedenen Schriftfamilien zu experimentieren. Wenn Sie Google-Schriftarten manuell zu Ihrer WordPress-Site hinzufügen möchten, gibt es mehrere Möglichkeiten. Sie sind kostenlos und Open Source, sodass sie von jedem Entwickler verwendet werden können. Die bequemste Art, Google-Schriftarten zu integrieren, besteht darin, ein Snippet mit der URL zu der spezifischen Schriftfamilie in Ihre Datei functions.php aufzunehmen. Wenn Sie den manuellen Prozess schwierig finden, können Sie ein Plugin verwenden. Sie können das Plugin zuerst installieren, indem Sie das WordPress-Plugin-Repository besuchen. Es muss nun installiert und aktiviert werden.
Die meisten WordPress-Themes enthalten die Integration von Google-Schriftarten als Teil ihrer Standardeinstellungen. Die Plugins, aus denen die OMGF-Plattform besteht, ermöglichen es Ihnen, über 600 Schriftarten auf Ihrer Website zu durchsuchen. Im Dropdown-Menü „Schriftfamilie“ können Sie aus über 100 verschiedenen Typen für verschiedene Bereiche Ihrer Website auswählen. Wie in der Customizer-Vorschau gezeigt, gibt es mehrere Optionen zum Hinzufügen benutzerdefinierter Schriftsteuerelemente .
Sollte ich Google Fonts lokal WordPress laden?
Wenn Ihre WordPress-Site Google-Font-Fehler aufweist, sollten Sie Google-Fonts lokal laden, um sie zu beheben. Es gibt einige externe Ressourcen und Skripte, die Sie nicht kontrollieren können, was es unmöglich macht, sie zu komprimieren, zu minimieren oder zu optimieren. Ihre WordPress-Geschwindigkeit wird stark beeinträchtigt, wenn Sie diese Vorsichtsmaßnahmen nicht treffen.
Wp-content/themes/your-theme/fonts
Im Ordner wp-content/themes/your-theme/fonts kannst du alle benutzerdefinierten Schriftarten speichern, die du mit deinem Design verwenden möchtest. Schriftarten können diesem Ordner per FTP oder mithilfe eines Dateimanager-Plugins hinzugefügt werden. Sobald Schriftarten zu diesem Ordner hinzugefügt wurden, können sie im CSS Ihres Designs verwendet werden, indem auf den Schriftartnamen verwiesen wird.
Global Styles kann verwendet werden, um die Schriftart Ihrer Website zu ändern, wenn sie eines der folgenden Themen verwendet. In diesem Fall befinden sich die Schriftarten für Basis und Überschriften in demselben Schriftartenpaar. Um die neuen Schriftpaare zu speichern, klicken Sie im Menü „Globale Stile“ auf die Schaltfläche „Veröffentlichen“ oder klicken Sie auf „Zurücksetzen“, um die Änderungen rückgängig zu machen. Nachdem Sie die geeigneten benutzerdefinierten Schriftarten ausgewählt haben, können Sie sie beliebig oft ändern. Wenn Sie die Größe Ihrer Überschrift oder der Basisschriftarten ändern möchten, können Sie dies tun, indem Sie die Größenoption unten und rechts neben jeder Schriftart auswählen und dann eine Größe aus dem Dropdown-Menü auswählen. Mit benutzerdefiniertem CSS können Sie die globale Standardschriftgröße ändern. Stellen Sie sicher, dass Sie ein Plugin deaktivieren oder löschen, wenn Sie sich entscheiden, es nach dem Testen nicht mehr zu verwenden. Es ist nicht möglich, ein Typekit.com-Konto mit einem WordPress.com-Blog oder einer Website zu verknüpfen. Wenn Sie die Kompatibilität einer bestimmten Schriftart mit einer bestimmten Sprache testen möchten, verwenden Sie den Customizer.
Schriftarten ohne Plugin zu WordPress hinzufügen
Es gibt einige Möglichkeiten, Schriftarten ohne Plugin zu WordPress hinzuzufügen. Eine Möglichkeit ist die Verwendung der Google Fonts-Bibliothek. Rufen Sie einfach die Website von Google Fonts auf, wählen Sie die Schriftart aus, die Sie verwenden möchten, und kopieren Sie dann den bereitgestellten Code. Öffnen Sie als Nächstes Ihr WordPress-Dashboard und gehen Sie zu Aussehen > Anpassen. Klicken Sie dann auf die Registerkarte „Zusätzliches CSS“ und fügen Sie den Code ein, den Sie von Google Fonts kopiert haben. Speichern Sie Ihre Änderungen und die neue Schriftart wird auf Ihre Website angewendet.
Themes müssen keine Webfonts in ihren Standardeinstellungen enthalten. Während Sie auf einer Webseite surfen, können Sie sie mit Ihrem Browser herunterladen. Um den Schriftartencode zu kopieren und in Ihre Designdatei einzufügen, wählen Sie einfach die gewünschte Schriftart aus. Sie können mehrere Schriftarten gleichzeitig verwenden und sehen, wie lange die Schriftarten geladen werden. Fügen Sie Ihrem WordPress-Blog mehr CSS hinzu, indem Sie zum WordPress-Blog-Dashboard gehen. Kopieren Sie den gesamten Code aus dem grauen Feld 1 in den Webfont des Fließtextes. Die neue Webfont-Familie finden Sie im zweiten grauen Kasten der Google-Fontbibliothek . Zusätzlich kann mit folgendem Code die Schriftgröße und Schriftstärke angepasst werden.