Website markup
If you're aiming to create entirely bespoke website experiences, add markup to your site to fine-tune control of how the Flip.to platform blends into the site.
This markup tells the Flip.to platform whether an element should trigger a flow, pass along signals, or display content.
Setting up trigger markup
Allow for links, buttons, or other elements to initiate actions through the Flip.to platform. See examples for specific scenarios.
<a href="#" ft-trigger="discovery" ft-trigger-step="experiences-list" ft-property="your-property-slug" class="ft-trigger-discovery" style="display:none;">Your action text</a>ft-trigger
discovery
Required Sets the element to display a specific flow
ft-trigger-step
experiences-list
router
Optional Defines a specific step to display for the flow.
If not set, the visitor will start on the default first step.
ft-property
{property-slug}
Optional Defines a specific property for the flow.
Find your property-slug in your Flip.to account.
If not set, the platform may detect the property automatically if it can be identified from the element href or from signals provided by the page.
class
ft-trigger-discovery
Required Provides a class name for additional styling if needed.
style
display:none;
Required If Discovery should fail to load, the markup CTA will be hidden.
Scenarios
Show Discovery
<a href="#" ft-trigger="discovery" class="ft-trigger-discovery" style="display:none;">Your action text</a>Show Discovery at the experiences list step
<a href="#" ft-trigger="discovery" ft-trigger-step="experiences-list" ft-property="your-property-slug" class="ft-trigger-discovery" style="display:none;">Your action text</a>The ft-property attribute is required for this markup on sites with multiple properties. It is not required on sites that have only one property set up for Discovery.
Show Discovery for a specific property (for sites with multiple properties)
<a href="#" ft-trigger="discovery" ft-property="your-property-slug" class="ft-trigger-discovery" style="display:none;">Your action text</a>Show Discovery at the router step (for sites with multiple properties)
<a href="#" ft-trigger="discovery" ft-trigger-step="router" class="ft-trigger-discovery" style="display:none;">Your action text</a>The ft-property attribute must not be set for this markup.
Setting up signal markup
Allow for a trigger to pass along signals to Flip.to components.
<a href="#" ft-promo-code="mayday-promo" ft-arrival-date="2025-05-01" ft-departure-date="2025-05-07">Your action text</a>If the trigger also has URL parameters that provide the same type of signal as an existing attribute, the URL parameter will override the attribute.
ft-promo-code
custom
ft-group-code
custom
ft-rate-code
custom
ft-travel-agent-code
custom
ft-corporate-code
custom
ft-room-code
custom
ft-arrival-date
custom
ft-departure-date
custom
Setting up content markup
Allow for content to display on the website.
Last updated