Adding scrollable truncated text layers to your banners

Use truncated text layers in Figma to export selectable, scrollable HTML text in Bannerify, with manual scroll or optional auto-scroll timing.

Video Tutorial: Add scrollable text disclaimers to HTML Figma banners

This video tutorial is a complete step-by-step guide showing you how to add scrollable text disclaimers (with auto-scroll) to HTML Figma banners using the Bannerify plugin.

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.
  • 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.

Scrollable HTML text is designed for truncated text layers only. If your layer is not truncated, it should be exported using normal text/image behavior.