Die Standardschrift verrät eine WordPress-Seite auf den ersten Blick. Eine Systemschrift schreit lauter „Ich habe nichts konfiguriert" als jedes kostenlose Template.

Die Schriftart zu ändern dauert zehn Minuten. Sie müssen weder Frontend-Entwickler sein noch etwas bezahlen. Die fünf folgenden Methoden decken alles ab: von Einsteigern, die keine Zeile Code anfassen möchten, bis zu Seitenbetreibern, die volle Kontrolle benötigen.

Wir haben funktionierende Methoden mit Stand 2026 zusammengestellt. Vom schlechtesten Ansatz, der in veralteten Anleitungen immer noch empfohlen wird, bis zum kanonischen „WordPress-Weg".

💡 Kurzüberblick:

• Wählen Sie eine Schriftart: Google Fonts (kostenlos, über 1500 Schriften), Adobe Fonts (Creative-Cloud-Abo) oder laden Sie eigene WOFF2-Dateien auf Ihren Server.
• Entscheiden Sie, ob Sie ein Plugin (einfacher, Customizer-Oberfläche) oder die manuelle Einbindung per functions.php (aufgeräumter, schneller, keine Abhängigkeit von Drittanbieter-Code) bevorzugen.
• Bei der manuellen Methode: Fügen Sie wp_enqueue_style in die functions.php und font-family im CSS hinzu.
• Bei der Plugin-Methode: Installieren Sie EasyFonts oder Use Any Font, wählen Sie eine Schrift aus und speichern Sie.
• Testen Sie das Ergebnis in verschiedenen Browsern und auf Mobilgeräten: Jede zusätzliche Schriftart vergrößert die Seitenladezeit um 50 bis 200 KB.

Warum Sie die Schriftart auf Ihrer Seite überhaupt ändern sollten

Schrift prägt den ersten Eindruck schneller als Farben oder Bilder. Forscher der University of Michigan zeigten bereits 2008, dass Text in einer komplexen Schriftart unbewusst als „schwierig" wahrgenommen wird. Leser befolgen Anweisungen seltener und überschätzen die Zeit, die sie für eine Aufgabe benötigen.

Auch Serife oder serifenlos spielt eine Rolle. Serifenschriften (Georgia, Merriweather) erhöhen die Lesezeit, steigern aber die wahrgenommene Autorität. Serifenlose Schriften (Roboto, Inter) beschleunigen das Lesen und funktionieren auf mobilen Bildschirmen besser. Das ist keine Vermutung: Ein Überblick über die Forschung zur Typografie-Psychologie bestätigt den Effekt in der Praxis.

Für eine WordPress-Seite löst die richtige Schrift drei Probleme:

• Markenwiedererkennung. Eine eigene Überschriftenschrift verhindert, dass Ihre Seite wie „nur ein weiterer Blog mit einem Standard-Theme" aussieht.
• Lesbarkeit. Richtige Größe, Zeilenhöhe und Kontrast senken die Absprungrate.
• Visuelle Hierarchie. Unterschiedliche Schriften für Überschriften und Fließtext lenken den Blick des Besuchers.

Kommen wir nun zur Praxis.

Woher Sie Schriftarten für WordPress beziehen

Es gibt drei Quellen: Google Fonts, Adobe Fonts und Self-Hosting. Sehen wir uns jede an.

Google Fonts: kostenlos und ohne Registrierung

Die naheliegendste Quelle. Über 1500 Schriftarten, offene Lizenz, Caching über das Google-CDN. Für 95% aller Seiten geeignet.

Gehen Sie zu fonts.google.com. Die Oberfläche empfängt Sie mit einem Raster aus Karten, die jeweils ein Schriftmuster zeigen.

Die Filter befinden sich links. Sie können nach Kategorie (Serif, Sans Serif, Display, Handwriting, Monospace), Sprache, Anzahl der Schnitte und Strichstärke filtern. Filter werden sofort angewendet, die Ergebnisse aktualisieren sich ohne Neuladen.

Fahren Sie mit der Maus über eine Schrift, um ein Menü zum Ändern des Beispieltextes einzublenden. Geben Sie Ihre eigene Überschrift oder einen Absatz ein und sehen Sie, wie es aussieht.

Klicken Sie auf „View specimen", um die Schriftseite mit allen Schnitten, der Glyphentabelle und Mustern in verschiedenen Größen zu öffnen.

