Allgemein

Logo

Hier kannst du dein Logo für deine Website hinzufügen. Klicke dazu einfach auf „Hochladen“, um ein Logo in der Mediathek auszuwählen oder ein neues hochzuladen. Mit „Zurücksetzen“ kannst du das Logo wieder löschen. Dein festgelegtes Logo wird überall in deinem Divi-Theme angezeigt, wo ein Logo benötigt wird. Das Menümodul von Divi erfordert zum Beispiel ein Logo, das sich dynamisch anpassen lässt, um das globale Logo anzuzeigen.

Feste Navigationsleiste

Divi hat standardmäßig eine Navigationsleiste oben auf jeder Seite. Sie bleibt fixiert am oberen Bildschirmrand und ist auch beim Scrollen der Seite sichtbar. Scrollst du nach unten wird die Navigationsleiste leicht verkleinert, um mehr Platz für den restlichen Seiteninhalt zu schaffen. Wenn du diese Funktion deaktivierst wird die Navigationsleiste beim Verlassen des Ansichtsfensters automatisch unsichtbar werden.

Divi-Galerie Aktivieren

Du kannst die Funktion „Galerie erstellen“ in der WordPress-Medienbibliothek verwenden, um Bilder zu einer Galerie hinzuzufügen. Wenn du jedoch den Galerie-Stil von Divi anstelle des standardmäßigen WordPress-Galeriestils verwenden möchtest, aktiviere diese Option.

Standardpalette Farbauswähler

Divi zeigt standardmäßig eine Farbpalette mit 8 Farboptionen an. Hier kannst du deine eigenen Farben auswählen, die dann standardmäßig in allen Modulen angezeigt werden. Dadurch kannst du ganz einfach dein eigenes Farbdesign erstellen das dann auch für deine gesamte Webseite gilt.

Erstes Bild aus Beitrag verwenden

Normalerweise werden Miniaturbilder für Beiträge oder Seiten über benutzerdefinierte Felder erstellt. Wenn du jedoch lieber die Bilder verwenden möchtest, die bereits in deinem Beitrag als Miniaturbild vorhanden sind (ohne benutzerdefinierte Felder zu verwenden), kannst du diese Option aktivieren. Dadurch werden automatisch Miniaturbilder aus dem ersten Bild in deinem Beitrag generiert. Das Bild muss dazu aber auch auf deiner Website gehostet werden.

Blog-Modus

Standardmäßig werden Beiträge auf Index- und Startseiten gekürzt, um eine Vorschau des Beitrags anzuzeigen. Wenn du jedoch vollständige Beiträge auf Indexseiten anzeigen möchtest, wie bei einem herkömmlichen Blog, dann kannst du diese Funktion aktivieren.

Sidebar-Layout

Hier legst du fest, wo Standard-Seitenleisten auf einer Seite angezeigt werden. Wähle entweder „Links“ oder „Rechts“ aus dem Dropdown-Menü.

Shopseiten- und Kategorieseitenlayout für WooCommerce

Wenn du die WooCommerce-Integration nutzt, kannst du das Layout für Produkt- und Produktkategorieseiten festlegen.

Google API-Schlüssel

Damit Divi eine Google Maps Karte auf deiner Website anzuzeigt benötigst du einen API-Schlüssel von Google.  Hier kannst du deinen Google API-Schlüssel erstellen.

Du solltest diese Funktion nur aktivieren wenn du das wirklich brauchst, musst dann aber deinen Besuchern eine Opt-out Möglichkeit bieten andernfalls ist es nicht DSGVO konform und du riskierst Abmahnungen.

Verwenden Sie Google Fonts

Aktiviere diese Option nur, wenn du Google Fonts auf deiner Website verwenden möchtest. Diese werden dabei aber nicht lokal gehostet

