WordPress mit DIVI 4
Diese bebilderter Schritt-für-Schritt-Anleitung erklärt, wie Sie bestehende Texte und Bilder auf Ihrer WordPress-Webseite mit dem DIVI 4 Visual Builder selbstständig bearbeiten. Sie lernen den sicheren Umgang mit der Benutzeroberfläche, das Prüfen und Speichern Ihrer Änderungen sowie das Beheben häufiger Fehler, ohne Programmierkenntnisse.
Wichtig:
Diese Anleitung beschreibt die Bearbeitung bestehender Seiten. Änderungen am Theme Builder, an globalen Vorlagen, Menüs, CSS oder Plugins gehören in die Betreuung durch Ihre Agentur.
So nutzen Sie diese Anleitung
Arbeiten Sie die Kapitel beim ersten Mal in der angegebenen Reihenfolge durch. Später genügt meis...
Seite öffnen und Visual Builder starten
In diesem Kapitel erfahren Sie, wie Sie sich bei WordPress anmelden, die gewünschte Seite auswähl...
In WordPress anmelden
Öffnen Sie die Anmeldeadresse Ihrer Webseite. Üblich ist https://ihre-domain.de/wp-admin. Melden...
Visual Builder auf einer bestehenden Seite aktivieren
Wenn Sie die veröffentlichte Seite sehen und oben die schwarze WordPress-Leiste eingeblendet ist,...
Alternative über die Seitenverwaltung
Je nach Einrichtung können Sie in "Seiten > Alle Seiten" auch "Mit DIVI bearbeiten" auswählen. Be...
Warten, bis DIVI vollständig geladen ist
Bearbeiten Sie die Seite erst, wenn die farbigen Rahmen und Bedienleisten beim Überfahren der Inh...
Die DIVI-Oberfläche verstehen
Lernen Sie den Aufbau einer DIVI-Seite sowie die unterschiedlichen Farben, Bedienelemente und Ein...
Aufbau einer DIVI-Seite
Eine DIVI-Seite besteht aus ineinander verschachtelten Bausteinen. Diese Reihenfolge ist wichtig,...
Farbcodes im Visual Builder
Blau: normale Sektion Grün: Zeile Dunkelgrau: Modul Violett: Vollbreiten-Sektion oder zentrale D...
Die wichtigsten Symbole am Modul
Fahren Sie mit der Maus über einen Text oder ein Bild. Am jeweiligen Modul erscheint eine kleine ...
Einstellungsfenster: Inhalte, Design, Erweitert
Jedes DIVI Element besitzt die Reiter Inhalt, Design und Erweitert Inhalt (Content): Text, Bild...
Texte bearbeiten
Dieses Kapitel erklärt, wie Sie vorhandene Texte ändern, Überschriften und Absätze formatieren, L...
Schnellmethode: Text direkt auf der Seite ändern
Aktivieren Sie den Visual Builder. Klicken Sie direkt in den sichtbaren Text, den Sie ändern möc...
Textmodul über das Zahnrad öffnen
Öffnen Sie das dunkelgraue Textmodul. Im Reiter "Inhalt" finden Sie den vollständigen Texteditor.
Visuell oder Text/HTML
Der visuelle Editor bietet die üblichen Formatierungswerkzeuge. Visuell (Visual): Empfohlene An...
Überschrift, Absatz und Zeilenunmbruch richtig verwenden
Markieren Sie den Text und wählen Sie im Format-Menü den passenden Typ. Verwenden Sie Überschrift...
Fett, kursiv und Listen
Fett: für kurze Schlüsselbegriffe, nicht für ganze Absätze Kursiv: sparsam für Hinweise, Titel o...
Links einfügen oder ändern
Markieren Sie den Text, der anklickbar werden soll. Klicken Sie im Texteditor auf das Kettensymb...
Text aus Word, E-Mail oder PDF übernehmen
Kopieren Sie den gewünschten Text aus der Quelle. Fügen Sie ihn nach Möglichkeit ohne Formatieru...
Schrift und Abstände vorsichtig korrigieren
Wenn ein Text sichtbar vom restlichen Design abweicht, öffnen Sie den Reiter "Design". Dort liege...
Bilder bearbeiten und ersetzen
Hier lernen Sie, Bilder für die Website vorzubereiten, hochzuladen und in bestehenden Bildmodulen...
Bild vor dem Upload vorbereiten
Ein gut vorbereitetes Bild lädt schneller, bleibt scharf und lässt sich leichter wiederfinden. Or...
Vorhandenes Bildmodul öffnen
Fahren Sie mit der Maus über das zu ersetzende Bild. Öffnen Sie das dunkelgraue Bildmodul über d...
Neues Bild hochladen oder vorhandenes auswählen
Wählen Sie in der WordPress-Mediathek "Dateien hochladen", wenn das Bild noch nicht vorhanden is...
Alternativtext korrekt eintragen
Der Alternativtext beschreibt den Inhalt oder die Funktion des Bildes für Menschen, die es nicht ...
Bild ausrichten und Größe prüfen
Unter "Design > Ausrichtung" wählen Sie links, zentriert oder rechts. Ändern Sie die Ausrichtung ...
Bild verlinken oder in einer Lightbox öffnen
Im Bereich "Link" des Bildmoduls können Sie festlegen, was bei einem Klick geschieht. Link, Ligh...
Bildmoduls oder Hintergrundbild?
Nicht jedes sichtbare Bild ist ein Bildmodul. Flächige Titelbilder liegen häufig als Hintergrund ...
Layout vorsichtig anpassen
Dieses Kapitel zeigt Ihnen, wie Sie Module verschieben oder duplizieren und kleinere Anpassungen ...
Modul verschieben, duplizieren oder löschen
Verschieben: Modul am Kreuzpfeil greifen und an der vorgesehenen Position ablegen. Duplizieren: ...
Außenabstand und Innenabstand unterscheiden
DIVI unterscheidet Margin und Padding: Außenabstand (Margin): Abstand zwischen dem Modul und ben...
Kettensymbol und unterschiedliche Seitenwerte
Das Kettensymbol verbindet obere und untere bzw. linke und rechte Werte. Ist es aktiv, können Änd...
Responsive Werte für Desktop, Tablet und Smartphone
Viele DIVI-Einstellungen besitzen ein kleines Smartphone-Symbol. Nach dem Anklicken können Werte ...
Globale Elemente und Presets erkennen
DIVI kann Module und Designvorgaben global verwenden. Eine Änderung wirkt dann nicht nur auf der ...
Prüfen, speichern und beenden
Erfahren Sie, wie Sie Änderungen innerhalb eines Moduls und anschließend auf der gesamten Seite s...
Änderungen im Modul speichern
Am untren Rand jedes Einstellungsfensters stehen vier farbige Schaltflächen zur Verfügung: Rot...
Gesamte Seite speichern
Schließen Sie alle Einstellungsfenster mit dem grünen Haken. Öffnen Sie die untere DIVI-Leiste ü...
Desktop, Tablet und Smartphone prüfen
Öffnen Sie die untere DIVI-Leiste. Wählen Sie nacheinander Desktop-, Tablet- und Smartphone-Symb...
Visual Builder beenden
Nach erfolgreichem Speichern klicken Sie in der oberen WordPress-Leiste auf "Visual Builder beend...
Abschlusskontrolle in einem privaten Browserfenster
Öffnen Sie die bearbeitete Seite optional in einem privaten bzw. Inkognito-Fenster. So sehen Sie ...
Änderungen zurücknehmen und Fehler lösen
Dieses Kapitel zeigt Ihnen, wie Sie versehentliche Änderungen rückgängig machen und den DIVI-Bear...
Rückgängig und Wiederherstellen
Solange Sie im aktuellen Bearbeitungsvorgang bleiben, können Sie Änderungen über die violette Rüc...
DIVI-Bearbeitungsverlauf öffnen
Öffnen Sie die untere DIVI-Leiste Klicken Sie auf das Uhrsymbol bzw. "Editing History" Wählen Si...
Häufige Probleme und Lösungen
Problem Lösung Visual Builder lädt endlos Seite einmal neu laden, Browser Cache leeren, Er...
Wann Sie die Agentur kontaktieren sollten
Header, Footer, Navigation oder Theme-Builder-Vorlagen sollen geändert werden eine neue Seitenst...
Kurzanleitung und Abschlusscheck
Die Kurzanleitungen fassen die wichtigsten Arbeitsschritte für das Ändern von Texten und Bildern ...
Text in 60 Sekunden ändern
Seite öffnen und "Visuellen Builder aktivieren" anklicken. Text direkt anklicken oder dunkelgrau...
Bild in 60 Sekunden ersetzen
Bild vorab auf passendes Seitenverhältnis, Dateiname, Größe und Dateiformat vorbereiten. Seite i...
Abschlusscheck vor dem Verlassen
Prüfung Erledigt Rechtschreibung, Satzzeichen und Kontaktdaten geprüft Überschriftenh...
Was Sie nicht eigenständig ändern sollten
Nur nach Abstimmung Theme Builder, Header, Footer globale Module, globale Farben ode...