Wenn Ihnen eine Schrift gefällt, klicken Sie auf das rote Plus in der Ecke der Karte. Die Schrift wird in die Sammlungsleiste am unteren Bildschirmrand übernommen. Sie können mehrere Familien hinzufügen: eine für Überschriften, eine andere für den Fließtext.

Klappen Sie die Sammlungsleiste aus, um die Registerkarten „Embed" und „Customize" zu sehen.

Wählen Sie im Reiter „Customize" die benötigten Schnitte aus. Wichtig: Aktivieren Sie nicht alles. Jeder Schnitt ist eine zusätzliche Datei, die der Browser lädt. Für eine typische Seite genügen Regular (400) und Bold (700), manchmal Italic. Die Geschwindigkeitsanzeige oben rechts zeigt, wie stark die Schrift das Laden verlangsamt.

Wenn Ihre Website ein nicht-lateinisches Alphabet verwendet, wählen Sie den passenden Zeichensatz unten auf der Seite aus. Für Kyrillisch ist das Cyrillic.

Zwei Pfeilschaltflächen oben: Die linke teilt die Sammlung, die rechte lädt die Schriftdateien auf Ihren Rechner herunter. Nützlich für Photoshop oder wenn Sie sich entscheiden, die Schrift selbst zu hosten.

Adobe Fonts (vormals Typekit)

Wenn Sie ein Creative-Cloud-Abonnement besitzen, erhalten Sie über Adobe Fonts Zugriff auf professionelle Schriften wie Futura, Minion Pro und Myriad. Die Einbindung erfolgt per CSS, ähnlich wie bei Google Fonts. Die kostenlose Creative-Cloud-Stufe enthält ein Basisset, das für die meisten Projekte ausreicht.

Eigene Schriften in WOFF2

Haben Sie eine lizenzierte Schrift gekauft oder eine kostenlose von Font Squirrel heruntergeladen? Konvertieren Sie sie in WOFF2 (modernes Webfont-Format, Brotli-Kompression, von 97% der Browser unterstützt) und laden Sie sie auf Ihren Server hoch. Vorteil: keine Abhängigkeit von einem Drittanbieter-CDN und DSGVO-konform. Nachteil: Die Schrift wird von Ihrem Server geladen, was zwangsläufig langsamer ist als das Google-CDN.

5 Wege, um benutzerdefinierte Schriftarten in WordPress einzubinden

Es gibt genau fünf Wege. Wir gehen von „das sollten Sie nicht tun" bis zur idealen WordPress-Methode.

Methode 1: CSS @import (das sollten Sie nicht tun)

Google Fonts bietet einen @import-Tab mit einem fertigen CSS-String. Das sieht praktisch aus: kopieren, einfügen, fertig.

Technisch kommt der Code an den Anfang der style.css Ihres Child-Themes:

1
/*
2
 Theme Name: Twenty Seventeen Child
3
 Theme URI: https://wordpress.org/themes/twentyseventeen/
4
 Template: twentyseventeen
5
 Author: the WordPress team
6
 Author URI: https://wordpress.org/
7
 Version: 1.0
8
*/
9
 
10
@import url('https://fonts.googleapis.com/css?family=Open+Sans|Roboto');
11
 
12
/* additional CSS goes here */

Warum ist das die schlechteste Option? @import hindert den Browser daran, mehrere Stylesheets parallel zu laden. Der Browser lädt die CSS-Datei herunter, sieht das @import darin und holt die Schriftart erst dann. Sequenzielles Laden statt parallel bedeutet 200-400 ms Verlust pro Schriftart. Auf mobilen Geräten ist das kritisch.

Verwenden Sie @import niemals für Schriftarten.

Methode 2: Einfügen eines Link-Tags in header.php

Schriftbibliotheken stellen einen <link>-Tag für die Einbindung in den <head> bereit. Sie können ihn direkt in header.php platzieren, der Template-Datei, die jedes WordPress-Theme besitzt.

Platzieren Sie den <link> zwischen den <head>- und </head>-Tags. Wenn Sie mit einem Child-Theme arbeiten, kopieren Sie header.php vom Parent- in das Child-Theme und bearbeiten Sie es dort.

Diese Methode funktioniert, ist aber fragil: Theme-Updates überschreiben Ihre Änderungen, wenn Sie kein Child-Theme verwenden. Zudem ist die Vermischung von Inhalt und Code in Templates eine schlechte Praxis. Für ein einmaliges Experiment in Ordnung, für den dauerhaften Einsatz nicht.

