How to Chat-Effekt erstellen

Ich liebe abwechslungsreiche Websites! Wie Du diesen animierten Chat-Effekt auf Deiner Seite mit Elementor umsetzt, zeige ich Dir im Video Schritt für Schritt 👣

Wie Du Schritt für Schritt diese Chat-Animation erstellst

Sie sehen gerade einen Platzhalterinhalt von Vimeo. Um auf den eigentlichen Inhalt zuzugreifen, klicken Sie auf die Schaltfläche unten. Bitte beachten Sie, dass dabei Daten an Drittanbieter weitergegeben werden.

Mehr Informationen

In diesem etwas ausführlicheren Video zeige ich Dir, wie Du Step bei Step eine Chat Animation erstellst und verrate Dir nebenbei, wie Du die Bewegungseffekte in Elementor einsetzen kannst und Dir insgesamt mit Copy & Paste das Leben leichter machen kannst.

Die Chat-Animation kannst Du Dir übrigens live hier auf meiner Website ansehen 😊

Inspiriert für das Tutorial wurde ich u.a. von meinem Kollegen Frank Katzer, der eine ähnliche Animation auf der Landingpage seiner Technik-Challenge hat.

Anmerkung: Ins Video haben sich ein Versprecher eingeschlichen 🙈 An Stelle 34:47 meine ich Tablet und nicht Mobile.

Code zum Kopieren

.elementor-widget-text-editor p:last-child { 
margin-bottom:0px;
}

Einfügen entweder auf Widget Ebene im Text-Editor Widget unter Einstellungen > Erweitert > Eigene CSS oder seitenübergreifend im Elementor Menü oben links > Drei Striche > Website Einstellungen > Individuelle CSS.

Tool-Tipps

Elementor Pro*

Canva

*Affiliate-Link. Wenn Du über diesen Link etwas kaufst, kostet es Dich nichts extra, aber ich erhalte eventuell eine kleine Provision, die ich direkt in mein Galão Projekt reinvestiere 😊

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Über mich
Britta Just lächelt in die Kamera.
Hi, ich bin Britta 🖐️
Hier teile ich mein Wissen rund um modernes Webdesign und gebe Dir Tipps, wie Du Deine Website in eine Marketing­maschine verwandelst, die Dein Angebot auch dann verkauft, wenn Du im Urlaub bist oder Zeit mit Deinen Liebsten verbringst.
Aktuelles
Mock-up des eBooks "Meine Tipps für eine konvertierende Summit Landingpage"
Meine Tipps für eine konvertierende Summit Landingpage

Hol Dir mein eBook mit Tipps für eine konvertierende Summit Landingpage inklusive Checkliste 👇

Weitere Artikel
20 Minuten, ein Kaffee, und los geht's mit dem Websitecheck: So bringst Du Deine Seite nach der Sommerpause in Form und bist startklar für ein starkes Q4.
Website selber bauen, sonst machst Du Dich abhängig? Von wegen! Warum Du nicht Webdesigner:in werden musst, um Deine Website selbst im Griff zu haben.
Blogseite & Archiv: So präsentierst Du Deine Artikel ansprechend, clever und hilfst Deinen Leser:innen, mehr Deiner Inhalte zu entdecken & leicht zu navigieren.
Fast fertig & Danke Seiten: Bestätige Deinen Besucher:innen, dass ihre Aktion erfolgreich war, und kom­muni­ziere klar den nächsten Schritt.
Yeah, ab in den Urlaub! So machst Du Deine Website startklar für die Sommerpause, damit Blog, Newsletter und Verkäufe auch in Deiner Abwesenheit weiterlaufen.
Zeitabhängige Sichtbarkeit: So zeigst Du mit dem Plugin „Dynamic Visibility“ Inhalte auf Deiner Webseite nur zu bestimmten Zeiten an – knackig erklärt im Video!