So verwenden Sie benutzerdefinierte Schriftarten auf Ihrer Website

So funktioniert's

Falls Ihnen die standardmäßig hinterlegten Schriftarten im Site Builder nicht gefallen, können Sie andere Schriftarten aus dem Google Fonts-Katalog für den Text im Header und Body einbinden. Dafür ist ein benutzerdefinierter HTML-Code erforderlich. Sie können eine bestehende Lösung nutzen oder Ihren eigenen Code hinzufügen.

Wie komme ich dazu

Bestehende Lösung nutzen

1. Öffnen Sie Ihr Projekt im Kundenportal.
2. Klicken Sie in der Seitenleiste auf Site Builder.
3. Klicken Sie auf Site Builder öffnen.
4. Geben Sie die URL der Schriftart unter Benutzerdefinierter Code ein, und legen Sie die Stilklassen fest, für die der font-family-Wert geändert werden soll.

Beispiel: Änderung der Schriftart im Header

<style>
@import url('https://fonts.googleapis.com/css?family=Playfair+Display&display=swap');

  .custom-header-font h1,
  .custom-header-font h2,
  .custom-header-font h3,
  .custom-header-font h4,
  .custom-header-font h5,
  .custom-header-font h6 {
    font-family: 'Playfair Display';
  }
</style>

Beispiel: Änderung der Schriftart im Body

<style>
  @import url('https://fonts.googleapis.com/css?family=Playfair+Display&display=swap');

  .custom-main-font {
    font-family: 'Playfair Display';
  }
</style>

5. Klicken Sie auf Vorschau, um sich die Änderungen anzeigen zu lassen.

Tutorial-Video zur Anleitung:

Eigenen Code hinzufügen

1. Klicken Sie im Site Builder auf Block hinzufügen und dann auf Benutzerdefinierter Code.

2. Fügen Sie Ihren eigenen Code in den Block ein.

Nützliche Links