WordPress-Website bearbeiten mit dem Divi-Builder
Startseite ▷ Wissen ▷ WordPress-Website bearbeiten mit dem Divi-Builder
Wie bearbeite ich meine Website mit dem Divi-Builder?
Hier findest du einen Leitfaden, wie du deine WordPress Website mit dem Divi-Builder bearbeiten kannst.
WordPress:
➤ Wie logge ich mich in WordPress ein?
➤ Wie erstelle ich ein Backup meiner WordPress-Website?
➤ Wo finde ich die erstellten Seiten meiner Website?
➤ Wo finde ich die erstellten Beiträge meiner Website?
Divi-Builder – Allgemein:
➤ Wie kann ich eine Seite im Divi-Builder aufrufen?
➤ Wie ist der Divi-Builder aufgebaut und was sind die Grundlagen?
➤ Wie speichere ich meine Anpassungen im Divi-Builder?
➤ Wie verlasse ich den Divi-Builder?
➤ Wie wechsle ich zwischen den Seiten im Divi-Builder?
➤ Wie komme ich vom Divi-Builder wieder zurück zu WordPress?
Divi-Builder – Inhaltliche Anpassungen
➤ Wie kann ich Textänderungen vornehmen?
➤ Wie kann ich Überschriften / Titel anpassen?
➤ Wie kann ich Button-Texte und deren Verlinkung anpassen?
➤ Wie kann ich Bilder austauschen?
➤ Wie kann ich Hintergrundbilder austauschen?
➤ Wie funktioniert die Divi-Bildergalerie?
Support:
➤ Ich brauche Hilfe mit meiner WordPress / Divi-Website
Wie logge ich mich auf meiner WordPress Website ein?
1. Gib in das Suchfeld deines Browsers den Anmeldelink zu deiner Website an (z. B. beispielseite.ch/wp-admin).
Hinweis: Hast du deine Website bei GoClick erstellen lassen, hast du den Link zur Anmeldeseite inkl. deinem persönlichen Login von uns erhalten. Falls du diese nicht mehr hast, kontaktiere uns gerne.
2. Nun landest du auf der WordPress-Anmeldeseite. Gib deinen Benutzername und das Passwort ein. Klicke danach auf „Anmelden“
3. Danach öffnet sich der WordPress-Administrationsbereich – das Dashboard deiner Website. Nun kannst du mit der Bearbeitung deiner Website starten.
Wie erstelle ich von meiner WordPress Website ein Backup?
Allgemein: Bevor du Anpassungen an der Website vornimmst, empfehlen wir dir ein Backup der Seite zu erstellen. Sollte bei der Bearbeitung der Seite etwas schieflaufen, kann auf das Backup zurückgegriffen und die Website wieder in den originalen Zustand gebracht werden.
Hinweis: Hast du deine Website bei GoClick erstellen lassen, ist bereits ein Backup-Tool (All-in-One WP Migration) bei dir installiert.
Hast du noch kein Backup-Tool, dann kontaktiere uns gerne, damit wir dich hierbei unterstützen können.
1. – Im Menü von WordPress findest du den Punkt „All-in-One WP Migration“. Klicke darauf und danach auf „Sicherungen“.
→ Wie komme ich zu meinem WordPress-Menü?
2. Klicke danach auf den grünen Button „EIN BACKUP ERSTELLEN“ und warte bis das Backup abgeschlossen ist. Je nach Grösse der Website kann dies einige Minuten dauern.
3. Sobald das Backup abgeschlossen ist, kannst du dieses über den grünen Button herunterladen oder das Fenster über den roten Button schliessen. Wenn du das Fenster schliesst, ohne das Backup herunterzuladen, wird dieses innerhalb deiner WordPress Website gespeichert.
Sicherer ist es jedoch, das Backup herunterzuladen. Denn sollte deine Website einen schwerwiegenden Fehler aufweisen und das Login in die Website auch nicht mehr möglich sein, dann kommst du auch nicht mehr an die Backupsran, welche innerhalb deiner WordPress-Website gespeichert sind. Wenn das Backup jedoch auf deiner eigenen Festplatte gespeichert ist, kann auf dieses wieder zugegriffen werden.
Wo finde ich die erstellten Seiten meiner Website?
1. Klicke im Menü von WordPress auf den Punkt „Seiten“.
→ Wie komme ich zu meinem WordPress-Menü?
2. Danach findest du auf der rechten Seite eine Auflistung mit allen Seiten deiner Website.
Wo finde ich die erstellten Blogbeiträge meiner Website?
1. Klicke im Menü von WordPress auf den Punkt „Beiträge“.
→ Wie komme ich zu meinem WordPress-Menü?
2. Danach findest du auf der rechten Seite eine Auflistung mit allen Beiträgen deiner Website.
Wie kann ich eine Seite oder einen Beitrag im Divi-Builder aufrufen?
1. Navigiere zuerst zu dem Punkt „Seiten“ oder „Beiträge“ im WordPress-Menü.
→ Wie komme ich zu meinem WordPress-Menü?
2. Wähle danach die Seite oder den Beitrag aus, welche du bearbeiten willst und klick dann auf „Edit With Divi“.
→ Wo finde ich die erstellten Seiten meiner Website?
→ Wo finde ich die erstellten Beiträge meiner Website?
3. Warte einen Moment bis sich die Seite öffnet und du im Bearbeitungsmodus dem „Visuellen Builder“ landest. Du erkennst den visuellen Builder an den Bearbeitungsflächen, welche sichtbar werden, sobald du mit der Maus über einzelne Bereiche / Elemente fährst.
Wie ist der Divi-Builder (Visuellen Builder) aufgebaut und welche grundlegenden Dinge sollte ich wissen?
Allgemein: Mit dem Visuellen Builder von Divi kannst du praktisch alle Inhalte wie Überschriften, Texte, Bilder, Buttons etc. deiner Website bearbeiten. Wenn du Änderungen im Divi-Builder vornimmst und diese speicherst, werden diese direkt auf der live Website angezeigt.
Abschnitte – Zeilen – Inhaltselemente
Der visuelle Bilder besteht aus Abschnitten (blau, orange oder lila), darin liegenden Zeilen (grün) und Inhaltselementen (grau). Wenn du über einzelne Elemente deiner Website fährst, erkennst du diese an den verschieden farbigen Rahmen, welche um die einzelnen Element angezeigt werden.
Bearbeitungsleiste von Divi
Die einzelnen Abschnitte, eine Zeilen und Inhaltselemente kannst du über die Bearbeitungsleiste, bearbeiten. Die Bearbeitungsleiste wird dir angezeigt, wenn du mit der Maus über einen Abschnitt, eine Zeile oder ein Inhaltselement drüberfährst.
1. Verschiebe-Symbol – Drag & Drop von Modulen
Alle Module können per Drag & Drop beliebig verschoben werden. Fahre dafür über das Verschiebe-Symbol (erstes Symbol in der Bearbeitungsleiste) des Moduls, welches du verschieben möchtest und ziehe dieses mit gedrückter Maustaste an eine andere Stelle.
2. Zahnrad-Symbol – Bearbeitungsfenster von Divi
Das Bearbeitungsfenster wird durch den Klick auf das Zahnrad-Symbol (zweites Symbol in der Bearbeitungsleiste) geöffnet. Das Bearbeitungsfenster ist in 3 Bereiche aufgeteilt (Inhalt, Design und Erweitert). Im Inhalts-Bereich werden Inhalte angepasst, der Design-Bereich gestaltet die Inhalte und im Erweitert-Bereich findest du zusätzliche Einstellungsmöglichkeiten.
Sobald du im Bearbeitungsfenster Änderungen vorgenommen hast, kannst du diese unten mit dem grünen Haken bestätigen. Das Bearbeitungsfenster wird dann automatisch wieder geschlossen. Die Anpassung ist jetzt bestätigt, aber noch nicht gespeichert.
→ Wie speichere ich meine Anpassungen im Divi-Builder?
Wenn du im Bearbeitungsfenster Änderungen vorgenommen hast und damit nicht zufrieden bist, kannst du auf das rote Kreuz klicken. Das Bearbeitungsfenster wird nun automatisch geschlossen und deine Änderungen verworfen.
Während der Bearbeitung im Bearbeitungsfenster kannst du auch die rückwärts und vorwärts Pfeile nutzen, um in deinen einzeln gemachten Bearbeitungsschritten vor oder zurückzuspringen.
3. Duplizieren-Symbol – Module klonen
Wenn du auf das duplizieren Symbol klickst, wird das entsprechende Module geklont und das Duplikat darunter eingefügt.
4. Gitter-Symbol – Aufteilung ändern
Das Gitter-Symbol findest du nur bei den Zeilen (grün). Mit Klick auf das Gitter-Symbol kann die Aufteilung der Zeile geändert werden.
5. Speicher-Symbol – Modul in der Divi-Bibliothek ablegen
Mit Klick auf das Speicher-Symbol kann das Modul in der Divi-Bibliothek abgelegt werden.
6. Papierkorb Symbol – Modul löschen
Mit Klick auf das Papierkorb-Symbol wird das Modul gelöscht.
7. Drei Punkte Symbol – weiteres
Mit Klick auf das die drei Punkte öffnet sich ein Menü für weitere Anpassungen.
Wie speichere ich meine Anpassungen im Divi-Builder?
Allgemein: Nach dem Bearbeiten einer Seite oder auch eines Blogartikels im Divi-Builder müssen die Anpassungen noch gespeichert werden.
1. Klicke dafür unten auf der Seite auf den lila Punkt mit drei weissen Kreisen. Nun öffnet sich ein neues Menü mit weiteren Einstellungsmöglichkeiten.
2. Auf der rechten Seite findest du einen grünen Button „Speichern“.
3. Nach erfolgreichem Speichern kannst du den visuellen Builder verlassen.
→ Wie verlasse ich den Divi-Builder?
Wie verlasse ich den Divi-Builder?
Allgemein: Wenn du mit den Änderungen fertig bist und diese auch gespeichert hast, kannst du den Divi-Builder verlassen.
Ganz oben findest du einen schwarzen Balken von WordPress. Klicke dort auf „Beenden Sie Visual Builder“. Der Builder wird nun beendet. Du erkennst, dass der Builder beendet ist, wenn keine farbigen Abschnitte, Zeilen und Inhaltselemente mehr angezeigt werden, wenn du mit der Maus über einzelne Elemente fährst.
Wie wechsle ich zwischen einzelnen Seiten im Divi-Builder?
Allgemein: Wenn du eine Seite deiner Website mit dem Divi-Builder bearbeitet hast und nun eine weitere Seite bearbeiten willst, gibt es zwei Möglichkeiten die Seite zu wechseln.
Über das Menü:
1. Beende zuerst den visuellen Builder der Seite, auf welcher du dich befindest.
→ Wie verlasse ich den Divi-Builder?
2. Sobald dieser beendet ist, kannst du über das Menü deiner Website die Seite anklicken, welche du als nächstes bearbeiten willst.
3. Sobald die neue Seite geladen hat, kannst du den visuellen Builder wieder aktivieren und mit der Bearbeitung der neuen Seite weitermachen.
Über „Seiten“ im WordPress:
1. Beende zuerst den visuellen Builder der Seite, auf welcher du dich befindest.
→ Wie verlasse ich den Divi-Builder?
2. Klicke nun auf das WordPress-Symbol ganz oben in der schwarzen WordPress Leiste.
3. Danach landest du wieder zurück in WordPress und kannst nun über das Menü zu den „Seiten“ navigieren und dort die Seite, welche du als nächstes bearbeiten willst, anwählen und auf „Edit With Divi“ klicken.
→ Wo finde ich die erstellten Seiten meiner Website?
Wie komme ich vom Divi-Builder wieder zurück zur WordPress?
1. Beende zuerst den visuellen Builder der Seite, auf welcher du dich befindest.
→ Wie verlasse ich den Divi-Builder?
2. Klicke nun auf das WordPress-Symbol ganz oben in der schwarzen WordPress Leiste. Danach landest du wieder im Backend von WordPress.
Wie kann ich inhaltliche Textänderungen vornehmen?
1. Öffne die Seite an welcher du eine Textänderung vornehmen willst im Divi-Builder und schaue, dass dieser aktiviert ist.
→ Wie öffne ich eine Seite im Divi-Builder?
2. Fahre nun mit der Maus über das Textelement, welches du bearbeiten willst. Um das Textelement erscheint nun einen grauen Rahmen, sowie wird eine Bearbeitungsleiste angezeigt.
→ Grundlagen, die man zum Divi-Builder wissen sollte
3. Klicke nun in der Bearbeitungsleiste auf das Zahnrad-Symbol (zweites Symbol).
4. Nun öffnet sich ein Bearbeitungsfenster, in welchem du deinen Text anpassen, ergänzen etc. kannst. Du hast hier auch die Möglichkeit deinen Text fett oder kursiv darzustellen, du kannst eine Auflistung erstellen, deinen Texte einmitten und einiges mehr.
5. Bestätige deine Anpassungen zum Schluss mit dem grünen Hacken und speichere zum Schluss alles.
→ Wie speichere ich meine Anpassungen im Divi-Builder?
Wie kann ich Überschriften / Titel inhaltlich anpassen?
1. Öffne die Seite an welcher du Überschriften / Titel bearbeiten willst im Divi-Builder und schaue, dass dieser aktiviert ist.
→ Wie öffne ich eine Seite im Divi-Builder?
2. Fahre nun mit der Maus über die Überschrift, welche du bearbeiten willst. Um die Überschrift, welche ein Textelement ist, erscheint nun einen grauen Rahmen, sowie wird eine Bearbeitungsleiste angezeigt.
→ Grundlagen, die man zum Divi-Builder wissen sollte
3. Klicke nun in der Bearbeitungsleiste auf das Zahnrad-Symbol (zweites Symbol).
4. Nun öffnet sich ein Bearbeitungsfenster, in welchem du die Überschrift anpassen, ergänzen etc. kannst. Du hast hier auch die Möglichkeit deine Überschrift fett oder kursiv darzustellen, du kannst diese einmitten und einiges mehr.
→ mehr über das Bearbeitungsfenster erfahren
5. Bestätige deine Anpassungen zum Schluss mit dem grünen Hacken und speichere zum Schluss alles.
→ Wie speichere ich meine Anpassungen im Divi-Builder?
Wie kann ich Button-Texte und deren Verlinkung anpassen?
1. Öffne die Seite, an welcher du einen Button anpassen willst, im Divi-Builder und schaue, dass dieser aktiviert ist.
→ Wie öffne ich eine Seite im Divi-Builder?
2. Fahre nun mit der Maus über den Button, welchen du bearbeiten willst. Um den Button erscheint nun einen grauen Rahmen und die Bearbeitungsleiste wird angezeigt.
→ Grundlagen, die man zum Divi-Builder wissen sollte
3. Klicke nun in der Bearbeitungsleiste auf das Zahnrad-Symbol (zweites Symbol).
4. Nun öffnet sich ein Bearbeitungsfenster, in welchem du unter „Text“ → „Button“ den Text des Buttons bearbeiten kannst. Unter „Link“, kannst du, falls nötig den Link anpassen.
Möchtest du auf eine andere Unterseite deiner Website verlinken, gib im Feld „Link-URL des Buttons“ einen Schrägstrich → / ein und dann den Permalink der Seite, welche du verlinken möchtest. Den entsprechenden Permalink kannst du oben aus der URL kopieren.
Als Beispiel: Button auf die Kontaktseite verlinken:
✅ /kontakt → dies ist der Permalink
❌ www.beispielseite.ch/kontakt → dies ist die gesamte URL
Wenn du auf die Startseite verlinken willst, reicht es nur einen Schrägstrich einzugeben.
Als Beispiel: Button soll auf die Startseite verlinken:
✅ /
❌ /home
❌ www.beispielseite.ch/home
5. Bestätige deine Anpassungen zum Schluss mit dem grünen Hacken und speichere zum Schluss alles.
→ Wie speichere ich meine Anpassungen im Divi-Builder?
Wie kann ich Bilder austauschen?
1. Öffne die Seite, bei welcher du Bilder anpassen willst, im Divi-Builder und schaue, dass dieser aktiviert ist.
→ Wie öffne ich eine Seite im Divi-Builder?
2. Fahre nun mit der Maus über das Bild, welches du bearbeiten willst. Um das Bild erscheint nun einen grauen Rahmen und die Bearbeitungsleiste wird angezeigt.
→ Grundlagen, die man zum Divi-Builder wissen sollte
3. Klicke nun in der Bearbeitungsleiste auf das Zahnrad-Symbol (zweites Symbol).
4. Nun öffnet sich ein Bearbeitungsfenster. Klicke danach auf das Bild, welches aktuell angezeigt wird.
5. Es öffnet sich ein neues Fenster. Unter „Datei hochladen“ kannst du eine lokale Datei von deinem Gerät hochladen. Achte darauf, dass die Dateigrösse des Bildes, welches du hochlädst, nicht zu gross ist. Am bester unter 200 kB und nicht grösser als 1 MB.
Unter „Mediathek“ findest du die Bilder, welche bereits hochgeladen sind.
Wähle ein Bild aus und klicke dann unten rechts auf „Ein Bild hochladen“. Nun landest du wieder im Bearbeitungsfenster, das Bild wurde nun angepasst.
6. Bestätige deine Anpassung nun noch mit dem grünen Hacken und speichere im Anschluss alles ab.
→ Wie speichere ich meine Anpassungen im Divi-Builder?
Wie kann ich Hintergrundbilder austauschen?
1. Öffne die Seite, bei welcher du ein Hintergrundbild anpassen willst, im Divi-Builder und schaue, dass dieser aktiviert ist.
→ Wie öffne ich eine Seite im Divi-Builder?
2. Den Hintergrund kannst du über den Abschnitt (blau, orange oder lila) bearbeiten. Fahre dafür mit der Maus über den Hintergrund, welchen du bearbeiten willst. Um das Bild erscheint nun einen blauen, orangen oder lila Rahmen und die Bearbeitungsleiste wird angezeigt.
→ Grundlagen, die man zum Divi-Builder wissen sollte
3. Klicke nun in der Bearbeitungsleiste auf das Zahnrad-Symbol (zweites Symbol).
4. Nun öffnet sich ein Bearbeitungsfenster. Klicke auf den Punkt „Hintergrund“, es öffnet sich nun ein Dropdown.
5. Um dein Hintergrundbild auszutauschen, wähle das Bild-Symbol aus. Klicke nun unten auf das graue „Plus-Symbol“ oder auf das Bild, wenn bereits eines hinterlegt und angezeigt wird.
Du kannst aber auch eine Farbe, ein Verlauf oder ein Video als Hintergrund auswählen.
6. Es öffnet sich ein neues Fenster, welches dir die Möglichkeit bietet eine lokale Datei von deinem Gerät hochzuladen oder ein Bild, welches bereits in der Mediathek deiner Website ist, als Hintergrund auszuwählen.
→ Erfahren mehr darüber unter „Wie kann ich Bilder austauschen“→ Punkt 5
7. Nachdem du ein Bild ausgewählt hast, landest du wieder im Bearbeitungsfenster. Bestätige deine Anpassung nun noch mit dem grünen Haken und speichere im Anschluss alles ab.
→ Wie speichere ich meine Anpassungen im Divi-Builder?
Wie funktioniert die Divi-Bildergalerie?
1. Öffne die Seite, bei welcher du eine Bildergalerie bearbeiten willst, im Divi-Builder und schaue, dass dieser aktiviert ist.
→ Wie öffne ich eine Seite im Divi-Builder?
2. Fahre nun mit der Maus über die Galerie, welche du bearbeiten willst. Um die Galerie erscheint einen grauen Rahmen und die Bearbeitungsleiste wird angezeigt.
3. Klicke nun in der Bearbeitungsleiste auf das Zahnrad-Symbol (zweites Symbol). Jetzt öffnet sich ein Bearbeitungsfenster.
Bilder hinzufügen
Klicke auf das graue „Plus-Symbol“, wenn du weiterer Bilder zur Galerie hinzufügen willst. Es öffnet sich ein neues Fenster, welches dir die Möglichkeit bietet eine lokale Datei von deinem Gerät hochzuladen oder ein Bild, welches bereits in der Mediathek deiner Website ist, auszuwählen.
→ Erfahren mehr darüber unter „Wie kann ich Bilder austauschen“→ Punkt 5
Alle Bilder mit einem Haken oben rechts in der Bildecke werden der Galerie hinzugefügt, sobald du unten rechts auf «hinzufügen» klickst.
Bilder löschen
Fahre über ein Bild, welches du löschen möchtest und klicke auf das «Abfalleimer-Symbol». Das Bild ist jetzt aus deiner Galerie entfernt, befindet sich aber noch in der Mediathek deiner Website.
Reihenfolge ändern
Fahre über das Bild, welches du verschieben möchtet und ziehe dieses mit gedrückter Maustaste an einen anderen Platz.
Bildreihenfolge / Bildanzahl
Im Bearbeitungsfenster unterhalb vom Punkt „Bilder“ findest du die Punkte „Bildreihenfolge“ und „Bildanzahl. Hier kannst du einstellen, ob deine Bilder der Reihe nach „Standard“ (in der Reihenfolge wie sie oben zu sehen sind) oder zufällig angeordnet angezeigt werden sollen.
Mit der Bildanzahl kannst du definieren, wie viele Bilder in der Galerie angezeigt werden sollen. Gibst du also eine Bildanzahl von 5 ein, fügst aber 10 Fotos zur Galerie hinzu, werden trotzdem nur 5 Fotos in der Galerie angezeigt.
4. Sobald du alle Anpassungen vorgenommen hast, bestätige diese nun noch mit dem grünen Haken und speichere im Anschluss alles ab.
→ Wie speichere ich meine Anpassungen im Divi-Builder?
Ich brauche Hilfe mit meiner WordPress / Divi-Website
Hast du Probleme oder offene Fragen bei der Bearbeitung deiner Divi-Website auf WordPress? Oder wärst du froh, wenn wir uns um die von dir gewünschten Anpassungen kümmern? Dann kontaktiere uns, wir helfen dir gerne weiter.
