Documentation Index

For the complete documentation index, see llms.txt. Markdown versions of docs pages are available through the page's alternate Markdown link.

Current page: Adding clickable URL links to your banners - There are two ways to add URL links to your HTML banner exports in Bannerify; one is to include an `<a>` link tag around the entire banner, and the other is to add clickable links to individual layers in your timeline. . Machine-readable page: /bannerify/design/links.md.

Adding clickable URL links to your banners

There are two ways to add URL links to your HTML banner exports in Bannerify; one is to include an <a> link tag around the entire banner, and the other is to add clickable links to individual layers in your timeline.

Links only applies to HTML exports. Please note that this will only apply to all HTML export options, and won't have any effect on GIF or video exports from the plugin.

Adding a clickable URL to the entire banner ​

To add a link around your entire banner, you can paste a link into the URL field inside of the export settings panel. This will automatically wrap your entire banner inside of an <a> tag, which has an href set to the URL that you specified in the input field.

Adding a clickable URL to a specific timeline layer ​

If you need to make a certain timeline layer clickable, you can do this by clicking on that layer in your Figma canvas, then adding an Open link interaction under the native Figma Prototype panel. Pasting your link into the URL field of the Figma interaction will automatically include an onclick="window.open('https://yourwebsitelink.com', '_blank')" attribute to that element in your HTML banner export.

Only applies to layers visible in your Bannerify timeline. Please note that this will only be applied to layers that are visible in your Figma timeline. By default, this means direct child layers of your banner frame; you can optionally include nested layers via the plugin, and then apply a prototype link interaction to those nested layers, if desired, too.

Using Enabler.exit() on timeline layers for DoubleClick exports ​

If you export with the DoubleClick Studio format, you can also set a timeline layer's Figma prototype URL to an Enabler.exit(...) call instead of a normal website URL.

  1. Select a layer in your timeline (for example your CTA button).
  2. In Figma's Prototype panel, add an On click -> Open link interaction.
  3. In the URL field, enter a DoubleClick exit call like:
js
Enabler.exit("CTA Exit");
  1. Export your banner with Bannerify using the DoubleClick Studio format.

Bannerify will then:

  • bind that layer to Enabler.exit("CTA Exit"),
  • keep the default full-banner background exit (Enabler.exit("Background Exit")),
  • prevent the layer click from bubbling to the background exit, so you do not get duplicate exit calls.

Use this only for DoubleClick exports. For non-DoubleClick HTML formats, use regular website URLs in Prototype links (for example, https://example.com).