Wann braucht ihr DIVI Booster?

Die Liste der kleinen Tweaks und Tricks, die euch mit DIVI Booster zur Verfügung stehen ist lang und erstreckt sich von allgemeinen Bereichen bis zu verschiedenen DIVI Modulen.

Nach der Installation findet ihr das Plugin unter “Divi” – “Divi Booster” im WordPress Backend und werdet von den folgenden Abschnitten empfangen.

Im Folgenden möchten wir euch einige der wichtigsten Funktionen aus den verschiedenen Bereichen vorstellen.

Seitenweite Einstellungen (Site-wide Settings)

Die in DIVI enthaltenen Social Media Icons für den Header und Footer sind eingeschränkt, dank DIVI Booster könnt ihr mehr als 160 weitere Soziale Netzwerke einfügen, darunter Standards wie YouTube, Instagram und Pinterest. Per Mausklick bewirkt ihr ausserdem, dass sich die Links automatisch in einem neuen Tab öffnen.

Ausserdem könnt ihr individuelle icons hinzufügen, die euch dann in den Blurbs (Informationstexten) und anderen Modulen zur Verfügung stehen.

Einige kleine, aber feine Details findet ihr in der Layout Sektion dieses Bereichs

• Hinzufügen eines Bildes oberhalb des Headerbereichs inkl. Verlinkung. (z.B. für besondere Aktionen)
• Sticky Widget Bereich am linken Bildrand für CTAs und anderes
• Entfernen des Schattens bei Verwendung des Box Layouts
• Festlegen der mobilen Inhaltsbreite in Prozent, standardmäßig nutzt DIVI hier nur 80% des verfügbaren Platzes.

Header

Es stehen Anpassungen für den Top Header, den Main Header und den Mobile Header zur Verfügung

• Top Header Anpassungen: Social Icons oder alle Icons rechts ausrichten, Anzeigen der Social Icons auf Mobile, Farbe der Links bei Hover, Text auf der linken Seite des Top Headers einfügen, Telefonnummer anklickbar machen.
• Main Header Anpassungen: zusätzlicher Widget Bereich unterhalb der Navigation, Vertikales Zentrieren der Navigation innerhalb des Divs, Verkleinern des fixierten Headers ab bestimmten Pixel beim Scrollen, Hamburger Icon auch am Desktop statt Inline Menu, komplettes Deaktivieren des Main Headers, Hintergrundfarbe der Untermenüs, Farbe der Links bei Hover, Abstände zwischen den Navigations Elemente, Ändern der Logo Link URL, Ändern der Hover Farbe des Such-Icons, Anzeigen des Seitentitels und der Tagline im Header, Hinzufügen von Trennstrichen zwischen den Navigations Elementen.
• Mobile Header Anpassungen: App-Style Header auf Smartphones (Ausnutzen der Bildschirmbreite), Ausblenden des Such-Icons, Text vor dem Hamburger Icon einfügen, Ausblenden der Elemente des Top Menus

Falls euch das nicht reicht solltet ihr euch unsere Vorstellung des MHMM Plugins für den DIVI Header anschauen, das noch viel weiter geht hinsichtlich der Anpassbarkeit des DIVI Headers.

Beiträge (Posts)

Hier könnt ihr das Beitragsbild in ganzer Inhaltsbreite anzeigen lassen anstatt es durch die Sidebar zu begrenzen. Ein weiterer wichtiger Punkt ist das Beheben der Responsiveness-Fehler beim Antworten-Button der Kommentare, ein bekannter Fehler von DIVI.

Aber die wohl wichtigste Funktion hier ist wohl, dass Bilder in Beiträge mit per Lightbox geöffnet werden können, wie das beim Verwenden von Bild Modulen im DIVI Builder der Fall wäre.

Sidebar

Ändert einfach die Hintergrundfarbe der Sidebar, entfern die graue Trennlinie und macht die Sidebar zusammenklappbar, um den Platz auf dem Bildschirm besser nutzen zu können.

Footer

• Zentrieren der Footer Links
• Eigene Footer Text festlegen mit automatischen Platzhaltern für das aktuelle Jahr
• Breite des Footers in Prozent definieren

DIVI Builder

