Wichtig: Ich empfehle dir, meine drei Installationsvideos auf dieser Seite anzuschauen. Dies ist der schnellste Weg für eine reibungslose Installation. Für die Eiligen habe ich die wichtigsten Schritte kurz zusammengefasst:
1
- Lade das Basis-Theme herunter.
- Entpacke den Download-Order di-basis-entpacken.zip
- Installiere die Datei di-basis.zip
Tipp: Bricht der Upload ab, installiere per FTP
2
- Lade das Design herunter
- Entpacke den Order und gehe zum Unterordner /Themes/
- Installiere die Datei di-NAME-entpacken/di-name.zip
3
- Logge dich in WordPress ein. Gehe zu „Divi > Theme Customizer“. Klicke oben auf das Pfeilsymbol. Importiere die Theme-Einstellungen: /SourceFiles/Name-Einstellungen.json
- Gehe zu „Divi > Bibliothek“. Klicke oben auf Import & Export. Importiere die Layouts des Themes: /SourceFiles/Name-Layouts.json
- Alle Designs sind nun in deiner Bibliothek. Du kannst jeder Seite beliebige Layouts zuordnen. Erstelle eine Seite > Verwende den Divi Builder > Weiter Layouts > Gespeicherte Layouts
Anleitung um Detail …
Schritt 1/3: Theme installieren
Kurzanleitung: Upload per WordPress
1. Gehe zu DESIGN > THEMES und klicke oben auf den Button hinzufügen.
2. Im nächsten Fenster klicke auf THEME HOCHLADEN
3. Klicke auf DATEI AUSWÄHLEN.
4. Wähle jetzt aus dem ENTPACKTEN DOWNLOADORDNER die Datei DI-BASIS.ZIP
5. Aktiviere NICHT das Basistheme. Im nächsten Schritt laden wir das Design. Dies ist ein "Childtheme" und dieses werden wir dann auch aktivieren.
Kurzanleitung: Upload per FTP
Hinweis: Diese Methode ziehe ich übrigens immer der Standard-Installation über das Dashboard vor, da sie schneller und zuverlässiger ist – und du dein "altes" Theme immer behältst und jederzeit in der Version zurückgehen kannst.
1. Logge dich per FTP ein.
Lade ein FTP-Programm. Ich nutze das kostenlose Programm FileZilla (Mac/Windows): https://filezilla-project.org
Starte FileZilla und trage deine FTP-Zugangsdaten ein. Du bekommst diese von deinem Hoster. In der Regel ist dies der Servername, dein FTP-Benutzername und dein FTP-Passwort.
Gehe zu dem Unterordner /wp-content/themes/
Tipp bei Updates: Benenne das Theme di-basis um, z.B. fügst du die aktuelle Versionsnummer hinzu. Dadurch bleibt dir das alte Theme erhalten und du kannst bei einem Problem jederzeit in der Version zurückspringen.
2. Basistheme installieren
Lade das Basistheme herunter, entpacke die Download-Datei "di-basis-entpacken" und gehe zum Ordner: di-basis.
Lade jetzt den Ordner "di-basis" per FTP in den Ordner wp-content/themes.
Schritt 2/3: Design installieren
Im zweiten Schritt installiere das Design (Child-Theme). In diesem werden alle Anpassungen gespeichert, so dass deine Daten bei einem Update erhalten bleiben.
Wichtig: Das Child-Theme darf erst installiert werden, nachdem das Basis-Theme installiert wurde.
Kurzanleitung: Installation Design
Kurzanleitung:
- Download das gewünschte Design.
- Entpacke den ZIP-Ordner „di-THEME-entpacken.zip“.
- Gehe in den Unterordner „di-THEME-entpacken > Themes“
- Installiere den ZIP-Ordner „di-THEME.zip“ über WordPress
- (Alternativ) Lade den entpackten Ordner
„di-THEME-entpacken.> di-THEME“ per FTP in den Ordner wp-content/themes hoch. - Aktiviere das Design (Child-Theme)
Anmerkung zur Installation Das Besondere an dem Theme DI Artist ist das linke Menü und der Hintergrund. Menü links Das linke Menü aktiverst du unter: DESIGN > ANPASSEN > Header & Navigation > Headerformat > Vertikale Navigation aktivieren Hintergrundbild Das Hintergrundbild legst du unter DESIGN > ANPASSEN > Allgemeine Einstellungen > Hintergrund fest. Ich habe für dich verschiedene Muster angelegt, die du als Hintergrundbild nutzen kannst. Alle Muster findest du in deinem DOWNLOAD-ORDNER > SOURCEFILES > HINTERGRUND.PNG
Anmerkung zur Installation Im Theme BLOGGER habe ich als Startseite den Blog definiert. Dazu lege eine SEITE an, die du z.B. Blog nennst. Füge dort das Layout BLOG ein. Unter EINSTELLUNGEN > LESEN wählst du die neue Seite „Blog“ nun als STATISCHE (Homepage). Bitte lege KEINE Seite als Beitragsseite fest.
Hintergrundbild Das Hintergrundbild legst du unter DESIGN > ANPASSEN > Allgemeine Einstellungen > Hintergrund fest. Du findest das Hintergrundbild im DOWNLOAD-ORDNER > SOURCEFILES
Hinweis zur Installation:
- Wenn du bei dem Theme ClassicBusiness die Farben individuell anpassen willst, musst du das Design WEIß wählen! Du findest diesen im Download-Ordner SOURCE FILES
- Die Fahnen sind als Bild hinterlegt und müssen bei individuellen Farbwünschen farblich über einen Bildeditor angepasst werden.
- Wenn du die Fahnen gar nicht haben möchtest, schau dir auch das Theme DI FLAT an, welches sehr ähnlich ist.
Hinweis zur Installation: Das Theme Freshy nutzt für die „Schräge“ eine Grafik. Dieses Bild ist über den Pagebuilder eingefügt. Du kannst das komplette Modul der Schräge kopieren und an jeder beliebigen Stelle im Pagebuilder einfügen (z.B. als Trenner zwischen zwei Seitenabschnitten). Wenn du die Farbe der Schräge individuell anpassen möchtest, kannst du direkt die Grafik einfärben. Du findest die Grafik im Ordner deines Themes: di-freshy/images/header.png
Hinweis zur Installation Da DI One Business als „Onepage“ aufgebaut ist, wir aber dennoch Folgeseiten (z.B. einen Blog) integrieren wollen, müssen wir das Menü etwas anpassen. OnePage einrichten. 1. Basis-Theme installieren 2. Design (Child-Theme) installieren und aktivieren 3. Layouts importieren (DIVI > BIBLIOTHEK > IMPORTIEREN) 4. Einstellungen importieren (DIVI > DESIGNMODIFIKATOR > PFEILE OBEN LINKS) 5. Erstelle die Startseite und eine Seite für den Blog (SEITEN > SEITE ERSTELLEN) Tipp: Die Startseite wird unter DASHBOARD > EINSTELLUNGEN > LESEN festgelegt. 6. Lade auf der Startseite das Layout „Startseite“ deines Themes. In der Vorlage ist für jede Sektion bereits eine „Sprungmarke“ hinterlegt. Diese findest du unter SEKTION > ERWEITERT > BENUTZERDEFINIERTES CSS > CDD ID. 
Einrichtung Menü
- Gehe zu Design > Menüs
- Erstelle ein neues Menü
- Aktiviere dies unter Menü-Einstellungen > Position im Theme als HAUPTMENÜ
- Füge nun die INDIVIDUELLE LINKS hinzu.
- Als URL gibst von der Startseite die URL + Spungmarke (ID) an. Der Linktext (Name im Menü) ist frei wählbar.
Beispiel: Die Sprungmarke zur Agentur heißt: #agentur Der Link ist also: https://www.hier-steht-deine-website#agentur 
Füge nach dem gleichen Prinzip die von dir gewünschten Sprungmarken in das Menü ein. In diesem Theme sind folgende Marken angelegt:
- #agentur
- #service
- #team
- #portfolio
- #preise
- #skills
Blog mit Menü verknüpfen Okay, jetzt haben wir ein individuelles Menü angelegt. Über die angepassten Links werden direkt die Sprungmarken der Startseite gewählt. Nun binden wir noch den Blog ein. Dieser ist eine normale Seite und wird auch im Menü als normale Seite verknüpft. 
Hinweis zur Installation Da DI Onefoto als „Onepage“ aufgebaut ist, müssen wir das Menü etwas anpassen. OnePage einrichten. 1. Basis-Theme installieren 2. Design (Child-Theme) installieren und aktivieren 3. Layouts importieren (DIVI > BIBLIOTHEK > IMPORTIEREN) 4. Einstellungen importieren (DIVI > DESIGNMODIFIKATOR > PFEILE OBEN LINKS) 5. Erstelle die Startseite (SEITEN > SEITE ERSTELLEN) Tipp: Die Startseite wird unter DASHBOARD > EINSTELLUNGEN > LESEN festgelegt. 6. Lade auf der Startseite das Layout „Startseite“ deines Themes. In der Vorlage ist für jede Sektion bereits eine „Sprungmarke“ hinterlegt. Diese findest du unter SEKTION > ERWEITERT > BENUTZERDEFINIERTES CSS > CDD ID. 
Einrichtung Menü
- Gehe zu Design > Menüs
- Erstelle ein neues Menü
- Aktiviere dies unter Menü-Einstellungen > Position im Theme als HAUPTMENÜ
- Füge nun die INDIVIDUELLE LINKS hinzu.
- Als URL gibst von der Startseite die URL + Spungmarke (ID) an. Der Linktext (Name im Menü) ist frei wählbar.
Beispiel: Die Sprungmarke zur Agentur heißt: #projekte Der Link ist also: https://www.hier-steht-deine-website#projekte Füge nach dem gleichen Prinzip die von dir gewünschten Sprungmarken in das Menü ein. In diesem Theme sind folgende Sprungmarken angelegt:
- #start
- #projekte
- #leistungen
- #uebermich
- #preise
- #preise
Hinweis zur Installation DI Soon ist so erstellt, dass ihr dieses als „Stand Alone-Lösung“ nutzen könnt. In diesem Fall wird das Theme wie jedes andere DI Theme installiert. Ihr könnt aber auch die Layouts von DI Soon in jedem anderen DI Theme nutzen. So könnt ihr eure Seite im Hintergrund aufbauen, während der Besucher der Website das Theme DI Soon sieht. Alles, was du dazu machen musst, ist … 1. Importiere die Datei disoon.layouts.json aus dem Ordner SourceFiles (wie sonst auch). 2. Lege eine neue Seite an und aktiviert den Pagebuilder (wie sonst auch). 3. In deiner Bibliothek findest du die 5 Designs von DI Soon. Wähle das gewünschte Design aus. 5. Wähle unter ATTRIBUTE > TEMPLATE die Vorlage BLANK PAGE aus. Auf diese Weise wird das Menü auf dieser Seite ausgeblendet. 5. Im letzten Schritt aktivierst du unter DESIGN > ANPASSEN > STATISCHE SEITE die „Statische Seite“ und wählst deine eben erstellte Seite aus.
Hinweis zur Installation DI Soon ist so erstellt, dass ihr dieses als „Stand Alone-Lösung“ nutzen könnt. In diesem Fall wird das Theme wie jedes andere DI Theme installiert. Ihr könnt aber auch die Layouts von DI Soon in jedem anderen DI Theme nutzen. So könnt ihr eure Seite im Hintergrund aufbauen, während der Besucher der Website das Theme DI Soon sieht. Alles, was du dazu machen musst, ist … 1. Importiere die Datei disoon.layouts.json aus dem Ordner SourceFiles (wie sonst auch). 2. Lege eine neue Seite an und aktiviert den Pagebuilder (wie sonst auch). 3. In deiner Bibliothek findest du die 5 Designs von DI Soon. Wähle das gewünschte Design aus. 5. Wähle unter ATTRIBUTE > TEMPLATE die Vorlage BLANK PAGE aus. Auf diese Weise wird das Menü auf dieser Seite ausgeblendet. 5. Im letzten Schritt aktivierst du unter DESIGN > ANPASSEN > STATISCHE SEITE die „Statische Seite“ und wählst deine eben erstellte Seite aus.
Hinweis zur Installation: Dieses Theme benutzt im Kopfbereich einen Farbverlauf. Wenn du diesen löschen möchtest, gehe zu DESIGN > EDITOR und entferne in der Datei STYLE.CSS folgende Zeilen:
#main-header, #main-header .nav li ul, .et-search-form, #main-header .et_mobile_menu {
background-image: linear-gradient(hsla(0, 0%, 0%, 0) 20%, hsl(0, 0%, 30%) 90%);
}
Hinweis zur Installation: Dieses Theme benutzt im Kopfbereich einen Farbverlauf. Wenn du diesen löschen möchtest, gehe zu DESIGN > EDITOR und entferne in der Datei STYLE.CSS folgende Zeilen: #main-header, #main-header .nav li ul, .et-search-form, #main-header .et_mobile_menu {
background-image: linear-gradient(hsla(0, 0%, 0%, 0) 20%, hsl(0, 0%, 30%) 90%);
}
Schritt 3/3: Layouts importieren
Importiere die Voreinstellungen und die Layouts der einzelnen Seiten.
Kurzanleitung mit Bildern: Import Einstellungen und Layouts
he zum Menüpunkt DIVI > Theme Customizer.
Es lädt die WordPress-Seite. Klicke oben links auf die 2 Pfeile (Import/Export).
Gehe zum Punkt IMPORTIEREN und dort auf DATEI AUSWÄHLEN
Gehe zum entpackten Downloadordner des Designs und öffne im Unterordner SOURCEFILES die Datei THEMENAME-EINSTELLUNGEN.JSON.
Gehe im Adminbereich von WordPress zu DIVI > DIVI-BIBLIOTHEK.
Gehe zum Punkt IMPORTIEREN & EXPORTIEREN
Gehe zum Punkt IMPORTIEREN und dort auf DATEI AUSWÄHLEN
Wähle aus dem Downloadordner SOURCEFILES die Datei THEMENAME-LAYOUTS.JSON
Nach dem Import stehen dir alle Seitenlayouts zur Verfügung.
Pagebuilder für WordPress 5 aktivieren.
Für WordPress 5 musst du den „Classic Builder“ aktivieren. So bekommst du vollen Zugriff auf den Pagebuilder. Bitte gehe zu DIVI > THEME OPTIONEN (1) > BUILDER (2) > FORTGESCHRITTEN (3) > und aktiviere den „Classic Editor“ (4)
Vorlagen den Seiten zuordnen
Erstelle eine neue Seite (DASHBOARD > SEITEN > SEITE ERSTELLEN) und klicke auf den Button: „Den Divi-Builder benutzen“.
Es öffnet sich ein neues Fenster. Wähle „NEU AUFBAUEN“.
Sobald der Builder geladen ist, klicke auf das PLUS-Zeichen in der Lila-Menüleite.
Gehe zu GESPEICHERTE LAYOUTS
Wähle das gewünschte Layout.
IN VERSION 3: Gehe zu „Layout laden“.
Es öffnet sich ein Fenster. Gehe zu „Gespeicherte Layouts“ und wähle das gewünschte Layout.
Hinweis:
Die Designs sind nach den enthaltenen Seiten des Themes benannt, also zum Beispiel STARTSEITE für die Startseite u.s.w.
Erstelle einfach die gewünschten Seiten und lade jeweils die passende Vorlage.
Tipp: Du kannst auf gleiche Weise Designvorlagen aus allen Themes installieren und in deinem Theme nutzen/kombinieren. Schau dir auch die Lektionen QUICKSTART an. Hier lernst du in Windeseile den Aufbau deines Themes kennen.