Google Fonts bietet zwar tausende Schriftarten kostenlos zum Download an, um deine Webseite DSGVO gerecht zu betreiben und etwaige Abmahnungen zu vermeiden, solltest du diese Option aber unbedingt deaktivieren.

Die sicherere Variante ist es die Google Fonts lokal zu hosten. Wie das am einfachsten geht erfährst du hier.

Untergruppen von Google Fonts

Diese Option benötigst du nur wenn du Google Fonts für Sprachen wie z.B Chinesisch benötigst.

Stellen Sie das Google Maps Skript in die Warteschlange

Deaktiviere diese Option, um das Google Maps API-Skript von deinen Divi Builder-Seiten zu entfernen. Dadurch kann die Kompatibilität mit Drittanbieter-Plugins verbessert werden, die ebenfalls dieses Skript in die Warteschlange stellen.

Bitte beachte: Module, die auf der Google Maps API basieren, wie z.B. die „Karten“ und „Vollbreite Karten“ Module, sind weiterhin verfügbar, funktionieren jedoch nicht, solange diese Option deaktiviert ist (es sei denn, du fügst das Google Maps API-Skript manuell hinzu).

Wie weiter oben schon geschrieben, solltest du diese Funktion nur aktivieren wenn du das wirklich brauchst, musst dann aber deinen Besuchern eine Opt-out Möglichkeit bieten andernfalls ist es nicht DSGVO konform und du riskierst Abmahnungen.

Facebook-Symbol anzeigen

Aktiviere oder deaktiviere diese Option, um das Facebook-Symbol in Modulen anzuzeigen oder auszublenden, die dies erfordern, wie z.B. das Social Media Follow-Modul.

Leider bietet Divi von Haus aus nur eine sehr begrenzte Zahl an Links für Social Media Kanäle an, Zudem werden diese nicht DSGVO konform eingebunden. Die deutlich bessere Option ist ein PlugIn wie z.B Sheriff Wrapper oder ähnliche die dir mehr Möglichkeiten bieten und deine Social Media Kanäle DSGVO konform einbinden können. So vermeidest du Abmahnungen.

Twitter-Symbol anzeigen

Aktiviere oder deaktiviere diese Option, um das Twitter-Symbol in Modulen anzuzeigen oder auszublenden, die dies erfordern, wie z.B. das Social Media Follow-Modul.

Instagram-Symbol anzeigen

Aktiviere oder deaktiviere diese Option, um das Instagram-Symbol in Modulen anzuzeigen oder auszublenden, die dies erfordern, wie z.B. das Social Media Follow-Modul.

RSS-Symbol anzeigen

Aktiviere oder deaktiviere diese Option, um das RSS-Symbol in Modulen anzuzeigen oder auszublenden, die dies erfordern, wie z.B. das Social Media Follow-Modul.

E-Mail-Symbol anzeigen

Aktiviere oder deaktiviere diese Option, um das E-Mail-Symbol in Modulen anzuzeigen oder auszublenden, die dies erfordern, wie z.B. das Social Media Follow-Modul.

URL des Facebook-Profils

Wenn du ein eigenes Facebook-Profil hast kannst du die URL hier eintragen.

URL des Twitter-Profils

Wenn du ein eigenes Twitter-Profil hast kannst du die URL hier eintragen.

Instagram-Profil-URL

Wenn du ein eigenes Instagram-Profil hast kannst du die URL hier eintragen.

URL des RSS-Icons

Füge hier den Link zu deinem RSS-Feed ein.

Anzahl angezeigter Produkte auf WooCommerce-Archivseiten

Hier kannst du festlegen, wie viele WooCommerce-Produkte auf der Archivseite angezeigt werden sollen. Diese Option funktioniert unabhängig von den Einstellungen > Leseoptionen in wp-admin.

Anzahl von angezeigten Beiträgen auf Kategorieseite

Lege fest, wie viele Beiträge angezeigt werden sollen, wenn ein Benutzer eine Kategorieseite besucht.

