Divi Plugin Highlight – Divi Display Logic

Was wäre, wenn Sie möchten, dass ein bestimmtes Divi-Designelement basierend auf den von Ihnen gewählten Bedingungen angezeigt wird? Dies würde einige Gestaltungsmöglichkeiten eröffnen, wie beispielsweise die Anzeige einer Version einer Seite basierend auf dem Login-Status des Benutzers, der Tageszeit oder seiner Geolokalisierung. Ein Plugin namens Divi Display Logic bietet Divi diese Funktion.

Divi Display Logic ist ein Drittanbieter-Plugin von Tortoise IT, das sowohl mit Divi als auch mit Extra zusammenarbeitet, um Anzeigelogik hinzuzufügen. In diesem Plugin-Highlight werfen wir einen Blick auf das Plugin und sehen einige Beispiele dafür, was es kann.

Die Bilder für diese Beispiele stammen von Unsplash.com und den kostenlosen Divi-Layouts, die hier im Elegant Themes-Blog verfügbar sind.

Divi Display Logic installieren

Laden Sie das Plugin wie gewohnt hoch und aktivieren Sie es. Unter Plugins wird dem Dashboard ein neuer Menüpunkt namens Divi Display Logic hinzugefügt. Hier fügen Sie Ihren Lizenzschlüssel hinzu. Dadurch wird sichergestellt, dass Sie Plugin-Updates erhalten.

Anzeigelogik wird jetzt zu allen Abschnitten, Zeilen und Modulen auf der Registerkarte Inhalt im Backend Divi Builder hinzugefügt. Zu den Funktionen gehören eine Datums- und Uhrzeitauswahl, eine Dropdown-Box, in der Sie die vordefinierte Logik auswählen können, und eine Box, die den Shortcode anzeigt, den das Plugin für Ihre Logik erstellt.

Vordefinierte Logik

Das Dropdown-Feld Vordefinierte Logik bietet 18 vorgefertigte Logikoptionen zur Auswahl. Es gibt noch ein paar mehr, die Sie kopieren und in den Shortcode-Bereich einfügen können. Sie können Ihre eigenen Logikoptionen hinzufügen, wenn Sie codieren möchten, und Sie können den Shortcode bearbeiten, um Variationen zu erstellen.

Die Auswahlmöglichkeiten bestehen darin, basierend auf einer bestimmten Zeit, zwischen bestimmten Zeiten, an bestimmten Tagen, anzuzeigen, ob es eine NEWS-Kategorie hat, ob der Benutzer angemeldet ist, an einer bestimmten Benutzerrolle, an einem bestimmten Ort und basierend auf PHP-Code. All dies kann geändert werden.

Logik-Shortcode

Sobald Sie eine vordefinierte Logik auswählen, wird automatisch ein Shortcode erstellt. Sie müssen diesen Shortcode nicht verwenden, können ihn jedoch hier bearbeiten, wenn Sie möchten.

Sie können auch einen beliebigen kapselnden Shortcode (einen Shortcode mit einem Start- und End-Tag [shortcode][/shortcode]) verwenden, um Ihre eigenen Argumente zu erstellen. Dies wird in der Beschreibung unter dem Shortcode-Feld erklärt, aber ich würde gerne auch ein Beispiel in der Beschreibung sehen.

Zum Bearbeiten markieren Sie einfach den Teil innerhalb des Shortcodes und nehmen Ihre Änderungen vor.

Hier ist ein Beispiel, das den Inhalt an Wochentagen ausblendet. Wenn Sie den Inhalt anzeigen möchten, anstatt ihn auszublenden, würden Sie im Shortcode "ausblenden" in "anzeigen" ändern. Eine andere Möglichkeit wäre, die Zahlen 1-5 durch „6,7“ zu ersetzen, wodurch der Inhalt am Wochenende ausgeblendet wird.

Ich fand die Manipulation des Shortcodes intuitiv, da die meisten Schlüsselwörter in der Zeichenfolge einfach sind.

Integrierte Shortcode-Beispiele

Der allererste Link (mit der Bezeichnung Click here) im Bereich Display Logic bietet detaillierte Beispiele für die Shortcodes. Diese sind besonders hilfreich für die PHP-Beispiele. Sie können diese kopieren und in das Shortcode-Feld einfügen.

