Plugin Details
Home / Plug-in market / Scrolling Text Decoration Module
Scrolling Text Decoration Module
Scroll Text Decoration Module
Overview
Scroll Text is a plugin that adds a scrolling text announcement display module to the admin "Design → Decoration" builder. It displays multiple rich-text items in a horizontally scrolling marquee, with extensive style customization and hollow text effects. Perfect for homepage announcement bars, brand slogan displays, promotional information carousels, event reminders, and similar use cases.
Key Features
📜 Scrolling Marquee Text
| Feature | Description |
|---|---|
| Multiple text items | Supports adding multiple rich-text items – automatically loops and scrolls continuously |
| Seamless loop | Content duplicated in two copies – 50% translation achieves infinite seamless scrolling |
| Hollow effect | Text can be set to hollow style (outline only, no fill) – highly design-oriented |
| Rich-text support | Supports inserting links, bold text, line breaks, and other formatted content |
🎮 Playback Controls
| Feature | Description |
|---|---|
| Scroll direction | Supports scrolling left / right |
| Scroll speed | Configurable from 3 to 60 seconds per complete cycle |
| Pause on hover | Scroll pauses on mouse hover – enhances interactive experience |
| Respects reduced motion preference | Detects prefers-reduced-motion – automatically disables animation |
📐 Style Configuration Options
| Option | Description |
|---|---|
| PC font size | Configurable from 12 to 80px |
| Mobile font size | Configurable from 10 to 60px |
| PC gap | Configurable from 0 to 200px |
| Mobile gap | Configurable from 0 to 160px |
| Background color | Custom marquee background color |
| Text color | Custom text color |
| Module width | Narrow (container) / Wide (container-fluid) / Full (w-100) |
Technical Features
-
✅ Seamless infinite scrolling : Uses 50% translation technique – content duplicated in two copies for gap-free looping
-
✅ Bidirectional scrolling : Supports both left and right scroll directions
-
✅ Hollow text effect : Uses
-webkit-text-strokefor outline-only text – visually distinctive -
✅ Rich-text support : Each text item supports rich-text content – can insert links, line breaks, etc.
-
✅ Responsive spacing : Independent font size and gap settings for PC and mobile
-
✅ Pause on hover interaction : Scroll pauses on mouse hover – doesn't block interaction
-
✅ Respects user preferences : Automatically detects
prefers-reduced-motion– disables scrolling when user prefers reduced motion -
✅ Any theme compatible : Frontend views are plugin-bundled – completely independent styling
-
✅ Full design editor support : Real-time preview – supports multi-language rich-text editing
Use Cases
-
Homepage top/bottom announcement bar
-
Brand slogan / tagline display
-
Promotional information carousel
-
Important notifications / reminders
-
Scrolling news / updates
-
Holiday greeting messages