Anzahl von angezeigten Beiträgen auf Archivseiten

Lege fest, wie viele Beiträge angezeigt werden sollen, wenn ein Benutzer eine Archivseite besucht.

Anzahl von angezeigten Beiträgen auf Suchseiten

Lege fest, wie viele Beiträge angezeigt werden sollen, wenn ein Benutzer eine Suchergebnisseite besucht.

Anzahl von angezeigten Beiträgen auf Tag-Seiten

Lege fest, wie viele Beiträge angezeigt werden sollen, wenn ein Benutzer eine Tag-Seite besucht.

Datumsformat

Mit dieser Option kannst du ändern, wie deine Daten angezeigt werden. Weitere Informationen findest du unter: Datum und Uhrzeit formatieren.

Textauszüge (Excerpt) verwenden, wenn definiert

Aktiviere diese Option, um Auszüge in Beiträgen oder Seiten zu verwenden.

Button „Nach oben“

Diese Option ermöglicht es dir, unten rechts auf deiner Seite eine Schaltfläche „Zurück nach oben“ anzuzeigen, während du scrollst.

Weiches Scrollen

Aktiviere diese Option, um einen sanften Scrolleffekt mit dem Mausrad zu erzielen. Flüssiges Scrollen ist auch besonders nützlich, wenn Ankerlinks verwendet werden, um auf bestimmte Bereiche der Seite zu verlinken.

Übersetzungen deaktivieren

Deaktiviere Übersetzungen, wenn du keine mehrsprachige Website erstellen möchtest.

Responsive Images aktivieren

Aktiviere diese Option, um beim Hochladen von Bildern und beim Hinzufügen des srcset-Attributs für das Bildelement reaktionsfähige Bildgrößen zu generieren.

Eigenes CSS

Hier kannst du beliebiges benutzerdefiniertes CSS eingeben, um deine Website anzupassen. Die deutliche bessere Option ist jedoch immer die Verwendung eines Child-Themes, da dein Code dann auch bei Updates sicher erhalten bleibt.

Leistung

Mit den Einstellungen auf dieser Seite kannst du deine Ladegeschwindigkeiten verringern und sorgst so für ein besseres Besuchererlebnis. Allerdings empfiehlt es sich diese Optionen unverändert zu lassen und statt dessen ein Caching PlugIn zu verwenden. Dadurch erhöhst du die Performance deiner Seiten deutlich besser und vermeidest zudem ungewöhnliches Verhalten deiner Seiten

Dynamisches Modul-Framework

Aktiviere diese Option, damit das Divi Framework nur die Module lädt, die auf der Seite verwendet werden, und die Logik für die verwendeten Funktionen verarbeitet.

Dynamisches CSS

Dynamisches CSS reduziert die CSS-Dateigröße erheblich, indem nur die Assets dynamisch generiert werden, die für die von dir verwendeten Funktionen und Module erforderlich sind. Dadurch wird jegliches Aufblähen von Dateien vermieden und die Ladezeiten werden erheblich verkürzt.

Dynamische Symbole

Die Divi-Icons sind in verschiedene Untergruppen unterteilt. Diese Teilmengen werden nur bei Bedarf geladen, basierend auf den auf jeder Seite verwendeten Modulen und Funktionen. Wenn du Zugriff auf die alle Icons auf allen Seiten benötigst (z. B. wenn du unsere Symbolschriftart in deinem untergeordneten Thema verwendest), kannst du diese Option deaktivieren und die gesamte Iconbibliothek auf allen Seiten laden.

Dynamisches Stylesheet inline laden

Diese Option entfernt die Datei Divi style.css aus der Warteschlange und druckt den Inhalt inline. Dadurch wird eine Rendering-Blockierungsanforderung entfernt und die PageSpeed-Werte einzelner Seiten verbessert. Es verhindert jedoch auch, dass die Datei style.css zwischengespeichert wird. Da das Stylesheet klein ist, wird empfohlen, diese Option aktiviert zu lassen.