Es gibt Einstellungen für den Backend Builder und für den Visual Frontend Builder:

• Backend DIVI Builder: Einstellungen des Builder im Vollbild anzeigen für mehr Übersicht, DIVI Builder für Custom Post Types aktivieren, Mindestbreite der DIVI Buttons festlegen, Option für Page Layouts (Sidebar, Volle Breite) auch bei Seiten und CPT nutzen, DIVI Builder automatisch bei neuen Beiträgen und Seiten aktivieren
• Visual Builder: Rahmen von Module bei Hover anzeigen, Verstecken des Visual Builders, Veröffentlichen Buttons am linken Bildschirmrand anzeigen

Modules

Dieser Bereich beinhaltet eine Vielzahl nützlicher Modifikationen von DIVI Standard Modulen

• Akkordion: Standardmäßig alle Akkordion Bereich geschlossen anzeigen und die Funktion, Akkordions per Mausklick schließen zu können.
• Countdown: Verbergen der führenden 0 bei den Tagen (“3 Tage” statt “03 Tage”)
• Bilder Galerie: Standardgrößen und Anzahl der Spalten in der Gitteransicht sowie festlegen der Rahmenfarbe, Zentrieren der Bilder in der Gitterdarstellung, “Slide In” Animation deaktivieren, Verbergen der Bildtitel
• Vollbreite Kopfzeile: Animation (Bounce) des Scroll Down Icons, Behebung eines Darstellungsfehlers im Internet Explorer
• Portfolio und Filterbares Portfolio: Standardgröße der Bilder und Anzahl der Spalten in der Gitteransicht festlegen, Ausnutzen der vollen Inhaltsbreite durch das Portfolio Modul
• Vollbreites Portfolio: Abstand zwischen den Bildern einfügen (normalerweise “kleben” die Bilder aneinander), Beschneiden und strecken der Bilder verhindern
• Beitrag Slider: Bild mit dem Beitrag verlinken, quadratische oder transparente Slider Pfeile
• Preistabellen: verbesserte Darstellung der Darstellung, gerundete Ecken um die Preistabellen, “+” und “x” für enthaltene und nicht enthaltene Features, Durchstreichen der nicht enthaltenen Features
• Slider: Höhe des Sliders in Pixel angeben, Hintergrundfarbe für den Slider Text festlegen (mit Transparenz), Slider Bilder rechts ausrichten, Links in einem neuen Tab öffnen,

Plugins

Für einige Drittanbieter Plugins gibt es auch noch etwas:

• Easy Digital Downloads: Ausblenden diverser Standardbereiche für den Checkout Bereich wie den Footer, die Sidebar, Header Links oder die Social Icons im Footer
• Woocommerce: Entfernen des Woocommerce Einkaufswagen Icons aus dem Header und 4-spaltige Darstellung in der Shopansich

CSS Manager

Ihr könnt zusätzliche CSS Inhalte hinterlegen, dabei kann gefiltert werden, wann diese CSS Angaben angewandt werden sollen:

• nach Benutzergruppen (z.B. nur für Admins, um Änderungen zu testen)
• Browser spezifische Styles
• Beschränkt auf bestimmte Seiten oder Beiträge
• Beschränkt auf bestimmte DIVI Layouts
• in Abhängigkeit von der Bildschirmbreite (10 Optionen verfügbar)

Developer Tools

• Import/Export der DIVI Booster Einstellungen, um diese in anderen WordPress Installationen anzuwenden
• Handling der vom Plugin erzeugten CSS- und JS-Codes  (Inline statt in einer separaten CSS Datei sowie Deaktivierung der Minifizierung)

Fazit zum DIVI Booster Plugin

Irgendwie kann man fast alles, was das Plugin kann auch händisch per CSS und JS Code bewerkstelligen. Und meist braucht man auf jeder WordPress Installation nur ein paar der angebotenen Funktionen. Aber: 19$ sind nicht viel Geld und über die Jahre habe ich sehr viel Zeit gespart und die Kosten schon wieder reingeholt. Und DIVI Booster gehört nach wie vor zu meinen Standard Plugins bei neuen WordPress Projekten. Denn: es verursacht keine Performance Einbrüche und der ein oder andere Haken ist immer angebracht.