Divi installieren: Detaillierte Schritt-für-Schritt-Anleitung

Divi von Elegant Themes ist ein leistungsstarkes WordPress-Theme, das eine intuitive Drag-and-Drop-Oberfläche bietet, mit der du beeindruckende Websites erstellen kannst. Als Experte in diesem Bereich habe ich Divi in mehreren Projekten wie komplexen Unternehmenswebseiten und auch OnePager-Webseiten eingesetzt und war jedes Mal beeindruckt von der Flexibilität und Benutzerfreundlichkeit. Egal, ob du ein Anfänger oder ein erfahrener Designer bist, mit Divi bist du unter WordPress optimal aufgestellt.

Öffne das WordPress-Dashboard, das Herzstück deiner Website-Verwaltung. Um dorthin zu gelangen, öffne deinen bevorzugten Webbrowser und gebe die URL, also die Adresse deiner Website, ein, gefolgt von „/wp-admin„. Dies führt dich direkt zur Anmeldeseite der WordPress Administrationsoberfläche. Hier gibst du deinen Benutzernamen und dein Passwort ein, welche du bei der Einrichtung deiner WordPress-Seite erstellt hast. Falls du Schwierigkeiten hast, dich einzuloggen oder deine Zugangsdaten vergessen hast, bietet WordPress in der Regel eine „Passwort vergessen-Funktion“ an, die über einen Link auf der Anmeldeseite zugänglich ist. Nach erfolgreichem Login wirst du zum Dashboard weitergeleitet, einer benutzerfreundlichen Oberfläche, in der du Inhalte erstellen, das Design anpassen und die Einstellungen deiner Website verwalten kannst.

Der nächste Schritt auf deinem Weg zu einer professionellen und ansprechenden Website ist der Erwerb und Download von Divi. Besuche dazu die offizielle Website von Elegant Themes. Hier findest du verschiedene Preisoptionen, die sich an unterschiedliche Bedürfnisse und Budgets anpassen. Ob du dich für ein Jahresabonnement oder eine einmalige Zahlung entscheidest, beide Optionen gewähren dir vollen Zugriff auf das Divi Theme sowie auf alle weiteren Produkte und Updates von Elegant Themes.

Nachdem du die für dich passende Option ausgewählt und den Kauf abgeschlossen hast, wirst du zum Mitgliederbereich weitergeleitet. Dort findest du eine übersichtliche Seite, auf der du das Divi-Theme-Paket herunterladen kannst. Dieses wird als ZIP-Datei bereitgestellt – ein Format, das von WordPress für Theme-Installationen benötigt wird.

Es ist ratsam, die heruntergeladene Datei an einem leicht zugänglichen Ort zu speichern, etwa auf dem Desktop oder in einem speziellen Ordner. So wird der nächsten Schritt leichter, nämlich das Hochladen des Themes in dein WordPress-Dashboard.

Bitte beachte dabei, dass der Kauf von Divi auch Zugang zu einer umfangreichen Dokumentation und zu Support-Leistungen von Elegant Themes bietet. Solltest du während des Installationsprozesses Fragen haben oder Unterstützung benötigen, stehen dir diese Ressourcen zur Verfügung. Elegant Themes ist bekannt für seinen hervorragenden Kundensupport, was ein weiterer Vorteil dieses Themes ist.

Natürlich stehe auch ich dir jederzeit beratend zur Seite, solltest du dabei Unterstützung benötigen. Kontaktiere mich also gerne jederzeit.

Nachdem du Divi erfolgreich heruntergeladen hast, ist es an der Zeit, das Theme in deinem WordPress-Dashboard zu installieren. Dieser Prozess ist einfach und unkompliziert, sodass auch Anfänger ohne Probleme folgen können.

Öffne zunächst dein WordPress-Dashboard wie in Schritt 1 beschrieben. Hier findest du eine Vielzahl von Optionen, aber für diesen Schritt fokussieren wir uns auf den Bereich „Design“. Klicke auf „Design“ und dann auf „Themes“. Dieser Bereich zeigt dir alle derzeit installierten Themes auf deiner Website. Um Divi hinzuzufügen, klicke auf die Schaltfläche „Neues hinzufügen“, die sich oben auf der Seite befindet.

