Divi Child Theme: Download und Anleitung zum selber erstellen

Divi ist ja bekanntlich ein sehr weit verbreitetes und mächtiges WordPress Theme. Man kann Divi natürlich direkt installieren und einrichten und auch mit Hilfe des Customizers und der Divi Optionen anpassen. Dennoch macht es bei einem Premium Theme meist Sinn grundsätzlich über ein Child Theme zu arbeiten. Vor allem dann, wenn man Theme Template Dateien anpassen muss (selbst Divi bietet nicht JEDE Einstellungsmöglichkeit) oder wenn man bequem über die style.css die Optik beeinflussen möchte. Hier zeige ich dir, wie du das Child-Theme einfach anlegen kannst. Natürlich kannst du hier das Divi Child Theme auch einfach herunterladen und dann bei dir installieren.

Kann man Divi ohne Child Theme nutzen?

Natürlich, wie oben beschrieben geht das wunderbar. Solange man mit den Hausmitteln von Divi auskommt, ist das überhaupt kein Problem. Nur wenn du tiefergehend Änderungen am Design vornehmen musst, wird es auch bei Divi mal schwierig. Dann nutzt du lieber ein Child-Theme. Selbst wenn du nicht weißt ob du jemals ein Child Theme benötigst, macht es Sinn die Site schon damit aufzusetzen. Schaden kann es nicht…nutzen aber auf jeden Fall.

Kann ich Divi im Nachhinein auf ein Child-Theme umstellen?

Ja, das geht auch. Du musst dann allerdings die Einstellungen komplett exportieren und dann im Child-Theme importieren. Das geht oft gut, kann aber auch Probleme machen. Daher dann doch wenn möglich das Child Theme von Beginn an nutzen. Du kannst sowohl die Themeeinstellungen über den Customizer exportieren und später wieder importieren. Als auch die Library. Wie das funktioniert siehst du hier: https://www.elegantthemes.com/blog/divi-resources/divi-plugin-highlight-migrate-divi-theme-settings

Ein Divi Child Theme erstellen

Um ein Divi Child Theme zu erstellen benötigst du:

• FTP Zugang zu deinem Webspace
• Editor
• ein installiertes Divi Theme
• evtl. ein Bild für das Dashboard

Grundsätzlich ist das Anlegen des Child Themes eine Kleinigkeit. Du verbindest dich per FTP Server auf den Webspace und navigierst in den Ordner /wp-content/themes. Dort erstellst du einen Ordner für das Child Theme. Zum Beispiel mit dem Namen „divi-child“. In diesen Ordner gehören folgende Dateien:

• style.css
• functions.php

Die beiden erstellst du komplett neu.

In die style.css kommt der folgende Inhalt:

/*
Theme Name: Divi Child Theme
Theme URI: http://www.elegantthemes.com/gallery/divi/
Description: Divi Child Theme
Author: Netzgaenger working on Elegant Themes
Author URI: https://www.netz-gaenger.de
Template: Divi
Version: 1.0.0
*/

@import url("../Divi/style.css");

/* =Theme customization starts here
------------------------------------------------------- */

Unter der Zeile „/* =Theme customization starts here“ kannst du dann deine eigenen CSS styles angeben und musst dann nicht kompliziert über den Customizer arbeiten.

In die functions.php kommt der folgende Inhalt:

<?php
function my_theme_enqueue_styles() { 
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );

Über diesen Code wird die Datei style.css von Divi geladen und du kannst dann quasi darauf aufsetzen. Früher war das nicht nötig, heute schon und best practice. Die Datei benötigt auch kein abschließendes PHP Tag. Einfach weglassen und alles ist gut.

Theoretisch sind wir schon fertig mit der Anlage des Child Themes. Jetzt kannst du aber noch ein Bild hochladen, welches dann im Dashboard bei den Themes angezeigt wird (funktioniert aber auch ohne, sieht nur nicht so hübsch in der Übersicht aus). Die Datei für das Bild muss exakt folgendermaßen heißen:

screenshot.png

Als Abmessung sind 1200px * 900px empfohlen.

Diese Datei lädst du ebenso in den Ordner „divi-child“. Somit hast du 3 Dateien dort liegen.

• style.css
• functions.php
• screenshot.png

Wenn du nun Änderungen an Theme Template Files machen willst, kopierst du diese dann vom Haupt Theme in das Child Theme. Eine etwaige Ordnerstruktur des Haupt Themes baust du dann im Child Theme nach, damit das neue Template File auch gefunden werden kann.

Aktivieren des Child Themes

Du kannst nun das Child Theme im Dashboard unter Design->Themes finden und aktivieren. Du musst übrigens nicht zwangsweise über den FTP Editor gehen. Wenn du den Ordner „divi-child“ auf deinem Rechner anlegst und daraus ein Zip File machst, kannst du es einfach über das WordPress Dashboard installieren.

Um das Child Theme zu aktivieren, klickst du auf „aktivieren“ in der Themeübersicht.

Das war’s auch schon. Im Idealfall sieht die Site nun exakt so aus, wie als wäre Divi direkt installiert. Wenn du Divi schon eingerichtet hattest und die Settings importieren musst, wäre das nun der richtige Zeitpunkt. Ich empfehle dir aber im Falle der Umstellung immer erst einen Wartungsmodus zu aktivieren, damit deine Besucher von der Umstellung nichts mitbekommen.

Download Divi Child Theme

Für die Faulen Zeitsparer unter euch, habe ich ein beispielhaftes Child Theme für Divi zusammengepackt und du kannst es über diesen Link hier herunterladen und wie oben beschrieben aktivieren.