So fügen Sie benutzerdefinierte Schriftarten auf der WordPress-Website hinzu [2022]

Veröffentlicht: 2022-05-05

Wissen Sie, was der zentrale Teil Ihres Webdesigns ist? Das Hinzufügen einer benutzerdefinierten Schriftart zu einer WordPress-Website ist der ultimative Schritt, den Sie unternehmen können, um Ihre Website-Besucher auf Ihrer Website zu halten und die Lesbarkeit der Website zu verbessern. Die Schriftart, die Sie für die Website wählen, repräsentiert Ihr Markenimage. Lassen Sie uns eintauchen, um mehr über benutzerdefinierte Schriftarten mit Ins und Outs zu erfahren.

custom fonts

Auch wenn Sie online kostenlose Schriftarten finden, können Sie sie basierend auf Ihrer Themenkompatibilität nur verwenden. Aus diesem Grund werden wir erklären, wie Sie benutzerdefinierte Schriftarten in WordPress mithilfe manueller Methoden und WordPress-Plugins hinzufügen.

Warum benutzerdefinierte Schriftarten verwenden und wo sie zu finden sind?

Wie oben erwähnt, finden Sie zahlreiche Seiten, von denen Sie ganz einfach Schriftarten herunterladen können. Beispielsweise enthält Font Squirrel bis zu drei kostenlose Schriftarten, die Sie verwenden können. Google Fonts ist eine weitere erstaunliche Option, bei der Sie mehr als 900 Schriftarten zur Auswahl finden. Abgesehen davon bietet Ihnen Edge Web Fonts auch eine große Auswahl an Schriftarten. Für den persönlichen Gebrauch können Sie sich für Fonts.com oder 1001 Free Fonts entscheiden .

DaFont ist die älteste Schriftartenbibliothek mit über 60.000 Schriftarten, aus denen Sie die gewünschten Schriftarten filtern können. Sie müssen die ausgewählten Schriftarten herunterladen und sind nicht wie die Google Font-Integration. Eine ähnliche Schriftartenbibliothek ist UrbanFont mit einer riesigen Auswahl an kreativen und lukrativen Schriftarten.

custom fonts

Adobe Fonts oder Typekit ist eine sehr praktische Schriftartenbibliothek für alle Webdesigner, da sie über 1900 Schriftarten zur Verfügung stellt. Selbst wenn Sie das kostenlose Konto abonnieren, bietet es immer noch über 200 Webfonts.

Wenn Sie Schriftarten monatlich mieten und eine Abonnementgebühr zahlen möchten, können Sie sich für Fontstand entscheiden . Es bietet rund 2000 erstaunliche Schriftarten und berechnet Ihnen monatlich Gebühren. Genau wie dieses Type Network ist eine weitere selbst gehostete Schriftbibliothek, in der Sie mehr als 400 Schriftfamilien gleichzeitig erhalten und mit Leichtigkeit erkunden können.

Wie wählt man die beste benutzerdefinierte Schriftart für eine Website aus?

Da Sie bereits die Ressourcen kennen, um die gewünschten benutzerdefinierten Schriftarten für WordPress zu finden, müssen Sie jetzt wissen, wie Sie die besten Schriftarten auswählen. Das Herausfiltern zufälliger Schriftarten macht Ihren Auswahlprozess langwierig und ungeschickt. Stattdessen können Sie die folgenden Schritte ausprobieren, während Sie die beste benutzerdefinierte Schriftart für eine WordPress-Website auswählen. In diesem Blog werden wir Google Fonts untersuchen, um die besten Schriftarten auszuwählen und die besten Vorgehensweisen zu sehen, während wir alle Schriftarten filtern.

custom fonts

Shortlist Schriftarten, die Ihnen gefallen – In Google Schriftarten können Sie die gewünschte Schriftart ganz einfach im Suchfeld suchen und die Kategorie festlegen. Das Suchergebnis wird entsprechend Ihrer Einstellung geändert. Sie können die Schriftarten in Alphabeten, numerischen Zahlen und anderen Formaten sehen.

Schriftdetails prüfen – Das Prüfen der Schriftdetails ist wichtig, da Sie alle verfügbaren Stile und Schriftgrößen auf einen Blick sehen. Ein erstaunlicher Vorteil, den Sie bei Google Fonts finden werden, ist, dass es beliebte Kombinationen mit dieser Schriftart anzeigt.

custom fonts

Achten Sie bei der Überprüfung der Schriftdetails auch auf das Schriftformat. Denn nicht alle Schriftarten unterstützen alle Browsersysteme. Hier ist die neueste Liste der Browser und die Liste der unterstützten Schriftformate.

custom fonts

Quelle – https://www.w3schools.com/Css/css3_fonts.asp

Bereichern Sie Ihre Schriftartensammlung – Wenn Sie mit dem Filtern der richtigen Schriftarten fertig sind, können Sie diese Schriftarten zu Ihrer Sammlung hinzufügen, indem Sie einfach auf die Schaltfläche „ Diese Schriftart auswählen“ klicken .

