In diesem 101 WordPress Tutorial von Host Europe geben wir Ihnen einen grundlegenden Überblick über das Thema Typografie und wir zeigen Ihnen, welche drei einfachen und schnellen Möglichkeiten Sie haben, Schriftarten in WordPress zu verändern. Und das Schritt für Schritt.

Wichtige Informationen zu WordPress Schriftarten vorab

Es gibt viele Möglichkeiten, Schriftarten in WordPress zu ändern. Das Gute: Sie müssen kein Programmierer sein. Wir schauen uns drei einfache und sichere Möglichkeiten an:

  1. Die Schriftart über das aktive Theme zu bearbeiten.
  2. Die Schriftart über ein Plugin hinzufügen.
  3. Die Schriftart über eine CSS File hinzufügen.

Große Auswahl an günstigen Domain-Endungen – schon ab 0,08 € /Monat
Jetzt Domain-Check starten

Schriftart in WordPress ändern #1 – Schriftart über das aktive Theme bearbeiten

Die erste Möglichkeit besteht darin, die Schriftart über das aktive Theme zu bearbeiten.

Die meisten Premium-WordPress-Themes bieten Ihren Zugriff auf die gesamte Suite von Google-Schriftarten. Schauen wir uns also an, wie dies mit dem aktuellen Theme möglich ist. Gehen Sie zu “Design”, “Customizer” und “Typografie”.

Hier haben Sie eine Reihe an tollen Optionen für das Schriftarten-Typografie-Styling Ihres Textes auf der Website, einschließlich eines Dropdown-Menüs, in dem Sie zwischen einer Vielzahl von Google-Schriften wählen können. Auch die Farbe und die Größe können Sie hier schnell und einfach ändern.

Schriftart in WordPress ändern #2 – Schriftart über Plugin hinzufügen und bearbeiten

Die zweite Möglichkeit ist die Bearbeitung mit einem Plugin.

Wenn das Theme zum Beispiel nicht über verschiedene Schriftarten verfügt, können Sie dies mit einem Plugin dennoch bearbeiten. Gehen Sie auf “Plugins” und suchen Sie nach dem Plugin Google Fonts Typografie. Installieren und aktivieren Sie das Plugin. Hiermit haben Sie Zugriff auf die Schriftbibliothek von Google. Ein solches Plugin ist die einfachste Methode, um eine Schriftart in WordPress zu ändern, wenn das Theme dies nicht bereits zulässt. Auch hier können Sie die Schriftarten ändern, Farben verstellen und die Größe anpassen.

Schriftart in WordPress ändern #3 – Schriftart über eine CSS File hinzufügen und bearbeiten

Die dritte und letzte Möglichkeit, die wir uns anschauen, ist die Bearbeitung über eine CSS-File.

Wenn Sie sich beim Bearbeiten von Codes wohlfühlen, können Sie Schriftarten in WordPress auch manuell ändern. Um eine neue Schriftart in WordPress per Code hinzuzufügen, benötigen Sie die Schriftartdatei, die Sie mit Grundkenntnissen über CSS und einem FTP-Zugriff über einen Client wie die FileZilla verwenden möchten.

Google Fonts für WordPress

Der erste Schritt in diesem Prozess besteht darin, den Link zu Ihrer Schriftarten zu kopieren. Sie können die gewünschte Schriftart bei Google downloaden. Kopieren Sie den Abschnitt Ihrer gewünschten Schriftart.

Nun gehen Sie auf Ihre FTP File im Stammverzeichnis des Child-Theme und öffnen die functions.php.

Geben Sie dann den folgenden Code ein und ersetzen Sie den Link durch den Code für Ihre gewählte Schriftart.

