Templates
FloatMessage ships with 13 professionally designed templates. Each template is fully customizable from the dashboard — colors, text, images, buttons, and layout can all be configured without writing code.
Available Templates
| ID | Name | Description |
|---|---|---|
banner | Welcome Banner | Gradient banner with heading, text, and CTA button |
notification | Social Proof | Compact notification card with icon and text |
newsletter | Newsletter CTA | Email signup form with label, heading, and input |
square | Square Card | Centered card with badge, price, CTA, and timer |
image-message | Image Message | Card with hero image, text, and button |
center-modal | Center Modal | Full-width modal with backdrop |
blur-overlay | Blur Overlay | Glassmorphism-style overlay card |
sticky-footer | Sticky Footer Bar | Full-width bar at bottom of viewport |
top-banner | Sticky Top Banner | Full-width bar at top of viewport |
image-bg | Image Background | Card with full background image |
modal-image | Modal with Image | Side-by-side image and content modal |
image-only | Image Only | Clickable image with optional link |
story | Story Carousel | Instagram-style vertical story with slides |
Story Carousel Details
The Story Carousel template creates an Instagram-style vertical story experience. It is designed for rich, multi-slide narratives and promotions.
Key Features
- 9:16 aspect ratio — Optimized for vertical, mobile-first content.
- Multiple slides — Add as many slides as you need to tell your story.
- Progress bar — A segmented progress indicator at the top shows the visitor which slide they are on.
- Auto-advance — Slides automatically advance after a configurable duration.
- Swipe gestures — Visitors can swipe left/right on touch devices to navigate between slides.
- Per-slide configuration — Each slide can have its own background image, text, button, and link.
Story Slide Structure
Each slide in a story supports the following fields:
| Field | Description |
|---|---|
| Background image | Full-bleed image behind the slide content |
| Heading | Large title text overlaid on the slide |
| Body text | Supporting copy below the heading |
| CTA button | Action button with configurable label and link |
| Duration | How long the slide is shown before auto-advancing (in seconds) |