Divi-Plugin-Highlight: Divi Next Texts

Divi Next Texts ist ein Drittanbieter-Plugin für Divi, das viele Module mit typografischen Designfunktionen hinzufügt. Die Module fügen Animationen, Hervorhebungen, Verläufe, Masken, Farbeffekte und sogar Glitches hinzu, um Ihnen beim Erstellen von Texteffekten zu helfen. Die Module machen es einfach, Typografie auf einzigartige Weise in Ihren Divi-Designs zu verwenden. In diesem Artikel werfen wir einen Blick auf Divi Next Texts, sehen, was es kann und wie einfach es zu bedienen ist.

Divi Next Texts Module

Dem Divi Builder werden 12 neue Module hinzugefügt. Jedes der Module enthält die erwarteten Registerkarten Inhalt, Design und Erweitert des Divi-Moduls, sodass Sie sie wie jedes Divi-Modul gestalten können. Schauen wir uns jedes Modul an. In meinen Beispielen verwende ich das Divi Tutor-Layoutpaket.

Divi Next Texte Textanimation

Textanimation funktioniert wie ein Schieberegler für einen bestimmten Text innerhalb eines Satzes. Fügen Sie einen Vorher- und Nachher-Text hinzu und fügen Sie dann den Animationstext innerhalb von Untermodulen hinzu.

Wählen Sie aus 10 Animationen. Dieses Beispiel zeigt die Eingabeanimation.

Die Ladeleiste hat Optionen für die Farbe und Höhe. Wie bei vielen dieser Module können Sie das h-Tag auf der Registerkarte Inhalt auswählen. Sie können den Text auch stapeln. Beim Stapeln des Textes wird der Vorher-Text oben, der animierte Text in der Mitte und der Nachtext unten platziert. Ich habe den Text in diesem Beispiel gestapelt.

Hier ist ein Blick auf die Spiral-Animation.

Divi Next Texte Textfarbe Bewegung

Textfarbe Motion ändert langsam die Farbe des Textes.

Die Registerkarte Design verfügt über zwei Bewegungsstile und Sie können die Bewegungsdauer festlegen.

Wählen Sie vier verschiedene Farben, um einen Farbverlauf zu erstellen.

Legen Sie den Farbverlauf als linear oder radial fest. Radial umfasst 8 Richtungen. Ich habe Radial und Mitte gewählt. Sie können auch die Startposition jeder der vier Farben festlegen.

Hier ist mein Beispiel in Bewegung. Ich habe Stil 2 ausgewählt, die Dauer auf 4s eingestellt, eine der Farben geändert und auf linear eingestellt.

Divi Next Texte Textteiler

Text Divider platziert eine Trennlinie auf beiden Seiten Ihres Textes. Dieses Beispiel zeigt die h-Tag-Auswahl.

Die Registerkarte Design enthält Trennereinstellungen, in denen Sie den Trennerstil auswählen können. Wählen Sie aus 8 Stilen oder wählen Sie aus, dass die Trennlinie nicht angezeigt wird.

Sie können auch die Farbe, das Gewicht und die Textlücke des Teilers auswählen.

Mit den Textoptionen können Sie die Textausrichtung ändern und einen Textschatten auswählen. Ich habe den Text rechts neben der Trennlinie platziert.

Die Schrifteinstellung steuert den Textstil, sodass Sie die volle Kontrolle über die Schriftfamilie, Farbe, Größe usw. haben.

Divi Next Texts Text Glitch

Text Glitch fügt den Text mit Animationen hinzu.

Die Registerkarte Design enthält Einstellungen für den Glitch-Stil, die Farben und die Position. Es stehen 7 Glitch-Stile zur Auswahl. Einige sind animierter als andere.

Wählen Sie die Textfarbe und zwei verschiedene Glitch-Farben aus.

Legen Sie die Glitch-Position mit separaten Einstellungen für links, rechts und oben fest.

Dies ist Glitch 4. Es ist einer der animierten Glitches.

Divi Next Texts Textverlauf

Textgradient färbt Ihren Text mit einem Farbverlauf.

Die Registerkarte Design enthält Farbverlaufseinstellungen. Wählen Sie zwei Farben, den Verlaufstyp (linear oder radial) und legen Sie die Richtung sowie die Start- und Endposition fest.

Der Enthüllungseffekt ist ein Balken, der sich schnell über den Bildschirm bewegt. Sie können den Effekt aktivieren und die Farbe auswählen.

Es enthält auch einen Hover-Effekt. Wählen Sie aus 29 Animationen.

Hier ist ein Blick auf die Textgradient-Animation. Ich habe den Reveal-Effekt und den Wobble Bottom-Hover-Effekt eingefügt.

