Webseite mit DIVI bearbeiten

Seite im DIVI-Builder öffnen
Um Inhalte zu bearbeiten, muss zunächst der DIVI-Builder gestartet werden. Öffnen Sie im Frontend Ihrer Webseite die gewünschte Seite. Klicken Sie oben in der WordPress-Adminleiste auf "Visual Builder aktivieren" 
 Alternativ: 
 
 Dashboard ➟ Seiten 
 Seite auswählen ➟ Bearbeiten 
 Divi Builder verwenden anklicken 
 
 Die Seite lädt anschließend im visuellen Bearbeitungsmodus.

Aufbau einer DIVI-Seite verstehen
DIVI arbeitet immer mit drei Ebenen 
 
 
 
 
 SEKTION 
 Größter Container für einen Seitenabschnitt (Blau) 
 
 
 ZEILE 
 Definiert die Spalten innerhalb der Sektion (Grün) 
 
 
 MODUL 
 Das eigentliche Inhaltselement (Text, Button, Bild, etc.) (Schwarz) 
 
 
 
 
 
 Alle Inhalte befinden sich stets in Modulen. Wenn Sie etwas ändern möchten. bearbeiten Sie fast immer ein Modul.

Text auf der Seite bearbeiten
So ändern Sie Texte: 
 
 Mit der Maus über den Text fahren 
 Direkt hineinblicken und schreiben 
 
 ODER 
 
 Textmodul öffnen (Zahnrad-Symbol) 
 Reiter Inhalt 
 Text bearbeiten 
 Fenster schließen 
 
 Änderungen sind sofort sichtbar.

Bilder austauschen
Zum Austauschen eines Bildes: 
 
 Bild anklicken 
 Zahnrad anklicken 
 Bild auswählen 
 Neues Bild hochladen oder aus Mediathek wählen 
 Speichern 
 
 TIPP: Verwenden Sie optimierte Bilder (WebP oder komprimiertes JPG), damit die Seite schnell lädt.

Buttons und Links ändern
So ändern Sie einen Button: 
 
 Button anklicken 
 Zahnrad anklicken 
 Reiter Inhalt 
 Feld Link-URL anpassen 
 Schließen 
 
 Optional im Reiter Design Farben oder Größe ändern.

Layout anpassen (Spalten/Reihenfolge/Abstände)
Module verschieben 
 Element anklicken und per Drag-and-Drop an neue Position ziehen. 
 Spalten ändern 
 Zeile öffnen ➟ Layout wählen oder neue Zeile erstellen. 
 Abstände einstellen 
 Element öffnen ➟ Design ➟ Abstand 
 
 Padding = Innenabstand 
 Margin = Außenabstand

Response Ansicht prüfen (Desktop / Tablet / Mobil)
Unten im Builder finden Sie die Geräte-Icons: 
 
 Desktop 
 Tablet 
 Smartphone 
 
 Hier prüfen Sie: 
 
 Schriftgrößen 
 Zeilenumbrüche 
 Abstände 
 Bildgrößen 
 
 Viele Einstellungen können je Gerät separat gesetzt werden.

Header und Footer bearbeiten (Theme Builder)
Header und Folter werden meist nicht direkt auf der Seite bearbeitet.  
 Gehen Sie zu:  
 Dashboard ➟ DIVI ➟ Theme Builder 
 Dort: 
 
 Global Header bearbeiten 
 Global Footer bearbeiten 
 
 Änderungen gelten normalerweise für die gesamte Webseite.

Best Practise für DIVI-Redakteure
Häufig genutzte Elemente in DIVI Library speichern 
 Vor Änderungen Module duplizieren 
 Große Layoutänderungen zuerst auf Testseiten durchführen 
 Mobile Ansicht immer kontrollieren