Auf der nächsten Seite findest du die Option „Theme hochladen“. Klicke darauf, und es öffnet sich ein neues Fenster, das es dir ermöglicht, die Divi-ZIP-Datei von deinem Computer auszuwählen. Navigiere zu dem Ort, an dem du das Divi Theme gespeichert hast, und wähle die ZIP-Datei aus. Nachdem du die Datei ausgewählt hast, klicke auf „Jetzt installieren“.

WordPress wird nun das Divi Theme automatisch hochladen und installieren. Dieser Vorgang kann je nach Internetgeschwindigkeit einige Momente in Anspruch nehmen. Während des Prozesses blendet WordPress eine Statusleiste ein, die den Fortschritt anzeigt.

Sobald die Installation abgeschlossen ist, erscheint eine Bestätigungsmeldung mit der Option „Theme aktivieren“. Es ist wichtig zu wissen, dass das Theme durch das reine Hochladen noch nicht automatisch auf deiner Website aktiviert wird. Um Divi effektiv zu nutzen, musst du es als aktives Theme einstellen, was im nächsten Schritt erklärt wird.

Falls du während des Uploads auf Schwierigkeiten stößt, überprüfe die Größe der ZIP-Datei. Einige Webhosting-Anbieter setzen Grenzen für die Dateigröße von Uploads. Sollte dies ein Problem sein, gibt es alternative Methoden, wie das Hochladen des Themes via FTP. Diese Methoden sind zwar etwas komplizierter, bieten aber eine zuverlässige Lösung, falls die Standardmethode nicht funktioniert. Solltest du hierbei Unterstützung benötigen, melde dich gerne.

Sobald das Hochladen abgeschlossen ist, befinde du dich an einem entscheidenden Punkt des Installationsprozesses – der Aktivierung von Divi. In deinem WordPress-Dashboard wird nach erfolgreicher Installation eine Vorschau von Divi angezeigt. Diese Vorschau bietet einen ersten Eindruck, wie Divi auf deiner Website aussehen könnte.

Nun ist es an der Zeit, Divi zu aktivieren. Klicke einfach auf die Schaltfläche „Aktivieren„, die sich unterhalb der Vorschau befindet. Mit diesem Schritt setzt du Divi als das aktuelle Theme für deine Website. Die Aktivierung ist nahezu augenblicklich, und du wirst sofort eine Veränderung im Design deiner Website feststellen. Dies ist der Moment, in dem das Aussehen deiner Website eine vollständige Transformation durchläuft, da nun die Designvorlagen und Stile von Divi übernommen werden.

Die Aktivierung von Divi beeinflusst keine bestehenden Inhalte der Website. Deine Beiträge, Seiten und andere Einstellungen bleiben unverändert. Was sich ändert, ist das visuelle Layout und Design.

Nach der Aktivierung von Divi ist es empfehlenswert, die Website zu überprüfen. Naturgemäß sind nach der Installation eines neuen WordPress Themes zahlreiche Anpassungen erforderlich, um das Beste aus dem neuen Design herauszuholen. Dies ist ein normaler Teil des Prozesses, da jedes Theme unterschiedliche Design-Elemente und -Einstellungen mit sich bringt.

Ein Divi Child Theme ist unerlässlich, wenn du benutzerdefinierte Anpassungen an deinem Theme vornehmen möchtest, ohne zukünftige Updates zu beeinträchtigen. Ein Child Theme erbt die Funktionalität seines sogenannten Eltern-Themes, ermöglicht aber individuelle Änderungen, die bei einem Update nicht überschrieben werden.