Methode 3: @font-face und selbst gehostete Schriftarten

Wenn die Schriftart auf Ihrem Server liegt, müssen Sie sie mit der @font-face-Direktive in Ihrem Stylesheet deklarieren. Laden Sie zuerst die Schriftdateien (WOFF2, WOFF) per FTP in Ihren Child-Theme-Ordner, zum Beispiel wp-content/themes/yourtheme-child/fonts/.

Fügen Sie dann in style.css hinzu:

1
@font-face {
2
  font-family: 'Roboto';
3
  src: url('fonts/Roboto-Regular.woff2') format('woff2'),
4
       url('fonts/Roboto-Regular.woff') format('woff');
5
  font-weight: normal;
6
  font-style: normal;
7
  font-display: swap;
8
}

Der Parameter font-display: swap ist wichtig: Er weist den Browser an, Text zuerst in einer Systemschrift anzuzeigen und dann gegen die benutzerdefinierte Schrift auszutauschen, sobald sie geladen ist. Ohne diesen Parameter sehen Besucher einen leeren Bildschirm, während die Schrift lädt.

Vergessen Sie nicht, Schriftname und Pfad zu ersetzen. Wenn Ihre Quelldatei TTF oder OTF ist, konvertieren Sie sie mit dem Font Squirrel Online-Konverter in WOFF2.

Diese Methode bietet volle Kontrolle, verliert aber bei der Geschwindigkeit gegenüber Google Fonts: Ihr Server ist mit ziemlicher Sicherheit langsamer als das CDN von Google. Für Seiten mit bis zu 10.000 Besuchern pro Monat ist der Unterschied nicht spürbar. Für stark frequentierte Projekte ist er kritisch.

Methode 4: functions.php und wp_enqueue_style (der kanonische WordPress-Weg)

Die aus Sicht der WordPress-Architektur korrekteste Methode. Anstatt Code in ein Template einzufügen, reihen Sie das Stylesheet mit der Schriftart über den wp_enqueue_scripts-Hook in die Warteschlange ein.

Der Code kommt in die functions.php des aktiven Themes oder Child-Themes. Hier ein funktionierendes Beispiel für Google Fonts:

1
function techblog_add_google_fonts() {
2
    wp_enqueue_style(
3
        'techblog-google-fonts',
4
        'https://fonts.googleapis.com/css2?family=Inter:wght@400;700&family=Playfair+Display:wght@700&display=swap',
5
        array(),
6
        null
7
    );
8
}
9
add_action( 'wp_enqueue_scripts', 'techblog_add_google_fonts' );

Die Funktion wp_enqueue_style nimmt vier Parameter entgegen: einen eindeutigen Namen (Handle), die Stylesheet-URL, ein Array mit Abhängigkeiten (hier leer) und eine Version (null, WordPress setzt seine eigene ein). Der wp_enqueue_scripts-Hook stellt sicher, dass der Code zum richtigen Zeitpunkt während des Seitenaufbaus ausgeführt wird.

Für Adobe Fonts wurden früher JavaScript und wp_enqueue_script verwendet. Inzwischen ist Adobe Fonts auf einen CSS-Ansatz ähnlich wie Google Fonts umgestiegen, sodass wp_enqueue_style beide Dienste abdeckt.

Warum das die beste manuelle Methode ist:

• Schriftarten werden bei Theme-Updates nicht überschrieben (sofern Sie ein Child-Theme nutzen).
• WordPress verwaltet die Ladereihenfolge und löst Abhängigkeiten auf.
• Der Code ist in functions.php isoliert, Templates bleiben sauber.
• Andere Plugins können Ihren Aufruf über Standard-Hooks deaktivieren oder verändern.

Methode 5: Plugin (wenn Sie keinen Code anfassen möchten)

Sie möchten nicht in functions.php eintauchen? Ein Plugin löst das Problem ohne eine einzige Codezeile.

Easy Google Fonts (visuelles Beispiel, aber nicht für Produktivseiten)

Das älteste Schriftarten-Plugin im WordPress-Verzeichnis. Es bietet eine Customizer-Oberfläche: Schriftart auswählen, Änderungen in Echtzeit sehen, speichern.

Die Installation erfolgt standardmäßig: Plugins → Installieren → „Easy Google Fonts" suchen → Installieren → Aktivieren.

