← Back to Bannerify Video Tutorials

What this video covers

This tutorial shows how to add scrollable disclaimer text to HTML Figma banners using the Bannerify Figma plugin. It explains how to make a text layer truncation-enabled, turn on scrollable HTML text, and export the banner for manual scrolling or auto-scrolling behavior.

Things you'll need

• A Figma file with banner frames ready to load into Bannerify.
• The Bannerify Figma plugin installed or saved in Figma.

Steps

1. Open the Figma file, find Bannerify in the Figma plugins list, and run the plugin.
2. Load the banner frames into Bannerify so their content layers appear in the timeline.
3. Select the disclaimer text layer in Figma and enable truncate text so the layer becomes a truncated text box.
4. Refresh the banner in Bannerify, then open the layer settings and enable scrollable HTML text.
5. Choose one of the scroll modes: manually scrollable, auto-scroll on layer enter, or auto-scroll on banner end.
6. Export the banner as HTML, unzip the downloaded file, and open the index HTML preview in a browser to test the scroll behavior.
7. Copy the configured text layer into other banners, refresh all banners, and export multiple banners if needed.

Useful links

• Watch the full video on YouTube
• Read the full video transcript
• Read: Adding scrollable truncated text layers to your banners
• Next: Add rich text popup overlays to HTML Figma banners
• Open Bannerify in the Figma Community