Zunächst musst du mittels FTP-Client (Software für Verbindungen zu Webservern via File Transfer Protocol) eine Verbindung zu deinem Webserver herstellen. Es gibt zahlreiche kostenpflichtige sowie kostenfreie Programme, um eine FTP-Verbindung aufzubauen. Ein kostenfreies Tool ist beispielsweise FileZilla. Die FTP-Zugangsdaten zu deinem Webserver findest du in der Regel in der Administrationsoberfläche deines Webhosting-Anbieters.

Sobald du dich deinem Webserver mittels FTP verbunden hast, navigiere in den Ordner deiner Domain (Internetadresse), dann in den Ordner „wp-content„, dort in den Ordner „themes“ und lege hier einen neuen Ordner an. Nenne diesen Ordner „divi-child„.

Im „divi-child„-Ordner erstellest du eine Datei namens „style.css“ (dies machst du am besten mit einem Texteditor wie dem Editor oder dem Programm Sublime Text). Dies ist deine Haupt-CSS-Datei. Hier fügst du einen Standard-WordPress-Header ein, der WordPress mitteilt, dass dies ein Child Theme ist:

Ebenfalls im Ordner „divi-child“erstellst du eine eine „functions.php“-Datei, um zusätzliche Funktionen und Skripte einzubinden. Mit dieser Datei kannst du Funktionen des Eltern-Themes überschreiben oder neue Funktionen hinzufügen. Füge folgenden Inhalt in die functions.php-Datei ein:

<?php add_action( ‚wp_enqueue_scripts‘, ‚theme_enqueue_styles‘ ); function theme_enqueue_styles() { wp_enqueue_style( ‚parent–style‘, get_template_directory_uri() . ‚/style.css‘ ); }

Anschließend navigiere im WordPress-Dashboard zu „Design“ -> „Themes„. Hier sollte das neu erstellte Divi Childtheme angezeigt werden. Aktiviere das Divi Childtheme. Hinweis: Die Tatsache, dass das Theme ohne Bild angezeigt wird, ist im Standard normal. Dies kann optional noch ergänzt werden, würde aber den Rahmen dieser Anleitung sprengen.

Hier kannst du dein Logo hochladen, Favicon einstellen und Links zu Social Media hinzufügen.

Passe hier die Navigation deiner Website an, einschließlich der Anordnung der Menüs und deren Erscheinungsbild.

Mit dem Divi Builder, einem Drag-and-Drop-Editor, gestaltest du Seiten und Beiträge visuell. Experimentiere mit verschiedenen Modulen, wie Textblöcken, Bildern und Schaltflächen (Buttons).

Erstelle einzigartige Layouts und speichere diese, um sie auf anderen Seiten oder Beiträgen zu verwenden.

Jedes Modul in Divi hat eigene Einstellungsmöglichkeiten. Passe die Größe, Farbe, Schriftarten und mehr an, um das Aussehen jedes Moduls zu verändern.

Divi ermöglicht es, das Aussehen der Module auf verschiedenen Geräten (Desktop, Tablet, Mobil) anzupassen.

Lege ein Farbschema für deine Website fest, das auf allen Seiten und in allen Modulen verwendet wird.

Um die Textdarstellung auf deiner Website zu personalisieren, wähle aus einer Vielzahl von Schriftarten.

Für fortgeschrittene Anpassungen bietet Divi die Möglichkeit, benutzerdefiniertes CSS direkt im Theme-Optionen-Bereich einzugeben.

In diesem Bereich kannst du Code-Snippets für Google Analytics oder andere externe Dienste einfügen.

Stelle sicher, dass deine Website auf Mobilgeräten optimal dargestellt wird, indem du die mobilen Einstellungen in Divi anpasst.

Indem du die aufgeführten Einstellungen erkundest und anpasst, kannst du das volle Potenzial von Divi ausschöpfen und eine Website erstellen, die nicht nur funktional, sondern auch visuell ansprechend ist. Nimm dir die Zeit, um mit verschiedenen Optionen zu experimentieren und die perfekte Balance für deine Bedürfnisse zu finden.

Solltest du professionelle Unterstützung benötigen, kontaktiere mich gerne jederzeit.