Bei DIVI Presets handelt es sich um die Umsetzung von CSS-Klassen im visuellen Divi-Builder. Was wenig spektakulär und eigentlich sogar längst überfällig klingt, eröffnet ganz neue Möglichkeiten mit DIVI. Bisher war es nur möglich und oft nötig, Elemente im Divi-Builder CSS-Klassen zuzuweisen, um diese dann ‚per Hand‘ per CSS zu definieren. Diese Eigenschaft wandert nun direkt in den Builder.
Es gibt jedoch auch Unterschiede zwischen DIVI Presets und CSS-Klassen: So wirken sich CSS-Anweisungen auf alle zugewiesene Elemente aus, während Presets Modul-Abhängig sind. Ändert man zum Beispiel in einem Text-Modul das Aussehen der Überschriften, ändert dies nicht die Überschriften bei anderen Modulen. Es müssen also für alle gewünschten Module eigene Presets erzeugt werden.
Übersicht über Vorgaben in Presets
Arbeitet man konsequent und speichert Veränderungen als Vorlage in DIVI Presets, so wird diese Vorlagen-Bibliothek im Laufe der Zeit ganz schön anwachsen. Und anfangs weiß man sicher noch, welche Vorlage sich hinter dem Begriff ‚button7‘ verbirgt. Will man jedoch später die Webseite ändern, so fängt das große Rätselraten an. Wichtig ist natürlich die einzelnen Vorgaben nachvollziehbar zu benennen. Für die eigene Übersicht sowie für die Kommunikation mit dem Kunden dient perfekt eine
eigene Seite mit mit Beispielen der Presets
Diese Seite gibt einen Überblick und zeigt alle verwendeten Stile an. Auch werden die Vorgaben von DIVI Presets ausschließlich auf dieser Seite geändert! Eine gute Vorlage finde ich z.B. das Marketing-Preset von Elegant Themes.
Diese Vorlage wird als Seite in die (bestehende) Webseite importiert. Damit sie Webseitenbesucher nicht zu sehen bekommen dient ein Passwortschutz sowie eine noindex-Anweisung.
Beispiel für DIVI Presets
Regelmäßige Änderungen an einer Webseite
Nehmen wir einen Kunden an, der regelmäßig zu Quartalsende wiederholt mit einer einwöchigen Aktion sein Lager räumen will. Bisher musste also zweimal pro viertel Jahr (Aktions-Beginn und -Ende) die Webseite dementsprechend angepasst werden. Mit DIVI Presets erschafft man nun einfach eine Vorlage ‚ausverkauf‘ und weißt alle betroffenen Blöcke und Module dieser Vorlage zu. Nun kann einfach statt die ganze Webseite zu überarbeiten mit einem Mausklick diese Vorlage ‚ausverkauf‘ ausgeblendet bzw. wieder eingeblendet werden und alle Seiten passen sich autoamtisch an.
Gestalten durch kreatives ‚probieren‘
DIVI lädt durch seine schnelle und freie Möglichkeiten direkt dazu ein, Seiten direkt kreativ zu erstellen. Ist man mit einer einzelnen Seite zufrieden, so erzeugt man aus den Elementen nun einzelne Vorlagen, die man in den Presets speichert. Alle weiteren Seiten baut man nun auf diesen Presets bestehend auf, es entsteht so automatisch eine einheitlich aussehende Homepage.
Gestalten durch genaue Vorgaben
Größere Firmen haben oft ein eigenes CI oder Styleguide, an welchen man sich zu richten hat. Mit DIVI Presets kann man nun die Grundelemente genau nach diesen Vorgaben gestalten. Werden dann beim Webdesign konsequent diese Presets angewendet, so entspricht die Homepage automatisch dem CI bzw. Styleguide. Dieser Artikel gibt hierzu Tipps.
