WordPress: Schriftart/Font in Theme ersetzen

WordPress

Um in einem Theme die Schriftart/Font komplett oder teilweise zu ersetzen, wird nicht viel Code benötigt.

Dazu ist es aufgrund von DSGVO ratsam, die Schriftart lokal auf dem eigenen Webhost zu legen, um keine Verzweigung auf einen anderen Server und Provider zu haben.

Vorgehen

  1. Laden Sie die gewünschte Schriftart auf Ihren Webhost hoch.
    Entweder direkt ins Root-Verzeichnis (so wie in diesem Beispiel) oder in einen anderen Ordner.
    Beispiel: die Font-Datei futura_lt_light.ttf
  2. Gehen Sie im WordPress Backend auf Design -> Customizer.
  3. Hier finden Sie einen Eintrag Zusätzliches CSS.
  4. Geben Sie dort folgenden Code ein:
@font-face {
  font-family: MarcoStyle;
  src: url(https://faq.linkemarco.de/futura_lt_light.ttf);
}

html, body {
  font-family: MarcoStyle;
}
  1. Ändern Sie bei @font-face die Einträge font-family und src auf Ihre Gegebenheiten ab.
    font-family: Hier geben Sie den Namen/Variable ein, mit dem Sie die Schriftart auf Ihrer Webseite nutzen wollen.
    src: Hier liegt Ihre Font-Datei (siehe Punkt 1)
  2. Über html, body setzen Sie nun Ihre Schriftart als Standard-Schriftart.

Hinweis

Es kann sein, dass das Theme bei einigen Punkten die Schriftart übersteuert. Ist dies der Fall, müssen Sie dies ebenfalls über den Eintrag Zusätzliches CSS für diese Elemente ergänzen und übersteuern.

Beispiel 1 – Überschriften:

h1, h2, h3, h4, h5, h6 {
	font-family: MarcoStyle;
}

Beispiel 2 – Seitentitel und Untertitel:

.site-branding .site-description {
	font-family: MarcoStyle;
}