Index


A click-through URL redirects viewers when they click a specific part of your design. 


You can add click-through URLs to HTML5 designs to link to websites, phone numbers (mobile only), or email addresses. Click-through URLs can also include UTM codes to track performance and engagement.


There are two main types of click-through URLs: Background and Element.

  • Background URLs make the entire design clickable, redirecting the viewer when any part of the design is clicked
  • Element URLs make only a specific element in the design clickable. These respect the layering properties of Flexitive. Learn more about Managing your Layers.


Setting a Background Click-Through URL


To set a background click-through URL:

  1. Open the Layers Panel
  2. Navigate to the Background Colour Layer
  3. Click the link icon beside the layer

  4. Enter your URL (include https://, e.g., https://flexitive.com).


By default, links open in a new tab.


Setting an Element Click-Through URL


To set an element click-through:

  1. Open the Layers Panel
  2. Navigate to the element you want to apply the click-through URL to
  3. Click the link icon beside the layer
  4. Enter your URL (include https://, e.g., https://flexitive.com)
  5. Optional: Enter a Click Tracker Name to label the URL in the exported code.


By default, links open in a new tab.


Set Multiple Click-Through URLs


You can set multiple click-through URLs on different elements in a single design and manage them from the Layers Panel. The background click-through URL sits beneath all element click-through URLs.


For example, in the Adaptive Bean design below, the background click-through URL has been set to flexitive.com, and the call-to-action (CTA) button is set to the Flexitive Support Portal.


Adding a UTM Code


A UTM code is a snippet of code added to your click-through URL that helps you track the performance of the link. Use a UTM builder to create a click-through URL that contains a UTM code, such as the Google Analytics URL Builder.


Add a UTM code to your design by appending the UTM string to your click-through URL.


Create a Click-to-Call Option


blob1478014350438.png


To set up a Click-to-Call button:

  1. Set the click-through URL for an element or background layer as tel:1-XXX-XXX-XXXX
    1. Note: Click-to-Call only works on mobile devices.


Create a Click-to-Email Option


To set up a Click-to-Email button:

  1. Set the click-through for an element or background as mailto:you@example.com
    1. Example: To send an email to support@flexitive.com, set the URL as mailto:support@flexitive.com.




Controlling Where the Clickthrough URL Will Open


When setting a click-through URL, the default behavior is to open the URL in a new tab.


This can be changed using the Open in dropdown in the Set Click-through URL modal:

  • A New Tab (default)
  • The same tab
  • The parent frame for the design
  • The same frame as the design.



Clickthrough URLs and Ad Servers


When exporting a design for an ad server, Flexitive automatically includes a clickTag, along with any other code necessary to display the design. There is no need for additional programming after export.


The clickTag allows the ad server where the design is hosted to set the click-through URL destination.


Some ad servers, like Google Ads and The Trade Desk, require the click-through URL to be set only on the ad server side. 


For questions about specific ad servers, reach out to support@flexitive.com.