# 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"

<span style="background-color:rgb(251,238,184);">**Alternativ:**</span>

- 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

<table id="bkmrk-sektion-gr%C3%B6%C3%9Fter-cont" style="border-collapse:collapse;width:100%;"><colgroup><col style="width:33.333333%;"></col><col style="width:33.333333%;"></col><col style="width:33.333333%;"></col></colgroup><tbody><tr><td>**SEKTION**

Größter Container für einen Seitenabschnitt (Blau)

</td><td>**ZEILE**

Definiert die Spalten innerhalb der Sektion (Grün)

</td><td>**MODUL**

Das eigentliche Inhaltselement (Text, Button, Bild, etc.) (Schwarz)

</td></tr></tbody></table>

[![Schritt 2.png](https://hilfe.zachrau-kommunikation.de/uploads/images/gallery/2026-02/scaled-1680-/schritt-2.png)](https://hilfe.zachrau-kommunikation.de/uploads/images/gallery/2026-02/schritt-2.png)

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:

1. Mit der Maus über den Text fahren
2. Direkt hineinblicken und schreiben

**ODER**

1. Textmodul öffnen (Zahnrad-Symbol)
2. Reiter Inhalt
3. Text bearbeiten
4. Fenster schließen

Änderungen sind sofort sichtbar.

[![Schritt 3.png](https://hilfe.zachrau-kommunikation.de/uploads/images/gallery/2026-02/scaled-1680-/schritt-3.png)](https://hilfe.zachrau-kommunikation.de/uploads/images/gallery/2026-02/schritt-3.png)

# Bilder austauschen

Zum Austauschen eines Bildes:

1. Bild anklicken
2. Zahnrad anklicken
3. Bild auswählen
4. Neues Bild hochladen oder aus Mediathek wählen
5. Speichern

**TIPP: Verwenden Sie optimierte Bilder (WebP oder komprimiertes JPG), damit die Seite schnell lädt.**

[![Schritt 4.png](https://hilfe.zachrau-kommunikation.de/uploads/images/gallery/2026-02/scaled-1680-/schritt-4.png)](https://hilfe.zachrau-kommunikation.de/uploads/images/gallery/2026-02/schritt-4.png)

# Buttons und Links ändern

So ändern Sie einen Button:

1. Button anklicken
2. Zahnrad anklicken
3. Reiter Inhalt
4. Feld Link-URL anpassen
5. Schließen

Optional im Reiter Design Farben oder Größe ändern.

[![Schritt 5.png](https://hilfe.zachrau-kommunikation.de/uploads/images/gallery/2026-02/scaled-1680-/schritt-5.png)](https://hilfe.zachrau-kommunikation.de/uploads/images/gallery/2026-02/schritt-5.png)

# 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

[![Schritt 6.png](https://hilfe.zachrau-kommunikation.de/uploads/images/gallery/2026-02/scaled-1680-/schritt-6.png)](https://hilfe.zachrau-kommunikation.de/uploads/images/gallery/2026-02/schritt-6.png)

# Response Ansicht prüfen (Desktop / Tablet / Mobil)

[![image.jpeg](https://hilfe.zachrau-kommunikation.de/uploads/images/gallery/2026-02/scaled-1680-/image.jpeg)](https://hilfe.zachrau-kommunikation.de/uploads/images/gallery/2026-02/image.jpeg)

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:

<p class="callout warning">**Dashboard ➟ DIVI ➟ Theme Builder**</p>

**Dort:**

- Global Header bearbeiten
- Global Footer bearbeiten

Änderungen gelten normalerweise für die gesamte Webseite.

[![Schritt 8.jpg](https://hilfe.zachrau-kommunikation.de/uploads/images/gallery/2026-02/scaled-1680-/schritt-8.jpg)](https://hilfe.zachrau-kommunikation.de/uploads/images/gallery/2026-02/schritt-8.jpg)

# 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