Are you an LLM? You can read better optimized documentation at /bannerify/design/scrollable-text.md for this page in Markdown format
If you need long legal text, safety copy, or PI content to stay readable in a compact area, Bannerify can export a truncated text layer as native scrollable HTML text.
If you want a dismissible overlay instead of inline scrolling text, see Add Popup Overlay.
Step 1. Create a truncated text layer in Figma
Create a text layer with a fixed text box size, and make sure it is set to Truncate (instead of auto-growing).
The visible text box size becomes the scroll container in HTML exports, while the full text content is preserved inside it.
Step 2. Enable scrollable HTML text in Bannerify
Open the layer settings for that text layer, then enable:
- Enable scrollable HTML text
This feature is only available for truncated text layers.
Step 3. Choose scroll behavior
When enabled, choose one of these modes:
- Manual User Scrollable: user scrolls manually for the full timeline.
- Auto Scroll on Layer Enter: starts auto-scrolling when the layer enters.
- Auto Scroll on Banner End: starts auto-scrolling when the banner timeline finishes.
Banner loop behavior
- If playback count is finite, Auto Scroll on Banner End triggers only on the final playthrough.
- If the banner is set to infinite looping, Auto Scroll on Banner End is skipped.
Step 4. Review export notes
- Scrollable truncated text is exported in HTML outputs.
- Native browser/device scrollbar styling is used.
- If that layer has an image format override applied, scrollable HTML text is disabled for that layer.