Kritisches CSS

Kritisches CSS verbessert die Ladezeiten von Websites und den Google PageSpeed-Score erheblich, indem es unkritische Stile zurückstellt und Rendering-blockierende CSS-Anfragen eliminiert.

Kritische Schwellenhöhe

Wenn Critical CSS aktiviert ist, legt Divi einen „Above-the-Fold-Schwellenwert“ fest und verschiebt alle Stile für Elemente unterhalb des Folds. Dieser Schwellenwert ist jedoch nur eine Schätzung und kann je nach Gerät variieren. Durch Erhöhen der Schwellenwerthöhe werden weniger Stile verschoben, was zu etwas langsameren Ladezeiten, aber einer geringeren Wahrscheinlichkeit kumulativer Layoutverschiebungen führt. Wenn bei dir CLS-Probleme auftreten, kannst du die Schwellenwerthöhe erhöhen.

Dynamische JavaScript-Bibliotheken

Lade externe JavaScript-Bibliotheken nur dann, wenn sie von bestimmten Divi-Modulen auf der Seite benötigt werden. Dadurch wird ungenutztes JavaScript aus dem Hauptskriptpaket entfernt und die Ladezeiten verbessert.

Deaktivieren von WordPress-Emojis

WordPress lädt seine eigenen WordPress-Emojis. Moderne Browser unterstützen native Emojis, sodass die Emojis von WordPress in den meisten Fällen überflüssig sind. Durch das Entfernen von WordPress-Emojis werden nicht benötigte Assets entfernt und die Leistung verbessert.

Aufschieben von Gutenberg-Block-CSS

Wenn eine Seite mit dem Divi Builder erstellt wird, wird die Gutenberg-Block-CSS-Datei von der Kopfzeile in die Fußzeile verschoben. Da die Datei höchstwahrscheinlich nicht verwendet wird, können wir sie später laden. Dadurch wird eine Renderblockierungsanforderung entfernt und die Leistung verbessert.

Verbessern des Ladens von Google Fonts

Aktiviere das Caching von Google Fonts und lade sie inline. Dies reduziert Renderblockierungsanfragen und verbessert die Seitenladezeiten.

Du sollstest diese Option  ebenfalls deaktiviert lassen. Die sicherere Variante ist es die Google Fonts lokal zu hosten. Dadurch bist du DSGVO konform und die Ladezeiten deiner Seiten werden kürzer. Wie das am einfachsten geht erfährst du hier.

Verschieben von jQuery und jQuery Migrate

Wenn möglich, werden jQuery und jQuery Migrate in den Hauptteil verschoben, um die Ladezeiten zu verkürzen. Wenn ein Drittanbieter-Plugin jQuery als Abhängigkeit registriert, wird es zurück in den Kopf verschoben.

jQuery-Kompatibilitätsskript in die Warteschlange einreihen

Einige Skripts von Drittanbietern werden möglicherweise fälschlicherweise in die Warteschlange gestellt, ohne jQuery als Abhängigkeit zu deklarieren. Wenn jQuery verzögert wird, könnten diese Skripte kaputt gehen. Wenn nach der Aktivierung der Option „jQuery und jQuery-Migration verschieben“ Konsolenfehler auftreten, kannst du diese Option aktivieren, wodurch ein zusätzliches Kompatibilitätsskript geladen wird, das versucht, das Problem zu lösen. Du kannst diese Funktion deaktivieren, wenn ohne sie alles einwandfrei funktioniert.

Verzögern zusätzlicher Skripts von Drittanbietern

Warnung: Dies kann in manchen Fällen zu JavaScript-Fehlern führen und sollte mit Vorsicht verwendet werden. Wenn diese Option aktiviert ist, werden von Plugins und Themes registrierte Skripte zur Leistungsverbesserung zurückgestellt und jQuery wird immer in den Hauptteil geladen.