Nach der Aktivierung erscheint ein neuer Punkt „Typography" unter Design → Customizer. Gehen Sie hinein, wählen Sie Typography Default, und Sie sehen die Schriftsteuerungen für Absätze und Überschriften.

Klicken Sie auf das Dropdown neben dem Element, das Sie ändern möchten. Ein Menü klappt auf:

Die wichtigste Option ist Font Family. Hier haben Sie Zugriff auf die gesamte Google Fonts Bibliothek (über 600 Schriften). Die Schriftarten sind nach Kategorien gruppiert: Serif, Sans-Serif, Display, Handwriting, Monospace. Sie können nach Namen suchen.

Klicken Sie auf eine Schrift, und die Änderungen werden sofort in der Vorschau auf der rechten Seite sichtbar.

Es folgt die Feinarbeit. Der Tab Font Weight/Style steuert die Strichstärke. Text Decoration fügt Unterstreichung, Durchstreichung oder Überstreichung hinzu. Text Transform ändert die Schreibweise: Großbuchstaben, Kleinbuchstaben oder Kapitälchen.

Im Tab Appearance: Schriftfarbe, Hintergrundfarbe, Größe, Zeilenhöhe und Zeichenabstand.

Der Tab Positioning: Außenabstände, Innenabstände, Rahmen, Rahmenradius und die Display-Eigenschaft.

Wenn Sie fertig sind, klicken Sie oben auf Save and Publish.

Ehrliche Warnung: Easy Google Fonts wurde seit 2020 nicht mehr aktualisiert. Unter WordPress 6.4+ funktioniert das Plugin möglicherweise nicht. Einige Nutzer beschweren sich, dass die Option „Typography" im Customizer nicht erscheint. Wir zeigen es als Veranschaulichung des Ansatzes: Die meisten Schrift-Plugins arbeiten über denselben Customizer-Mechanismus.

Was tun, wenn sich die Schrift nicht ändert

Manche Themes verwenden nicht standardmäßige CSS-Selektoren. Eine Überschrift ist vielleicht nicht einfach <h1>, sondern <h1 class="entry-title">, und das Plugin „sieht" dieses Element nicht.

Lösung: Erstellen Sie eine eigene Schriftsteuerung unter Settings → Google Fonts.

Binden Sie den benötigten CSS-Selektor an die neue Steuerung und aktivieren Sie Force Override. Nach dem Speichern erscheint die Steuerung im Customizer neben den Standardsteuerungen.

Alternative Plugins (aktuell im Jahr 2026)

Easy Google Fonts ist nicht die einzige Option. Drei aktuelle Alternativen:

• EasyFonts hostet Google Fonts lokal auf Ihrem Server. Es erkennt automatisch verwendete Schriften, lädt sie herunter und liefert sie von Ihrer Domain aus. Schneller als Standard-CDN-Anfragen, zudem vollständig DSGVO-konform. Das leichteste der drei hinsichtlich der Performance-Auswirkungen.
• Use Any Font erlaubt Ihnen, eigene Schriften ohne CSS hochzuladen. Das Plugin konvertiert TTF/OTF/WOFF ins Webformat und hostet sie auf Ihrem Server. Geeignet für kommerzielle Schriften, die unter Lizenz erworben wurden.
• Fonts Plugin ist ein alternativer Google Fonts Manager mit Customizer-Vorschau. Anders als das veraltete Easy Google Fonts wird es regelmäßig aktualisiert und mit aktuellen WordPress-Versionen getestet.

Die Schrift auf Website-Elemente anwenden

Die Schrift ist eingebunden, hängt aber noch „in der Luft". Sie müssen dem Browser mitteilen, auf welche Elemente er sie anwenden soll.

Hier ist grundlegendes CSS, um die Überschriftenschrift zu ersetzen. Fügen Sie es über Appearance → Customize → Additional CSS hinzu:

1
h1,
2
h2,
3
h3,
4
h4,
5
h5,
6
h6 {
7
    font-family: 'Roboto', sans-serif;
8
}

Für den Fließtext:

1
body,
2
p,
3
li {
4
    font-family: 'Inter', sans-serif;
5
}

Wichtige Nuance: Der Schriftname in font-family muss exakt der Schreibweise entsprechen, mit der die Bibliothek ihn deklariert. Google Fonts verwendet 'Roboto', während Adobe Fonts beispielsweise 'open-sans' zurückgibt (ohne Leerzeichen und ohne Anführungszeichen). Achten Sie genau auf den Code, den der Dienst bereitstellt, nicht auf den Schriftnamen auf der Website.

