Weaver II – Schriften festlegen

Screenshot des WordPress-Themes "Weaver II"Heute geht es weiter mit meiner Beitragsserie zu meinem Lieblings-Theme „Weaver II“.

Nachdem ich in den letzten Beiträgen die Möglichkeiten zur Layoutgestaltung erklärt habe, geht es heute weiter mit dem nächsten Punkt in den Theme-Options, nämlich den Schriftarten.

Den entsprechenden Menüpunkt finden Sie unter

„Design“ – „Weaver II Admin“ – „Main Option“ – „Fonts“

Fonts im Theme Weaver II

Zum Vergrößern bitte Bild anklicken

Unter diesem Menüpunkt können die Schriftarten für den Fließtext (Content Font) und die Überschriften (Titles Font) festgelegt werden. Zur Auswahl stehen 20 verschiedene Schriftarten.

Schriftart für Inhalt und Überschrifen in Weaver II

Zum Vergrößern bitte Bild anklicken

Außerdem können Sie an dieser Stelle die Standard-Schriftgröße und den Zeilenabstand für Texte festlegen. Standardmäßig sind für die Zeilenhöhe 1.5 festgelegt. Mir persönlich ist dieser Abstand zu groß und ich passe das gern auf 1.3 an.

Für die Ansicht auf dem Smartphone kann – falls gewünscht – eine abweichende Standard-Schriftgröße gewählt werden. Das kann aus Gründen der besseren Lesbarkeit sinnvoll sein.

Freie Schriftenwahl mit Weaver II Pro

Wenn Sie die Pro-Version von Weaver II nutzen haben Sie nahezu vollständige Flexibilität bei der Verwendung von Schriften in Ihrer Website. Alle verfügbaren Google Webfonts können ganz leicht und intuitiv in das Theme importiert und den einzelnen Textbereichen zugeordnet werden. Dafür müssen Sie unter „Specify Standard Font Family“ im Dropdown den Punkt „Google Web Font“ auswählen.

Google Webfonts in Weaver II

Zum Vergrößern bitte Bild anklicken

Der schwierigste Teil ist es vermutlich, sich bei der riesigen Auswahl der Google Webfonts für eine Schrift zu entscheiden. Wenn Sie das einmal geschafft haben, müssen Sie nur auf den Button für „Quick Use“ klicken.

Quick Use in Google Webfonts

Zum Vergrößern bitte Bild anklicken

Sie bekommen dann zwei Codes angezeigt, einen für die Einbindung des Fonts in Ihre Website und einen Code für die Einbindung der Schrift in das Stylesheet:

Google Webfonts Code für die Einbindung in Weaver II

Zum Vergrößern bitte Bild anklicken.

CSS Code für Google Webfont

Zum Vergrößern bitte Bild anklicken.

Diese beiden Codes müssen Sie lediglich an die entsprechende Stelle in den Weaver-Theme-Options einfügen: Den ersten Code bei „Specify Google Webfont Family“ unter Nr. 3 und den CSS-Code unter Nr. 4.

Einbindung von Google Webfonts in die Weaver II Theme-Options

Zum Vergrößern bitte Bild anklicken

Im zweiten Schritt (Step 2) müssen Sie lediglich auf den Button mit der Aufschrift „Click here to generate Font CSS Definition“ klicken. Dadurch erhalten Sie den CSS-Code den Sie im übernächsten Schritt benötigen, um die Schrift für den gewünschten Bereich einzusetzen.

Weaver Fonts - CSS Code generieren

Zum Vergrößern bitte Bild anklicken.

Um die auf diesem Weg neu eingefügte Schriftart zu verwenden müssen Sie jetzt nur noch bei Schritt 4 (ja, richtig, Schritt 4 – Zu Schritt 3 komme ich gleich noch) für den gewünschten Textbereich auf den Button „Paste CSS“ klicken.

Beispiele für Bereiche, deren Schrift über Weaver II angepasst werden kann

Zum Vergrößern bitte Bild anklicken

Nahezu jedem Bereich des Themes, angefangen beim Fließtext (Content Fonts) über die Navigation und die Widgetbereiche, könnte so eine eigene Schriftart zugefügt werden. Aber Vorsicht, übertreiben Sie es nicht 😉 … Zwei bis maximal drei verschiedene Schriften je Seite sind eigentlich völlig ausreichend, sonst wirkt die Seite schnell unordentlich und unstrukturiert.

Fast geschafft 🙂

Wenn Sie mit einer Schriftart die Schritte 1, 2 und 4 abgeschlossen haben müssen Sie bei Step 3 noch auf den Button „Click here to paste current Google #3 and #4 to available Google fonts list“ klicken. Damit wird die neu eingefügt Schrift zur Liste der verfügbaren Schriften in Weaver II hinzugefügt.

Danach können Sie die Schritte 1, 2 und 4 für die nächste Schriftart – beliebig oft – wiederholen.

Damit bin ich am Ende des heutigen Tutorials zu Weaver II. Wenn es Ihnen gefallen hat, Sie Fragen dazu oder generell zu Weaver II haben, dann freue ich mich auf Ihren Kommentar.

Hier finden Sie die weiteren Beiträge zur Serie

  1. Weaver II – Das am meisten unterschätzte WordPress-Theme
  2. Weaver II – Layout anpassen
  3. Weaver II – Layout Teil 2
  4. Weaver II – Schriften festlegen
  5. Weaver II – Widgetbereiche definieren

Bildquelle:
weavertheme.com

Print Friendly, PDF & Email

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.


Ich möchte auch den WordPress-Rundbrief abonnieren