What are Click Triggers?
The Click Trigger feature within List Builder Pro is an awesome new feature that allows your visitors to "trigger" a List Builder popup by clicking on an on-page element. You can make the trigger for your popup a link, a button, or even an image! Cool right? We thought so too. NOTE: Click triggered popups ignore display rules and behavior options. You are simply forcing a trigger of that campaign. Also, the click trigger does not affect the way that campaign runs on its own.
Check out our video that covers the basics, then keep reading for more detailed information on Click Triggers:
- Navigate to the Click Triggers tab within your email app and click Add New Code.
- Make sure to name the trigger and choose which campaign you wish to be triggered upon the click.
- Copy the Inline Click Trigger Code.
- Paste the Inline Click Trigger Code into your site's source code. (Note: You may insert the Click Trigger code into your website's source code differently, depending on your platform.)
- You're done! Now click the trigger you have created to see your hard work in action!
You can also add Click Triggers to an existing element by adding the unique Click Trigger class to any clickable element on your page! Here's how:
- Find your Click Trigger code.
<a data-sumome-listbuilder-id="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx">Click Here</a>
- Convert it into this format:
- Add that as a class to an existing element:
<button class="sumome-listbuilder-id-xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx">Click me!</button>
- That's it!
- Used as a link on a page: <a data-sumome-listbuilder-id="d9256b4b-d85e-45cf-960b-9493f0f8a9ff">I am a link. Click Me :)</a>
- Used as an button: <button data-sumome-listbuilder-id="d9256b4b-d85e-45cf-960b-9493f0f8a9ff">Click Trigger Button</button>
- Used as an H1 Tag: <h1 data-sumome-listbuilder-id="d9256b4b-d85e-45cf-960b-9493f0f8a9ff">I am an h1 trigger. Click Me :)</h1>
- Used as an image: <img src="http://secondchance.fitness/wp-content/uploads/2015/09/click-here-button-orange-2.jpg" data-sumome-listbuilder-id="d9256b4b-d85e-45cf-960b-9493f0f8a9ff" />
- Used inside of a <div>: <div style="align:center;"><a data-sumome-listbuilder-id="d9256b4b-d85e-45cf-960b-9493f0f8a9ff" >I'm inside of a <div></a></div>