Einfache Methoden zum Hinzufügen benutzerdefinierter Schriftarten zur WordPress-Website

Wir haben einige der einfachsten Möglichkeiten zum Hinzufügen benutzerdefinierter Schriftarten zu Ihrer Website Schritt für Schritt zusammengestellt. Lassen Sie uns eintauchen und sehen, wie es geht.

So fügen Sie benutzerdefinierte Schriftarten in WordPress manuell hinzu

Das manuelle Hinzufügen benutzerdefinierter Schriftarten ist der klügste Weg, um Ihre Website nicht zu verlangsamen. Da Sie bereits einige der Schriftgrößen erkundet haben, um die gewünschte Schriftart zu finden, laden Sie zuerst die Schriftart herunter. Jetzt müssen Sie die Schriftart auf Ihr Website-Hosting-Konto hochladen. Prüfen Sie, welches Theme Sie für Ihre WordPress-Website verwenden. Laden Sie die CSS-Datei Ihrer Schriftart in Ihr Konto hoch. Denken Sie beim Herunterladen der Schriftart daran, die Dateien aus der ZIP-Datei zu extrahieren.

Um deine Schriftdatei hochzuladen, gehe in das Verzeichnis wp-content/themes/your-theme/fonts. Sie können bequem einen separaten Ordner für Schriftarten erstellen. Laden Sie die Datei mit dem Dateimanager auf hPanel hoch. Navigieren Sie nun zu Ihrem WordPress-Konto und klicken Sie auf die Option Aussehen . Wählen Sie den Design-Editor, wo Ihnen die style.css-Datei angezeigt wird. Fügen Sie den folgenden Code am Ende des Codes hinzu.

@font-face {

Schriftfamilie: Aguafina Script-Regular;

src: URL ( http://test-site.com/wp-content/themes/twentynineteen/fonts/AguafinaScript-Regular.ttf );

Schriftstärke: normal;

}

Klicken Sie nun auf die Schaltfläche „Datei aktualisieren“, um die Änderungen zu speichern. Denken Sie daran, dass der Font-Face-Code die Schriftart jedes Mal lädt, wenn ein Besucher Ihre Website besucht. Die Schriftart muss jedoch noch auf irgendein Element angewendet werden. Sie müssen dieselbe style.css-Datei ändern, um einem bestimmten Element eine Schriftart zuzuweisen. Der folgende Code würde beispielsweise dafür sorgen, dass die Überschrift unserer Website das Schriftskript verwendet.

.site-title {

Schriftfamilie: „Aguafina Script-Regular“ , Arial, serifenlos;

}

So legen Sie benutzerdefinierte Schriftarten mit WordPress-Plugins fest

Für alle WordPress-Benutzer ist die Verwendung von Schriftart-Plugins die einfachste Möglichkeit, benutzerdefinierte Schriftarten festzulegen. Hier haben wir einige der einfachsten und nützlichsten Schriftart-Plugins vorgestellt, um benutzerdefinierte Schriftarten auf der WordPress-Website hinzuzufügen.

WP Google Fonts

custom fonts

Sie können benutzerdefinierte Schriftarten verwenden und sie mit dem Plugin WP Google Fonts auf bestimmte CSS-Elemente anwenden . Installieren Sie das WP Google Fonts-Plugin aus dem WordPress-Plugin-Verzeichnis und verwenden Sie Ihr WordPress-Dashboard, um auf das Google Font Control Panel zuzugreifen. Sie können Schriftarten auswählen und Optionen wie Schriftstil, zugewiesene Elemente und mehr anpassen.

Schriftarten-Plugin

custom fonts

Das Fonts-Plug- in ist eine Freemium-Alternative zu Easy Google Fonts, die auf ähnliche Weise funktionieren und es Ihnen ermöglichen, Google Fonts reibungslos in Ihre Seiten zu integrieren, ohne Ihr Design ändern zu müssen. Es funktioniert auch mit dem Customizer, sodass Sie alternative Schriftartoptionen ausprobieren können, bevor Sie sie veröffentlichen. Das Fonts Plugin hat auch eine Adobe Fonts-Integration, was ein Bonus ist. Mit dem Fonts-Plug-in können Sie auch die Schriftartenbibliothek von Adobe in Ihrem Material verwenden.

Erstellen Sie eine ansprechende Website mit benutzerdefinierten Schriftarten

Die Lesbarkeit und Eleganz Ihres Textes haben einen Einfluss darauf, wie gerne Ihre Besucher auf Ihrer Website surfen. Jeder kann jetzt aus einer großen Anzahl von Schriftarten auswählen, die er auf seiner Website verwenden möchte. Es gibt keinen Grund, warum Sie heutzutage eine alte Schriftart auf Ihrer Website verwenden sollten. Das Anpassen Ihrer WordPress-Typografie liegt jetzt vollständig in Ihrer Kontrolle.

Wenn Sie diesen Blog ansprechend und hilfreich finden, abonnieren Sie unseren Blog , um weitere Blogs wie diesen zu lesen. Treten Sie unserer Community bei, um auch Ihre Gedanken zu teilen.