Einführung von Designvariablen für Divi 5

Ich freue mich, Designvariablen für Divi 5 einzuführen, eine neue Funktion, die den Design -Workflow von Divi erheblich verbessern und Divi -Benutzer ein ernstes Bein gegenüber anderen Bauherren verleiht.

Sie können Variablen für alles definieren, z. B. Farben, Schriftarten, Zahlen, Bilder und Text, und sie in Divi -Elemente und Voreinstellungen anschließen. Wenn Sie eine Variable aktualisieren, ändern sich das Design und der Inhalt Ihrer Website.

Die Synergie zwischen den Variablen und dem neuen voreingestellten Designsystem von Divi ist fantastisch. Lassen Sie mich Ihnen zeigen, wie es funktioniert.

Schauen Sie sich das folgende Video an, um die neue Funktion in Aktion anzuzeigen.

Divi wird mit dem variablen Management „global“

Dank des globalen Farbsystems von Divi sind Sie möglicherweise bereits mit dem Konzept einer Designvariablen vertraut. Eine globale Farbe ist eine Art Konstruktionsvariable. Mit diesem Update stellen wir jedoch Global Everything vor! Das Verwalten Ihrer globalen Einstellungen ist dank eines neuen Variablen -Managers einfacher als je zuvor.

Erstellen neuer Variablen

Das Variablen -Symbol in der linken Seitenleiste öffnet den Variable Manager Ihrer Website. Fügen Sie eine neue Variable hinzu, geben Sie ihm einen Namen und einen Wert und dann können Sie diese Variable in relevante Einstellungen auf jeder Seite anschließen. Divi unterstützt derzeit sechs Arten von Variablen, die alle nativen Eingangsfelder von Divi abdecken:

• Farben : Farben sind für jede Website unerlässlich. Die meisten Websites verwenden nur drei bis vier Primärfarben. Das Definieren von Farbvariablen und die Verwendung dieser über Ihre Website bedeutet, dass Sie die Farbpalette Ihrer gesamten Website in Sekundenschnelle anpassen können.
• Schriftarten : Die Ära der Arbeit mit statischen Schriftarten ist vorbei. Außerdem sind Sie nicht mehr auf die globalen Schriftstellungen in Themen Customizer beschränkt. Sie können die Schriftarten Ihrer Website als Variablen definieren und sie alle an einem Ort verwalten.
• Zahlen : Sie können Zahlenvariablen verwenden, um das Größensystem Ihrer Website zu entwerfen. Beispielsweise können Sie eine Standardgrenze für alle Elemente für alle Elemente verwenden. Wenn Sie dies in eine Variable verwandeln, können Sie die Größe Ihrer abgerundeten Ecken durch Bearbeiten einer einzelnen Variablen einstellen. Zu den anderen Alltags verwendet das Definieren der Textgrößen und -zeilungshöhen Ihrer Website, die Containerbreiten und den Abstand sowie alles dazwischen.
• Bilder : Verwenden Sie das gleiche Bild auf mehreren Seiten? Zum Beispiel haben Sie möglicherweise ein Standard -Hintergrundbild, das als bekanntes Markenmotiv dient. Wenn Sie dies in eine Variable verwandeln, ist es einfach, Ihre Marke in die Straße zu erfrischen.
• Text : Variablen sind nicht auf das Design beschränkt. Sie können auch Textvariablen definieren. Wenn Sie beispielsweise Ihre Unternehmensnummer und Ihre Adresse in Textvariablen umwandeln, müssen Sie nicht nach allen Orten suchen, an denen Sie diese Variablen verwendet haben, wenn sich Ihre Geschäftsdetails ändern.
• URLs : Wir haben auch URL -Variablen eingeworfen, denn warum nicht? Möglicherweise möchten Sie in verschiedenen Jahreszeiten Ihren primären Aufruf zum Action -Link auf verschiedenen Seiten haben (beispielsweise während eines Verkaufs zu ändern). Aktualisieren Sie die einzelne Variable, anstatt diese URL überall zu aktualisieren.

Verwenden von Variablen in Elementen und Voreinstellungen

Klicken Sie auf das Symbol Variablen oben oben, um aus einer Liste relevanter Variablen und dynamischer Inhalte von Ihrer Website auszuwählen.

Das Variable und das dynamische Inhaltssystem von Divi wurden auf alle Felder erweitert, in denen es zuvor nur in Content -Feldern verfügbar war. Das heißt, Sie können Variablen und dynamischem Inhalt Zahlenfeldern, Schriftfeldern usw. zuweisen.

Beispiele für Variable

Designvariablen sind instrumental und werden schnell zu einem Kernkomponenten des Divi -Design -Workflows. Aber wenn das Konzept nicht geklickt hat, lassen Sie mich Ihnen ein paar Beispiele geben.

Beispiel eins: Globale Schriftarten verwalten

Wie können Sie Designvariablen verwenden, um Ihren Workflow zu verbessern? Betrachten wir zunächst Schriftvariablen.

Die meisten Websites verwenden zwei bis drei Schriftarten. Sie haben wahrscheinlich Zeit damit verbracht, Ihre gewünschten Körper- und Titeltext -Schriftarten in verschiedenen Elementen und Voreinstellungen einzurichten.

