Springe zum Hauptinhalt

Wie man Typografie und Layout auf Divi anpassen kann

Divi: das am einfachsten zu verwendende WordPress-Theme

Divi: Das beste WordPress-Theme aller Zeiten!

Mehr 600.000 Downloads, Divi ist das beliebteste WordPress-Theme der Welt. Es ist vollständig, einfach zu bedienen und enthält mehr als 62-freie Vorlagen. [Empfohlen]

Um das Layout und die Typografie Ihrer Website anzupassen, müssen Sie zuerst auf den Theme Customizer zugreifen, indem Sie auf den Link klicken Divi> Theme Customizer auf Ihrem WordPress-Dashboard. Dadurch wird der Customizer gestartet. Suchen Sie dann nach dem Bereich "Allgemeine Einstellungen". Klicken Sie auf das Bedienfeld, um die entsprechenden Einstellungen zu öffnen und das Customizing zu starten. Im Bereich "Allgemeine Einstellungen" finden Sie drei Abschnitte: Layouteinstellungen, Typografie und Hintergrund.

allgemeine Parameter divi.png

Layouteinstellungen

Im Layoutbereich können Sie verschiedene Größen- und Abstandsoptionen für Ihre Website anpassen. Hier können Sie den Abstand zwischen Spalten, Linien und Abschnitten vergrößern oder verkleinern und die Größe Ihrer Seitenleiste anpassen. In diesem Bereich können Sie auch den Modus "Boxed Layout" aktivieren.

Layoutparameter.png

Schachtelungslayout aktivieren

Hier können Sie Ihre Site in einem Box-Format bearbeiten, das den Inhalt Ihrer Site umrahmt und einen Hintergrund freigibt, der angepasst werden kann.

Breite des Inhalts der Website

Hier können Sie die maximale Breite Ihres Inhaltsbereichs festlegen. Da sich Ihr Inhalt in einem ansprechenden Layout befindet, wird er auf kleinere Größen angepasst, aber nicht über die hier definierte maximale Breite hinaus erweitert.
Der Standardwert ist 1080px. Es ist eine gute Breite für die meisten Standard-Laptops und -Desktops.

Spaltenabstand auf der Website

Die Breite der Rinne entspricht dem horizontalen Abstand (Rand) zwischen den Spalten jeder Zeile.

Die optionalen Werte für die Rinnenbreite liegen zwischen 1 und 4.

1 steht für den Nullabstand zwischen den Spalten.
2 repräsentiert einen Abstand von 3% zwischen den Spalten.
3 repräsentiert einen Abstand von 5,5% zwischen den Spalten.
4 repräsentiert einen Abstand von 8% zwischen den Spalten.

Beginnen Sie mit der Bewerbung Ihres Blogs

Laden Sie Dutzende von Logos, Bannern, Website-Vorlagen und vielen anderen Marketing-Tools herunter, um Ihren WordPress-Blog zu vermarkten. [Empfohlen]

divi.png Konfiguration

Verwenden Sie die benutzerdefinierte Breite der Seitenleiste

Hiermit legen Sie die Breite der Standard-Seitenleiste für Ihr Thema fest. Dies gilt für alle Seiten in Ihrem Design, die über eine Seitenleiste verfügen und nicht mit Divi Builder erstellt wurden.

Höhe des Abschnitts und der Linie

Diese Optionen passen den vertikalen Abstand (obere und untere Füllung) für jeden Abschnitt und jede Linie an.

Thema Akzentfarbe

Bevor Sie beginnen, die Farben Ihrer anderen Elemente zu ändern, müssen Sie dies zuerst ändern. Sobald Sie es geändert haben, speichern und veröffentlichen Sie Ihre Einstellungen und aktualisieren Sie Ihre Seite. Jetzt sollte das aktualisierte Akzentfarben-Design andere Elemente automatisch gefüllt haben.

Typographie

Im Bereich Typografie können Sie die Standarddarstellung von Text auf Ihrer gesamten Website anpassen. Sie können die Größe Ihrer Schrift und Überschriften anpassen, die sich proportional auf alle Bereiche der Site auswirken. Sie können ihre Farben sowie die Linienhöhe, den Buchstabenabstand und die Schriftstile anpassen. Schließlich können Sie auch aus Dutzenden von Schriftarten auswählen, die auf jede angewendet werden sollen.

Typografie auf divi.png

Textkörpergröße

Dadurch wird der Textkörper des Standardtexts für Ihr Thema geändert. Die Standardgröße ist 14px.

Höhe der Körperlinie

Die Zeilenhöhe jeder Textzeile.

Erstellen Sie ganz einfach Ihre Website mit Elementor

Mit Elementor können Sie auf einfache Weise jedes Website-Design mit einem professionellen Look erstellen. Zahlen Sie nicht mehr teuer für das, was Sie selbst tun können. [Kostenlos]

Textgröße der Kopfzeile

Mit Divi können Sie hier die Standard-Textgröße Ihres Headers festlegen. Dies betrifft die Elemente von Divi als Titel des Header-Moduls Fullwidth.

Buchstabenraum der Kopfzeile

Der Abstand der Buchstaben passt den horizontalen Abstand zwischen den Buchstaben an. Der Abstand der Kopfzeilen wirkt sich auf alle Kopfzeilenebenen (h1, h2, h3, h4, h5, h6), Anführungszeichen und Folientitel aus.

Höhe der Kopfzeile

Ähnlich wie der Buchstabenabstand wirkt sich der Wert für die Höhe der Kopfzeile auf alle Kopfzeilenebenen (h1, h2, h3, h4, h5), Anführungszeichen und Titel aus. Folien.

Polizeistil

Verwenden Sie diese Optionen, um den Schriftstil Ihrer Überschriften zu ändern.

Body- und Header-Schriftart

Die Standardschrift in Divi ist Open Sans, aber Divi hat fast hundert Schriftarten zur Auswahl! Nutzen Sie diese integrierten Schriftarten und testen Sie die besten für Ihr Thema.

Farbe der Körperglieder

Die Farbe des Body-Links wird von der Akzentfarbe Ihres Themas übernommen. Aber Sie können es hier jederzeit ändern.

Textfarbe des Körpers

Hier können Sie die Farbe Ihres Textkörpers ändern.

Suchst du nach den besten WordPress Themes und Plugins?

Laden Sie die besten Plugins und WordPress-Themes auf Envato herunter und erstellen Sie ganz einfach Ihre Website. Schon mehr als 49.720.000 Downloads. [EXCLUSIVE]

Textfarbe der Kopfzeile

Hier können Sie die Farbe Ihrer Überschriften ändern.

Hintergrund

Im Hintergrundbereich können Sie die Hintergrundfarbe Ihres Themas anpassen sowie ein benutzerdefiniertes Hintergrundbild hochladen und dessen Platzierung auf der Seite anpassen. Hintergrundbilder und Farben funktionieren am besten, wenn sie mit der Einstellung „Boxed Layout“ im zuvor erwähnten Bedienfeld „Layouts“ verknüpft sind.

mach divi.png

Das ist alles für dieses Tutorial. Ich hoffe, dass Sie damit die Schriftart und das Layout des Divi-Themas besser anpassen können.

Andere Divi Tutorials

Dieser Artikel enthält Kommentare 0

Hinterlassen Sie einen Kommentar

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

Diese Website verwendet Akismet, um unerwünschte Inhalte zu reduzieren. Erfahren Sie mehr darüber, wie Ihre Kommentardaten verwendet werden.

Zurück nach oben
6 Aktien
Aktie3
tweet1
Registrieren2