Divi Nächste Texte Texthervorhebung

Texthervorhebung setzt eine Hervorhebung auf den Text. Es enthält auch einen Vorher- und Nachher-Text, mit dem Sie nur einen Teil einer Phrase hervorheben können. Sie können den Text auch als Stapel anzeigen.

Wählen Sie den Hervorhebungsstil aus 14 Auswahlmöglichkeiten. Der Hervorhebungsstil wird auf den Text gezeichnet. Die Animation wird nach einer festgelegten Zeit wiederholt. In diesem Beispiel wird Double verwendet.

Die Registerkarte Design enthält Hervorhebungseinstellungen, in denen Sie Farbe, Strichstärke und Animationsverzögerung auswählen können. In diesem Beispiel wird Zick-Zack verwendet.

Dieser verwendet Löschen. Ich habe die Strichstärke auf die maximale Einstellung eingestellt und die Deckkraft reduziert, damit der Text durchscheint.

Sie können die Schriftarten für den Überschriftentext anpassen und den Text separat hervorheben. Ich habe den Überschriftstext standardmäßig belassen und den hervorgehobenen Text fett gemacht und die Größe erhöht.

Sie können auch einen Hover-Effekt aktivieren. Dies wirkt sich auf den gesamten Text aus.

In diesem Beispiel wird der Hervorhebungsstil Wave verwendet. Ich habe die Breite auf 26px eingestellt, Rot ausgewählt und die Deckkraft reduziert, damit es wie ein Textmarker aussieht, und Wobble Skew für den Hover-Effekt ausgewählt.

Divi Nächste Texte Text Hover Highlight

Text-Hover-Hervorhebung enthält nur die Hervorhebung beim Hover. Hier können Sie das Vorher und Nachher des Textes deaktivieren.

Es stehen 59 Hover-Effekte zur Auswahl.

Sie können die Höhe der Hervorhebung anpassen. Der Standardwert ist 3px. In diesem Beispiel habe ich den Hover-Effekt „Links überstreichen“ ausgewählt und die Hervorhebungshöhe auf 10px festgelegt.

Die Hervorhebungseinstellungen umfassen die Farbe und einen Farbverlauf. Ich habe den Vorher- und Nachher-Text aktiviert, für die Hervorhebung rechts unterstreichen ausgewählt und die Höhe auf 16px eingestellt. Die Highlight-Farbe ist Rot mit reduzierter Deckkraft.

Dieser enthält einen Farbverlauf. Wählen Sie zwei Farben aus, den Verlaufstyp, die Richtung, die Startposition und die Endposition.

Die Schriftarten haben eine unabhängige Kontrolle für den Text und den Hervorhebungstext. Ich habe an beiden Anpassungen vorgenommen.

Hier ist die Animation. Ich habe Double Underling Right für den Hover-Effekt ausgewählt, die Höhe auf 24px eingestellt und einen Farbverlauf für den Hover-Effekt verwendet.

Divi Next Texts Textmaske

Die Textmaske verfügt über mehrere Einstellungen und Optionen, einschließlich Optionen für die vertikale Drehung und vertikale Spiegelung. Ich habe beide Optionen aktiviert.

Mit Bildmaske können Sie ein Bild auswählen, das als die Farben des Textes angezeigt wird. Wählen Sie Hintergrundgröße, Position und Bildwiederholung aus.

Dieser Effekt funktioniert besonders gut bei großen, ultrafetten Schriftarten.

Sie sehen auch toll aus mit Farbe über dem Hintergrundbild.

Textmaske enthält auch Hover-Animationen.

Dieses Beispiel zeigt den Pop-Hover-Effekt. Ich habe eine hellbraune Überlagerung eingefügt und die Schriftart auf Kursiv und Großbuchstaben eingestellt.

Divi Nächste Texte Text mit mehreren Überschriften

Text Multi Heading fügt drei Sätze von Überschriftentext hinzu und enthält für jede Überschrift einen anderen Hintergrund.

Die Hintergründe umfassen Farben und Farbverläufe. In diesem Beispiel wird hinter der ersten Überschrift ein blauer Hintergrund platziert.

Der Farbverlauf hat zwei Farben. Wählen Sie den Verlaufstyp (linear oder radial), Richtung, Startposition und Endposition. Ich habe der zweiten Überschrift einen Farbverlauf hinzugefügt.

Die drei Überschriften können unabhängig voneinander angepasst werden. Ich habe die Farben, Größen und das Gewicht der Überschriften angepasst. Ich habe auch die Schriftgröße erhöht. Jede Überschrift hat eine andere Größe.

