Chat Messages for Elementor - Create Animated Mobile-style Chat Message Mockups with Elementor

XElementor Chat Messages adds an Elementor widget for building a realistic phone chat window. It is designed for landing pages, product pages, portfolios, social proof sections, onboarding examples, and any layout where a visual message conversation helps explain the offer.

The widget lets you build a custom thread with messages from the user or another person. Messages animate into the phone one by one, can loop, and can include text or image-based bubbles. The phone frame, header, status bar, message input, message bubbles, wrapper, and avatars can be customized from Elementor controls.

• Elementor widget for mobile-style chat message mockups.
• Add unlimited messages with a repeater control.
• Choose whether each message is sent by the user or another person.
• Add avatar images or generate initials from a name.
• Automatic avatar background colors based on the avatar name.
• Text message bubbles and image message bubbles with up to three images.
• iPhone-style animated message reveal.
• Optional looping animation with configurable delays.
• Optional phone header and message input mockup.
• Header text or logo image support.
• Controls for wrapper max width and max height.
• Style controls for wrapper background, border, border radius, and shadow.
• Style controls for message bubble colors.
• Style controls for phone header, status bar, and input borders.