Aber was ist, wenn Sie die Dinge aufschalten möchten? Selbst wenn Sie Ihre Website optimal mit Voreinstellungen entwickelt haben, kann es zeitaufwändig sein, zurück zu gehen und Schriftarten zu ändern. Möglicherweise erinnern Sie sich nicht einmal an alle Orte, an denen Sie eine bestimmte Schriftart verwendet haben.

Hier kommen Schriftvariablen ins Spiel.

Ich habe die Website im obigen Video mit drei Schriftartenvariablen erstellt: eine Titelschrift, eine Körperschrift und eine Highlight -Schriftart.

Das Hinzufügen der Title -Schriftart -Variable zu Elementen wie meinem Standard -Klappentext -Preset ist einfach. Da ich nie statische Schriftwerte verwendet habe, sondern stattdessen meine Variablen angeschlossen habe, sind die Schriftarten auf meiner Website völlig dynamisch.

Das Ändern der Titelschrift meiner Website ist genauso einfach wie die Aktualisierung der Titelschriftvariable.

Beispiel zwei: Globale Größen verwalten

Sie können dasselbe mit Textgrößen tun.

Für die Website im Video unten habe ich eine Reihe von acht Textgrößen für verschiedene Überschriften und Körpertextstile definiert. Wenn ich mein Standard -Blurb -Preset aktualisiere und die mittelgroße Textgrößenvariable zuweisen, erben alle meine Blubert -Titel den Wert dieser Variablen.

Da ich die Textgrößen meiner gesamten Website auf Variablen stütze, kann ich die Textgrößen meiner Website vollständig vom Variablenmanager verwalten.

Beispiel Drei: Globalisieren Sie Ihre gesamte Website

Im obigen Video sehen Sie eine Website, die die volle Leistung von Variablen nutzt. Alle Farben sind Variablen, ebenso wie die Schriftarten, Textgrößen, Grenzradiusgrößen und Abstandswerte in meinen Containerelementen.

Nicht nur das, sondern ich habe auch gemeinsame Inhalte in Variablen gemacht. Mein Firmenname, meine Telefonnummer und meine Adresse sind Inhaltsvariablen.

Sogar das Hintergrundbild, ein bekanntes Markenmotiv auf der gesamten Website, ist eine Bildvariable, die ich leicht ändern kann.

Versuchen Sie es noch heute Divi 5

Designvariablen für Divi 5 sind heute erhältlich und eine von vielen Funktionen, die in diesem Jahr zu Divi kommen.

Sie können mit dem Fortschritt der endgültigen Veröffentlichung von Divi 5 und darüber hinaus mit Updates alle zwei Wochen fortfahren. Abhängig von Ihren Prioritäten können Sie Divi 5 jetzt verwenden, um neue Websites zu erstellen oder zu warten, bis wir weitere Funktionen hinzufügen, was auch immer für Sie funktioniert.

Wie in Divi 5s ursprünglicher Multi-Phasen-Veröffentlichungsplan von Divi 5 dargestellt, ist das Divi 5 Public Alpha wie „Divi 5 Lite“. Es fehlen einige Funktionen und eignet sich möglicherweise nicht für vorhandene Websites. Es ist jedoch bereit, auf neuen Websites verwendet zu werden, wenn Sie die Erfahrung Divi 4 vorziehen.

Wir möchten, dass Sie es versuchen, und wenn Sie es lieben, benutzen Sie es. Wenn jeder es liebt, werden wir es offiziell machen.

Sneak Peek: verschachtelte Reihen

Wir bauen Features schnell . Jedes Mal, wenn wir eine neue Funktion beenden, beginnen wir eine neue. Immer wenn wir eine neue Funktion beginnen, gebe ich Ihnen einen kleinen Einblick.

Falls Sie es verpasst haben, sehen Sie sich die Funktion Sneak Peek in der letzten Woche an, wo ich verschachtelte Reihen vorgestellt habe. Reihen in Reihen! Es ist eine einfache Idee, aber ein wesentlicher erster Schritt bei der Erstellung eines flexibleren Layoutsystems für Divi 5.

Sehen Sie sich dieses Video für alle Details an.

Weitere Divi 5 -Updates sind unterwegs

2025 ist das Jahr von Divi 5 . Die mühsame Arbeit liegt hinter uns. Wir haben die superschnelle Stiftung gebaut, und jetzt ist es Zeit für Divi, ihr Comeback zu feiern.

Danke, dass du zugesehen hast, und bevor du gehst, habe ich einen Gefallen zu fragen. Wenn Sie für das Divi -Comeback hier sind, kommentieren Sie dieses Video. Ich werde jeden Kommentar lesen. Ich würde gerne sehen, wie dieses Video zweihundert Kommentare erzielt. Überprüfen Sie also den Kommentar und leisten Sie uns Hand, wenn Sie können. Es ist eine großartige Möglichkeit, den Algorithmus zu füttern, und was noch wichtiger ist, wir chatten gerne mit Ihnen.

Vergessen Sie nicht, uns auf YouTube zu folgen und den Divi -Newsletter abonnieren, damit Sie nie ein Update verpassen. Wir sehen uns bald für eine weitere Ankündigung von Divi 5 -Feature, von der ich verspreche, dass sie gleich um die Ecke sein wird.