Jede Überschrift kann einen Farbverlauf haben. Ich habe der zweiten Überschrift einen Farbverlauf hinzugefügt.

Überschriften enthalten einen separaten Enthüllungseffekt, bei dem Sie für jede Überschrift eine andere Farbe auswählen können.

Der Hover-Effekt umfasst alle drei Überschriften.

Jede Überschrift hat separate Abstandseinstellungen. Ich habe 30px rechts und links von der zweiten Überschrift hinzugefügt.

Überschriften haben auch unabhängige Grenzen. Ich habe der zweiten Überschrift einen Rahmen hinzugefügt.

Divi Nächste Texte Textstrich

Text Stroke erstellt eine Strichanimation und einen großen umrissenen Text.

Die Stricheinstellungen umfassen Farbe, Schwebeeffekte, Schweberichtung und Bewegungsdauer. Ich habe die Farbe angepasst und die Strichbreite auf 6px eingestellt. Dies ändert die Stärke der Linien der Schriftart. Animationen umfassen Strich zum Füllen und Füllen zum Strich. Es stehen 6 Richtungen zur Auswahl.

Die Hover-Farbe ändert die Farbe innerhalb der Schriftart. Es hat eine einfarbige Farbe und einen Farbverlauf. Dies ist die Volltonfarbe.

Hier ist ein Farbverlauf. Ich habe die Farben angepasst, auf radial eingestellt und die Richtung auf zentriert.

Divi Next Texts Text Stroke Motion

Textstrichbewegung fügt einen Stricheffekt mit Animationen hinzu.

Farbanpassungen umfassen Single, Multi und Fill. Dies ist Single, die nur eine Farbe zeigt.

Bei Multi können Sie 5 verschiedene Farben auswählen. Die Farben sind animiert.

Mit Füllung können Sie eine Farbe im Text auswählen.

Die Stricheinstellungen umfassen die Breite der Linien, die Länge des Strichs, die Größe der Lücke und den Strichversatz. Diese arbeiten zusammen, um einige interessante Designs zu erstellen.

Hier ist die Animation. Ich habe die Farben, Breite und Strichgröße geändert.

Divi Nächste Texte Textneigung

Text Tilt bietet eine Karte mit einem Titel und einem Inhaltsbereich. Fügen Sie Ihre Inhalte mit dem Editor hinzu. Die Karte neigt sich in eine andere Richtung, je nachdem, wo Sie schweben.

Der Hintergrundinhalt umfasst Volltonfarben und Farbverläufe. Hier ist ein Beispiel für das Kippen der Karte.

Blendung fügt einen Blendeffekt hinzu, der je nach Neigung der Karte unterschiedlich aussieht.

3D Tilt lässt den Text von der Karte wegspringen.

Tilt Reverse lässt die Karte in die entgegengesetzte Richtung kippen. Zu den Einstellungen gehören auch Perspektive, Max, Geschwindigkeit, Start für x und y und Maßstab.

Es enthält auch Einstellungen für Inhaltsabstand, Inhaltsrahmen und Inhaltsfeldschatten.

Hier ist der Tilt-Effekt mit Blendung. Ich habe einen Rahmen und einen Kastenschatten eingefügt.

Divi Next Texte Preis und Support

Divi Next Texts ist auf der Website des Entwicklers verfügbar. Es gibt 3 Lizenzoptionen:

• Einzellizenz – 29,00 $
• Unbegrenzte Lizenz – $49.00
• Lebenslange Lizenz – $129.00

Der Support wird mit einem Ticketsystem bereitgestellt. Die Support-Seite enthält Links zu FAQs. Einige enthalten detaillierte Videos und Anweisungen.

Gedanken beenden

Divi Next Texts ist ein hervorragendes Plugin, das Divi viele typografische Funktionen hinzufügt. Ich mag besonders die Animationen, Hover-Effekte, Maske, Strich, und eigentlich mag ich sie alle.

Die Module sind sehr intuitiv. Einige der Einstellungen, wie z. B. h-Tags, scheinen auf der Registerkarte Design zu sein. Einige der Animationen sehen ähnlich aus. Dies sind keineswegs Beschwerden, aber ich wollte sie erwähnen.

Wenn Sie Ihren Divi-Websites viele typografische Animationsfunktionen hinzufügen möchten, ist Divi Next Texts eine gute Wahl.

Wir wollen von dir hören. Haben Sie Divi Next Texts ausprobiert? Lassen Sie uns in den Kommentaren wissen, was Sie davon halten.

Ausgewähltes Bild über Mascha Tace / shutterstock.com