Auswahl von Datum und Uhrzeit

Um die Datums-/Zeitauswahl zu verwenden, klicken Sie auf den Text „Wenn Sie Datumsangaben verwenden, klicken Sie hier“. Dadurch werden zwei Felder geöffnet, in denen Sie das Datum zum Anzeigen und Ausblenden auswählen können. Dies sind Zeitbedingungen, die bestimmen, wann der Abschnitt, die Zeile oder das Modul angezeigt wird. Die Logik für die Anzeige wird aus der Liste Vordefinierte Logik ausgewählt.

Wählen Sie Datum und Uhrzeit aus, indem Sie in die Felder für Datum anzeigen und Datum ausblenden klicken. Dadurch wird ein Kalender mit Stunden- und Minutenschieberegler angezeigt. Über den Feldern befindet sich eine Nachricht, die die aktuelle Serverzeit anzeigt.

Es ist wichtig, die Zeit Ihres Servers und nicht die tatsächliche Zeit zu verwenden. Hier erhält WordPress die aktuelle Uhrzeit und wird von Divi Display Logic verwendet.

Das Modul zeigt nun den Inhalt zwischen dem von mir gewählten Datum und der Uhrzeit an.

Dies eröffnet viele Möglichkeiten. Zum Beispiel:

• Sie können eine Verkaufsseite mit Blitzangeboten erstellen, indem Sie einen Countdown-Timer verwenden, um anzuzeigen, wann der Deal endet und der nächste beginnt.
• Sie können einen Verkauf zu einem bestimmten Zeitpunkt starten.
• Haben Sie einen Deal, der zu einem bestimmten Zeitpunkt endet.
• Zeigen Sie Inhalte innerhalb eines Artikels zu einem bestimmten Zeitpunkt auch nach der Veröffentlichung des Artikels an.
• Zeigen Sie unterschiedliche Inhalte basierend auf am oder pm

Divi Display Logic Beispiele – Schulaufruf zum Handeln

Für mein erstes Beispiel erstelle ich eine Landingpage für eine Schule. Die Seite wird einen Call-to-Action zur Anmeldung für Studenten in den USA enthalten, aber Personen außerhalb der USA können sich nicht anmelden. In diesem Beispiel wird das Homepage-Layout für Universitäten und Hochschulen verwendet.

Das Layout enthält eine Zeile mit Text- und Schaltflächenmodulen. Ich möchte, dass der Text und die Schaltfläche für jeden außerhalb der USA durch andere Module ersetzt werden.

In den Zeileneinstellungen habe ich "Inhalt ausblenden, wenn der Benutzer in den USA ist" ausgewählt.

Als nächstes habe ich "hide" im Shortcode in "show" geändert, wodurch effektiv ein neuer Shortcode erstellt wurde.

Ich habe die Zeile geklont und den Inhalt für Benutzer in den USA für die neue Zeile ausgeblendet.

Jetzt wird nur eine der Zeilen basierend auf dem Standort des Besuchers angezeigt.

Die US-Besucher sehen den ursprünglichen Slogan und die Schaltfläche zum Anwenden.

Alle Besucher außerhalb der USA sehen einen anderen Slogan und eine andere Schaltfläche mit einer anderen Beschriftung.

Divi Display Logic Beispiele – Flash Sale

Dies ist eine einfache Verkaufsseite, die nur ein Produkt als Flash-Sale anzeigt. Wenn der Countdown-Timer Null erreicht, nimmt ein neues Produkt mit neuem Countdown-Timer seinen Platz ein.

Während nur ein Abschnitt angezeigt wird, hat die eigentliche Seite selbst einige weitere Abschnitte verlassen. In jedem Abschnitt habe ich die Logik festgelegt, um Inhalte zu einem bestimmten Zeitpunkt anzuzeigen. Die Abschnitte werden nicht geladen, wenn die Seite in den Browser geladen wird. Sie können also beliebig viele mit allen gewünschten CSS hinzufügen und die Ladezeit wird dadurch nicht verlangsamt.

Der Countdown-Timer und die Anzeigelogik arbeiten unabhängig voneinander. Ich habe die Zeit für den Zähler so eingestellt, dass sie mit der Zeit übereinstimmt, die die Anzeigelogik anzeigt.

Divi Display Logic Beispiele – Autoren-Site mit Mitgliedschaftsbereich

