Divi Code AI – Ihr persönlicher Codierungsassistent in Divi

Rifat Divi Tutorials Dec 14, 2023

Gute Nachrichten für Webdesigner und Entwickler: Eine bahnbrechende Ergänzung des Divi AI-Toolsets ist da. Im Oktober 2023 kündigte Divi eine neue Ergänzung seines KI-Toolkits an – Divi Code AI, ein Tool, das die Webentwicklung innerhalb des Divi-Ökosystems vereinfacht. Divi Code AI verfügt über die einzigartige Fähigkeit, Code zu schreiben, CSS zu generieren und unschätzbare Unterstützung bei der Anpassung von Divi-Websites über den Visual Builder zu bieten. Benutzer können jetzt vom Fachwissen eines erfahrenen Front-End-Webentwicklers profitieren, der mit den Feinheiten jedes Divi-Moduls bestens vertraut ist. In diesem Blog wird untersucht, wie Divi Code AI das Divi-Webdesign- Erlebnis verändert und mehr Effizienz und mehr Spaß verspricht.

Passen Sie die Website mit KI-Codierung an

Benutzer können leicht ein neues KI-Symbol erkennen, das sich unter den Codefeldern von Divi befindet. Durch einfaches Klicken auf dieses Symbol können Einzelpersonen ihre spezifischen Anforderungen an Divi AI übermitteln. Abhängig vom anzupassenden Element und der Art des bearbeiteten Feldes passt Divi AI seine Antworten umgehend an die jeweilige Aufgabe an.

Wenn ein Benutzer beispielsweise Farbverlaufstext in eine Überschrift integrieren möchte, eine Designfunktion, die in Divi nicht nativ verfügbar ist, kann er einfach Divi AI anfordern, das erforderliche CSS zu generieren. Innerhalb weniger Augenblicke wird die Überschrift mit einem atemberaubenden Farbverlaufseffekt geschmückt.

Benutzer können einen kontinuierlichen Dialog mit Divi AI führen, um das Ergebnis zu optimieren. In einer Videodemonstration empfand der Nutzer den anfänglichen Farbverlauf als etwas gedämpft und forderte daher Divi AI auf, ihn zu intensivieren. Das Ergebnis ist nun der ideale Farbverlauf, der die gewünschte Lebendigkeit erreicht.

Erstellen Sie erstaunliche Websites

Mit dem besten kostenlosen Seite Builder Elementor

Jetzt anfangen

Erstellen Sie benutzerdefinierte Elemente

Das Code-Modul ist der leuchtende Stern von Divi Code AI und bietet die Möglichkeit, problemlos mit HTML, CSS und JavaScript umzugehen. Benutzer können Divi AI einfach auffordern, ein Popup mit einer Verzögerung von 30 Sekunden zu erstellen und Besucher dazu einzuladen, ihren Newsletter zu abonnieren, wobei sie die Freiheit haben, das Erscheinungsbild des Popups zu beschreiben. Innerhalb weniger Augenblicke generiert Divi AI mühelos den Code, was zu einem auffälligen und effektiven Popup führt, das die Aufmerksamkeit der Website-Besucher auf sich zieht.

Divi AI bietet eine breite Palette an Funktionen, wenn es um Codemodule geht. Es kann mühelos Funktionen wie einen Tippeffekt für die Überschrift Ihres Helden integrieren oder einen Divi-Abschnitt in eine praktische, entfernbare schwebende Seitenleiste umwandeln. Sobald Benutzer mit der Interaktion mit Divi AI vertraut sind, eröffnet sich ihnen ein Reich spannender Möglichkeiten.

Freiform-CSS-Option für alle Module

Sie haben eine bemerkenswerte Verbesserung in allen Divi-Modulen implementiert – eine Freiform-CSS-Funktion, die es Benutzern ermöglicht, das Modul im Fokus und alle darunter liegenden Elemente mithilfe der Pseudoklasse „Selektor“ zu formatieren. Wenn Sie beispielsweise ein Blurb-Modul bearbeiten, können Sie ganz einfach einen Boxschatten anwenden und das Erscheinungsbild seiner IMG- und H3-Elemente optimieren, indem Sie CSS-Regeln wie die folgende erstellen:

selector { <span class="webkit-css-property" aria-label="CSS property name: box-shadow">box-shadow</span><span class="styles-name-value-separator">: </span><span class="value" aria-label="CSS property value: 0 10px 20px 0 #000">0 10px 20px 0 #000</span><span class="styles-semicolon">; }</span>
 
selector img { border-radius: 100px; border: 5px solid #000; }
 
selector h3 { margin-top: 20px; }

Diese Ergänzung erweist sich für Divi AI als unschätzbar wertvoll, denn sie verleiht ihr die erforderliche Flexibilität, um Ihre Anforderungen zu erfüllen und ganze Module mühelos anzupassen.

KI-generierte CSS-Anpassung

Der Einsatz von Divi Code AI im neuen Freiform-CSS-Bereich erweist sich als eine bemerkenswerte Erfahrung. In der Videodemonstration unten können Benutzer erleben, wie Divi AI mühelos eine Reihe von Anpassungen durchführt. Die Anweisungen sind klar: Verwandeln Sie das Bild in eine kreisförmige Form, fügen Sie einen subtilen Kastenschatten hinzu, überlagern Sie das Bild mit einem halbtransparenten Farbverlauf und wenden Sie eine durch den Mauszeiger ausgelöste Zoom-Animation an.

Dank des tiefen Verständnisses von Divi AI für die Divi-Modulstrukturen und seiner CSS-Kenntnisse werden diese komplexen Aufgaben in der Regel beim ersten Versuch erfolgreich bewältigt oder kommen dem gewünschten Ergebnis bemerkenswert nahe.

Divi-Codebasis

Was Divi Code AI auszeichnet, ist die Feinabstimmung der Codebasis des Divi-Moduls, die einen deutlichen Vorteil im Vergleich zu anderen großen Sprachmodellen bietet. Dank seiner Vertrautheit mit Divi-Modulklassen und HTML-Ausgaben ist es hervorragend darin, mehrdeutige Anfragen zu verstehen und Divi-spezifische Begriffe in Benutzeraufforderungen zu erkennen.

Im unten gezeigten Video weist ein Benutzer beispielsweise Divi Code AI an, CSS zu erstellen, um das Erscheinungsbild von Blurb- und Button-Modulen anzupassen. Beeindruckend ist, dass Divi Code AI instinktiv die Art von Blurb- und Button-Elementen erkennt und die relevanten Klassen genau lokalisiert. Diese Präzision ermöglicht es, bereits beim ersten Versuch punktgenaue Anpassungen zu liefern.

Bequeme Codierung

Divi Code AI bietet benutzerfreundliche Schnellaktionen zur Feinabstimmung Ihres Codes. Mit nur einem Klick kann es automatisch optimieren, formatieren und die Kompatibilität mit älteren Browsern verbessern. Darüber hinaus haben Sie die Flexibilität, Code mithilfe von Eingabeaufforderungen zu ändern und so endlose kreative Möglichkeiten freizuschalten.

Cloudbasierte Code-Snippet-Bibliothek

Auch wenn Divi AI möglicherweise nicht fehlerfrei ist, ermöglicht es Benutzern, ihre Konversation fortzusetzen und mit der KI zusammenzuarbeiten, um das gewünschte Ergebnis zu verfeinern. Benutzer können auch einen „Wiederholungsversuch“ anfordern. Bei jedem Versuch generiert Divi AI leicht unterschiedliche Ergebnisse und findet häufig schon nach wenigen Versuchen die gewünschte Lösung.

Selbst für diejenigen, die über grundlegende Kenntnisse in der Webentwicklung verfügen, kann Divi AI die Anpassung von Websites beschleunigen und spezifische Ergebnisse erzielen, die bisher nur durch den Einsatz eines Experten erreichbar waren.

Zusammenfassung

Divi Code AI ist mehr als nur ein technologischer Fortschritt; Es ist ein Game-Changer in der Welt des Webdesigns. Es bietet Benutzern die Möglichkeit, die Fähigkeiten eines erfahrenen Front-End-Webentwicklers direkt aus dem Divi Visual Builder zu nutzen.

Egal, ob Sie ein erfahrener Webdesigner oder ein Neuling auf diesem Gebiet sind, Divi Code AI öffnet Ihnen die Tür zu mehr Effizienz und Anpassung. Tauchen Sie ein und erleben Sie die Zukunft des Webdesigns mit Divi Code AI.

Divi WordPress Theme