function add_my_font() {
wp_enqueue_style( 'add_my_font', 'https://fonts.googleapis.com/css2?family=
Staatliches&display=swap', false );
}
add_action( 'wp_enqueue_scripts', 'add_my_font' );

Sie müssen jetzt „deklarieren“, wo Ihre Schriftart verwendet werden soll. Dazu öffnen Sie die style.css und fügen folgenden Code hinzu:

.body, h1, .h2, .h3, .h4 {
font-family: 'Staatliches', sans-serif;}

Nun fügen Sie den Namen Ihrer Schriftart ein. Dieser Code sagt Ihrem Frontend im Wesentlichen, dass Sie diese bestimmte Schriftart verwenden möchten.

Beachten Sie, dass Sie einige dieser Deklarationen entfernen könnten, wenn die neue Schriftart nur für bestimmte Abschnitte gelten soll.

Wichtiger Datenschutz-Hinweis: Das Landgericht München hat am 20.01.2022 geurteilt, dass die Verwendung von Google Fonts über die Fonts API nicht mehr datenschutzkonform ist. Daher empfehlen wir, externe Schriftarten wie Google Fonts serverseitig einzubinden. Siehe Datenschutz und Informationsfreiheit, FAQ zu Cookies und Tracking 2.4.

Fonts von Drittanbietern für WordPress

Wenn Sie mit einer Schrift von einem Drittanbieter arbeiten, sind dies die gleichen Schritte. Laden Sie Ihre gewünschte Schrift und kopieren Sie die Schriftdateien. Schauen Sie im Theme, ob Sie einen Schriftordner haben und falls nichts, legen Sie einen an. Nun gehen Sie auf die style.css und geben Sie diesen Block-Code ein:

<p>@font-face { </p> font-family: Kind Of Rock;
src:url(http://test-site.com/wp-content
/themes/twentytwenty/fonts/Kind Of Rock.ttf);
font-weight: normal; }

Wechseln Sie die Namen im aktuellen Theme und der Schriftart gegen das aktuelle Theme und der heruntergeladenen Schrift aus.

Sie müssen jetzt wieder „deklarieren“, wo Ihre Schriftart verwendet werden soll und folgenden Code hinzufügen. Geben Sie den Namen Ihrer gewünschten Schriftart ein.

.body, .h1, .h2, .h3, .h4 {
font-family: 'Kind Of Rock', sans-serif;}

Wie Sie Schriftart in WordPress ändern – Zusammenfassung

Fassen wir noch einmal zusammen. Sie haben drei Möglichkeiten kennengelernt, wie Sie die Schriftart in WordPress verändern können. Über das aktive Theme, über ein Plugin oder über eine CSS File.

Wir hoffen, dass Ihnen das Tutorial geholfen und gefallen hat. Wenn Sie weitere Fragen zu WordPress haben, so gehen Sie auf unseren Blog oder schauen Sie sich unsere anderen 101 WordPress-Tutorials von Host Europe an.

Sie möchten schnell und einfache eine sichere WordPress-Webseite einrichten? Sie suchen eine zuverlässige Hosting-Lösung für Ihre bestehende Webseite? Die Lösung: Managed WordPress von Host Europe schon ab 2,99€ pro Monat. Selbstverständlich mit kostenlosem SSL-Zertifikat und täglichem Malware-Scan. Mehr zu den WordPress Hosting-Produkten von Host Europe.

Die wichtigen Links und weitere Informationen finden Sie hier:

Unsere WordPress-Video-Tutorials im Überblick

FAQ zum Thema: Wie Sie die Schriftart in WordPress ändern

Warum ist die Wahl der Schriftart so wichtig für Webseiten?

Eine gute Typografie verbessert zum einen die Lesbarkeit und Benutzerfreundlichkeit einer Webseite. Optisch klare und gut strukturierte Texte helfen den Besuchern, Informationen schnell und effizient zu erfassen. Außerdem trägt Typografie wesentlich zum Gesamtdesign und zur Ästhetik einer Webseite bei. Sie kann die Markenidentität stärken und die gewünschte Stimmung oder den Charakter einer Website vermitteln. Typografie ist nicht nur ein Designelement, sondern ein wesentliches Werkzeug, um die Effektivität und den Erfolg einer Webseite zu maximieren.

Wie wirkt sich die Schriftart auf die Ladezeiten meiner WordPress-Seite aus?

Die Wahl der Schriftart in WordPress kann die Ladezeiten beeinflussen. Schriftarten, besonders wenn sie von externen Quellen wie Google Fonts geladen werden, können zusätzliche Anfragen an den Server senden, was die Ladezeit erhöht. Um die Performance zu optimieren und gleichzeitig DSGVO-konform zu bleiben, empfiehlt es sich, externe Schriftarten grundsätzlich lokal einzubinden.

Kann ich mehrere Schriftarten auf einer WordPress-Seite verwenden?

In WordPress können Sie problemlos mehrere Schriftarten auf einer Seite verwenden. Es ist jedoch wichtig, ein harmonisches und konsistentes Design zu bewahren. Zu viele verschiedene Schriftarten können das Design überladen und einen unprofessionellen Eindruck vermitteln.

Wie stelle ich sicher, dass meine gewählte Schriftart auf allen Geräten und Browsern korrekt angezeigt wird?

Um die konsistente Darstellung Ihrer Schriftart in WordPress auf verschiedenen Geräten und Browsern sicherzustellen, sollten Sie Web-Schriftarten verwenden, die breit unterstützt werden. Testen Sie Ihre Webseite in verschiedenen Browsern und auf unterschiedlichen Geräten, um die Kompatibilität zu gewährleisten.

Wie kann ich die Lesbarkeit meiner WordPress-Seite verbessern?

Die Wahl der Schriftart hat einen großen Einfluss auf die Barrierefreiheit Ihrer Webseite. Wählen Sie für Ihre WordPress-Seite klare, gut lesbare Schriftarten. Vermeiden Sie zu verschnörkelte oder zu dünne Schriftarten und achten Sie auf ausreichenden Kontrast zwischen Text und Hintergrund.

Vermeiden Sie unbedingt Schriftarten, die schwer zu lesen sind oder die Lesbarkeit für Menschen mit Sehbeeinträchtigung einschränken könnten.

Was sind die beliebtesten Schriftarten auf WordPress?

Eine der am häufigsten verwendeten Schriftarten ist Roboto, die für ihre problemlose Lesbarkeit und ihre moderne Ästhetik bekannt ist. Sie passt gut zu einer Vielzahl von Designs und ist daher häufig die bevorzugte Wahl für viele WordPress-Themes. Andere beliebte Klassiker sind Open Sans, Arial, Helvetica oder Times New Roman. Diese Fonts sind für ihre gute Lesbarkeit bekannt. Ein weiterer Vorteil dieser Schriftarten ist, dass sie gut bei verschiedenen Bildschirmgrößen und in unterschiedlichen Browsern funktionieren.

Kann ich die Schriftart in WordPress rückgängig machen oder wechseln, ohne den Code zu bearbeiten?

Viele WordPress-Themes und -Plugins ermöglichen es Ihnen, Schriftarten über eine Benutzeroberfläche zu ändern, ohne direkt in den Code eingreifen zu müssen. Dies erleichtert das Wechseln von Schriftarten und das Rückgängigmachen einer Schriftart-Auswahl.

Können Schriftarten in WordPress auch für spezielle Elemente wie Buttons oder Menüs geändert werden?

Ja, in WordPress können Sie Schriftarten für verschiedene Elemente wie Buttons, Menüs oder Überschriften individuell anpassen. Dies kann über den Customizer, spezielle Plugins oder durch Anpassungen im CSS erfolgen.

Muss ich bei der Schriftartwahl für mobile Endgeräte in WordPress etwas beachten?

Bei der Auswahl von Schriftarten für mobile Endgeräte in WordPress sollten Sie noch stärker auf die Lesbarkeit auf kleinen Bildschirmen achten. Vermeiden Sie zu kleine Schriftgrößen und wählen Sie Schriftarten, die vor allem auf kleineren Displays gut lesbar sind. Testen Sie frühzeitig bei der Erstellung einer mobilen Webseite, ob Sie mit der Lesbarkeit auf verschiedenen Endgeräten zufrieden sind.

Ist es möglich, Schriftarten in WordPress global zu ändern?

Eine globale Anpassung der Schriftart in WordPress kann über das Customizer-Tool eingestellt werden, wenn das verwendete Theme diese Funktion unterstützt. Alternativ können Sie globale Änderungen auch direkt im CSS des Themes vornehmen, indem Sie die font-family-Eigenschaft für den body-Tag oder andere allgemeine Elemente definieren. Dies stellt sicher, dass die gewählte Schriftart auf der gesamten Website einheitlich angewendet wird.

Können Schriftarten in WordPress auf mehrsprachige Websites angepasst werden?

Für mehrsprachige Websites können Schriftarten in WordPress angepasst werden, um die Lesbarkeit und Ästhetik in verschiedenen Sprachen zu gewährleisten. Dies kann besonders wichtig sein, wenn eine Sprache spezielle Schriftzeichen verwendet, die von der Standard-Schriftart möglicherweise nicht unterstützt werden. Plugins wie WPML oder Polylang ermöglichen es, unterschiedliche Schriftarten für verschiedene Sprachversionen der Website festzulegen. Sie können auch CSS-Regeln verwenden, die auf spezifische Sprachklassen abzielen, um verschiedene Schriftarten für verschiedene Sprachen zu definieren.

Wie aktualisiere ich Schriftarten in einem WordPress-Child-Theme?

Um Schriftarten in einem WordPress-Child-Theme zu aktualisieren, ohne die Updates des Parent-Themes zu beeinträchtigen, sollten Sie Änderungen direkt in der style.css-Datei des Child-Themes vornehmen. Fügen Sie Ihre Schriftart-Definitionen hier ein, um die Standard-Schriftarten des Parent-Themes zu überschreiben. Sie können auch die functions.php-Datei des Child-Themes verwenden, um zusätzliche Schriftarten einzubinden, beispielsweise von Google Fonts. Dieser Ansatz stellt sicher, dass Ihre Änderungen bei einem Update des Parent-Themes erhalten bleiben.

Wie kann ich Probleme bei der Schriftartdarstellung in WordPress beheben?

Um Probleme bei der Darstellung einer Schrift in WordPress zu beheben, überprüfen Sie zunächst, ob die Schriftart korrekt eingebunden wurde. Stellen Sie sicher, dass alle notwendigen Schriftartdateien geladen werden und dass die font-family-Eigenschaft im CSS korrekt definiert ist. Überprüfen Sie auch, ob Konflikte mit Plugins oder dem Theme bestehen. Wenn Schriftarten von externen Quellen wie Google Fonts geladen werden, stellen Sie sicher, dass die URLs korrekt sind und keine Zugriffsprobleme bestehen. Bei Darstellungsproblemen in bestimmten Browsern kann es hilfreich sein, die Kompatibilität der Schriftart zu überprüfen und gegebenenfalls Alternativen zu wählen.

Titelmotiv: Photo by CHUTTERSNAP on Unsplash

Wolf-Dieter Fiege
Letzte Artikel von Wolf-Dieter Fiege (Alle anzeigen)

Große Auswahl an günstigen Domain-Endungen – schon ab 0,08 € /Monat
Jetzt Domain-Check starten