Sie können dieses CSS auf drei Wegen einbinden: über den Customizer (am einfachsten, bleibt bei Theme-Updates erhalten), über die style.css des Child-Themes oder über den wp_head-Hook. Wir empfehlen den ersten Weg.

⁉️🤔 Häufig gestellte Fragen

Wie viele Schriften kann man einer Website hinzufügen, ohne Geschwindigkeit einzubüßen?

Optimal sind zwei Familien: eine für Überschriften, eine für Fließtext. Jede weitere Schrift erzeugt einen HTTP-Request und 50-200 KB Seitengewicht. Drei Schriften sind bereits die Obergrenze. Und binden Sie nur die Schnitte ein, die Sie wirklich brauchen: Regular (400) und Bold (700) wiegen halb so viel wie ein Set aus 5-6 Schnitten.

Google Fonts oder Adobe Fonts: Wofür soll man sich entscheiden?

Für 9 von 10 Websites: Google Fonts. Kostenlos, schnell (Google CDN), über 1500 Schriften, Kyrillisch ist in fast allen gängigen Schriften verfügbar. Adobe Fonts sind dann sinnvoll, wenn Sie bereits ein Creative-Cloud-Abo haben und eine bestimmte kommerzielle Schrift wie Futura oder Minion Pro benötigen.

Kann man eine heruntergeladene TTF-Datei vom eigenen Rechner verwenden?

Das ist möglich, aber konvertieren Sie sie zuerst in WOFF2 (modernes komprimiertes Format fürs Web). TTF-Dateien sind unkomprimiert und beanspruchen deutlich mehr Speicherplatz. WOFF2 mit Brotli-Komprimierung reduziert die Dateigröße um ein Vielfaches. Konverter: Font Squirrel Webfont Generator.

Plugin oder functions.php: Was ist zuverlässiger?

functions.php ist für den langfristigen Einsatz zuverlässiger: keine zusätzliche Abhängigkeit, der Code ist transparent, Plugin-Updates betreffen Sie nicht. Plugins punkten bei der Bequemlichkeit: 5 Minuten statt einer halben Stunde Einarbeitung in Hooks. Für eine Produktivseite wählen Sie wp_enqueue_style im Child-Theme. Für einen schnellen Prototypen oder eine Kundenseite, die eine einfache Oberfläche braucht, nutzen Sie ein Plugin.

Warum sieht die Schrift auf dem Mobilgerät anders aus als auf dem Desktop?

Mobile Browser ersetzen gelegentlich Systemschriften oder rendern die Kantenglättung anders. Zudem sind die Bildschirmgrößen unterschiedlich: 16px auf dem Desktop lesen sich gut, auf einem Smartphone können sie zu groß sein. Lösung: Setzen Sie eine relative Größe mit clamp() (zum Beispiel font-size: clamp(16px, 2.5vw, 20px)) und testen Sie auf einem echten Gerät, nicht im Emulator.

Abschließende Zusammenfassung: Was Sie 2026 auf Ihrer Website einsetzen sollten

Fasst man alles in fünf Sätzen zusammen:

• Google Fonts ist die Standard-Schriftquelle. Ausreichend für 95% aller Projekte: schnell, kostenlos, Kyrillisch ist überall verfügbar.
• functions.php + wp_enqueue_style ist die beste manuelle Methode. Sauber, übersteht Theme-Updates, der Code ist transparent.
• Das EasyFonts-Plugin funktioniert, wenn Sie lokales Hosting von Google Fonts ohne Code-Aufwand möchten. Schneller als das Standard-CDN und DSGVO-konform.
• Zwei Schnitte pro Schrift, nicht mehr: Regular und Bold. Jeder weitere Schnitt kostet 30-50 KB Ladegewicht.
• WOFF2, nicht TTF: Konvertieren Sie vor dem Hochladen auf Ihren Server. Spart eine halbe Megabyte pro Seite.

Schriften zu wechseln gehört zu den Aufgaben, bei denen eine Stunde sorgfältige Einrichtung jahrelangen visuellen Ertrag bringt. Fangen Sie gleich jetzt an: Gehen Sie auf die Google Fonts-Website, suchen Sie sich ein paar Schriften für Ihr Projekt aus und probieren Sie Methode 4 aus der obigen Liste.