facebook_pixel

Nachdem wir uns im letzten Teil unserer Serie mit dem Einstellungsbereich des Divi Blog Moduls unter “Inhalt” vertraut gemacht haben, kümmern wir uns diesmal um die Optionen im Bereich “Ansicht” und “Fortgeschritten”.

Entwurf

Im Einstellungsbereich Entwurf finden sich überwiegend Optionen, die sich auf die Darstellung der Elemente des Blog Moduls beziehen.

Divi Theme Blog Modul: Einstellungen Layout

Entwurf: Layout

Über die Layout Auswahl kann zwischen der Anzeige der Blogbeiträge über die volle Breite oder als Gitter gewählt werden.

Volle Breite:

Divi Theme: Default Blogansicht

Gitter:

Falls die Option “Gitter” gewählt wird, erscheint eine zusätzliche Schaltfläche “Schlagschatten verwenden“. Bei Aktivierung werden die Gitterelemente mit einem leichten Schlagschatten versehen.

Overall: Angezeigtes Bild-Overlay

Die Aktivierung dieser Option sorgt für einen Overlay Effekt. Fährt der Mauszeiger über einen Beitrag, wird dessen bevorzugtes Bild (auch Beitragsbild, Featured Image oder Thumbnail genannt) mit einer Overlay Farbe versehen und ein Symbol angezeigt.

Die genauen Einstellungen erscheinen erst nach Aktivierung der Option:

  1. Overlay-Symbolfarbe
  2. Farbe des Overlays beim Herüberfahren
  3. Iconpicker fürs Herüberfahren zur Auswahl des Symbols

Divi Theme Blog Modul: Einstellungen Overall

Header, Body, Meta Text

Es folgen hintereinander drei Abschnitte für die Texteinstellungen der Überschrift (Header), des Fließtextes (Body) und der Metainformationen (Meta) wie Datum etc. Jeder Einstellungsabschnitt ist gleich aufgebaut:

Divi Theme Blog Modul: Einstellungen Header Text

Als erstes wird die Schriftart festgelegt inkl. der gewünschten Formatierung wie fett, schräggestellt, nur Großbuchstaben oder unterstrichen. Anschließend die Schriftgröße, -farbe, der Abstand zwischen den Zeichen und zwischen den Zeilen.

Rand

Wenn die Option “Rand” aktiviert wird, erscheinen weitere Einstellungsmöglichkeiten, die die Art des umschließenden Rahmens um die einzelnen Elemente bestimmt. Wobei in der Gitteransicht auch ohne aktiviertem Rand stets ein feiner grauer Rahmen verwendet wird.

Divi Theme Blog Modul: Einstellungen Rand

Fortgeschritten

Im Einstellungsbereich “Fortgeschritten” finden sich fast ausschließlich Optionen im Zusammenhang mit CSS.

Divi Theme Blog Modul: Einstellungen Fortgeschritten

CSS-ID & Klassen

Dem eingebundenen Blog-Modul kann sowohl eine “CSS-ID” als auch eine “CSS-Klasse” zugewiesen werden. Damit besteht die Möglichkeit dieses Elemente über CSS-Code noch individueller zu gestalten.

Benutzerdefinierte CSS

Im Folgenden Abschnitt “Benutzerdefinierte CSS” kann CSS für verschiedene Elemente des Blogmoduls vergeben werden. Dazu gehören: Vorher, Hauptelement, Nachher, Titel, Post Meta, Seitennavigation, Angezeigtes Bild, Mehr-lesen-Button.

Sehr praktisch: Wenn auf den jeweiligen Titel oder in den darunterliegenden Bereich geklickt wird, erscheint neben dem Titel der dazugehörige CSS-Selektor mit dem das Element auch direkt in der style.css eines Child Themes angesprochen werden kann.

Sichtbarkeit: Deaktivieren auf

Mit dieser Einstellung lässt sich die Anzeige des Blog Moduls auf bestimmten Gerätearten deaktivieren, falls z.B. die Anzeige des Moduls auf einem Handy nicht erwünscht ist.

Divi Theme Blog Modul: Einstellungen Sichtbarkeit

Artikelreihe Divi Blog Modul

  1. Divi Theme Blogansicht: Standardoptionen verstehen & nutzen
  2. Divi Blog Modul 1: Einstellungen für Inhalt
  3. Divi Blog-Modul 2: Einstellungen für Entwurf & Fortgeschritten

Durch die weitere Nutzung der Seite stimmst du der Verwendung von Cookies zu. Weitere Informationen

Die Cookie-Einstellungen auf dieser Website sind auf "Cookies zulassen" eingestellt, um das beste Surferlebnis zu ermöglichen. Wenn du diese Website ohne Änderung der Cookie-Einstellungen verwendest oder auf "Akzeptieren" klickst, erklärst du sich damit einverstanden.

Schließen