In diesem Beispiel wird das kostenlose Elegant Authors-Layout verwendet. Ich möchte unterschiedliche Inhalte anzeigen, je nachdem, ob der Besucher eingeloggt ist oder nicht. Besucher, die nicht eingeloggt sind, sehen den Bildschirm im Bild oben, der einen Aufruf zum Handeln enthält.

Besucher, die eingeloggt sind, sehen keinen CTA. Stattdessen wird ihnen ein Link zu einem speziellen Bereich der Website angezeigt, auf den nur eingeloggte Personen Zugriff haben. Der spezielle Zugriff kann durch separate Mitgliedschafts-Plugins oder durch Zuweisen einer Benutzerberechtigung zum Anzeigen von Inhalten und Auswählen dieser Funktion als Logik gesteuert werden.

Anstatt den gesamten Abschnitt zu klonen, habe ich nur die Schaltfläche geklont. Alles andere wird gleich bleiben. Auf diese Weise muss ich, wenn ich mich entscheide, das Hintergrundbild zu ändern, es nur in einem Abschnitt ändern.

Ich habe die Logik für die obere Schaltfläche so eingestellt, dass der Inhalt nur abgemeldeten Benutzern angezeigt wird.

Die zweite Schaltfläche wird nur angemeldeten Benutzern angezeigt.

Alternativ hätte ich 'Diesen Inhalt anzeigen, wenn der Benutzer die Berechtigung "view_content" hat' verwenden können.'

Angemeldete Benutzer sehen jetzt die neue Schaltfläche, die ihnen einen Link zu einer bestimmten Seite oder einem Beitrag bietet.

Divi Display Logic Beispiele – Autorenseite mit neuer Zielseite

Eine andere Möglichkeit ist natürlich auch, eine ganz andere Seite anzuzeigen. In diesem Beispiel wird das gleiche Layout wie im vorherigen Beispiel verwendet, aber ich habe zwei neue Abschnitte hinzugefügt, die einen Header in voller Breite und ein Blog-Modul enthalten.

Ich habe die Logik für jeden Abschnitt festgelegt. Alle Abschnitte, aus denen die Zielseite besteht, werden für nicht angemeldete Benutzer angezeigt. Die unteren beiden Abschnitte, die eine Blog-Seite mit einer Kopfzeile in voller Breite erstellen, werden für angemeldete Benutzer angezeigt.

Jetzt eingeloggte Benutzer sehen die Verkaufsseite nicht. Wenn ich den Verkaufsartikel in etwas ändere, das alle Benutzer sehen sollen, ändere ich einfach die Anzeigelogik.

Verwenden von Divi Display Logic mit Extra

Divi Display Logic funktioniert auch mit Extra. Dieses Beispiel zeigt das Posts Carousel Module im Category Builder.

Lizenz

Divi Display Logic kann auf unbegrenzten Websites für Sie und Ihre Kunden verwendet werden. Es beinhaltet 6 Monate Support und 12 Monate Updates. Nach Ablauf der 12 Monate müssen Sie das Plugin erneut kaufen, um Updates zu erhalten. Der Rückkaufpreis beträgt 50 % des ursprünglichen Kaufpreises.

Abschließende Gedanken

Divi Display Logic bietet viele Optionen, um zu bestimmen, wann ein Abschnitt, eine Zeile oder ein Modul angezeigt wird. Mit Anzeigeoptionen wie Uhrzeit, Datum, Geolokalisierung, ob der Benutzer eingeloggt ist oder nicht und dem Level des Benutzers sind die Gestaltungsmöglichkeiten praktisch endlos.

Ich fand das Plugin intuitiv zu bedienen. Die Shortcodes sind leicht zu manipulieren. Ein paar weitere Beispiele wären hilfreich – insbesondere für PHP. Wenn Sie einen Abschnitt, eine Zeile oder ein Modul basierend auf einer Bedingung anzeigen möchten, ist Divi Display Logic eine gute Wahl.

Siehe Divi Display Logic bei Tortoise IT für Kaufinformationen.

Wir wollen von dir hören. Haben Sie Divi Display Logic verwendet? Lassen Sie uns in den Kommentaren wissen, was Sie davon halten.

Ausgewähltes Bild über phipatbig / shutterstock.com