Comment on page
Unbounce Integration
How to integrate AnyTrack with Unbounce landing page builder in order to track affiliate links and optin forms.
Unbunce integration
Unbounce is a popular landing page builder used by digital marketers.
AnyTrack integrates seamlessly with Unbounce so you can track your landing page engagements in a matter of minutes.
- 1.Create or edit your landing page
- 2.Open the page JS settings
- 3.Copy/paste the AnyTrack tracking code in the
<head>placement of the page.
Add the AnyTrack TAG in your Unbounce page
By default, AnyTrack will AutoTrack any form submissions. However, if you would like to send tracking info to your CRM or email marketing software, you will need to add a hidden field to your form.
- 1.Edit the optin form
- 2.Add a hidden field -
- 1.Field name: any field name will work but it should match your Email marketing software requirements
- 2.Default value: The default field value should be set as
{click_id}(see illustration below)
On page load, AnyTrack will AutoTag the form by substituting
{click_id} with an actual value. 
When you integrate your Mailchimp account in Unbounce, you can then tie the form submission to your list, and run automation within Mailchimp.
If you haven't created a custom field for the AnyTrack
click_id, you can do so directly within Unbounce in the field mapping screen.
Mailchimp Landing Page Leads Integration - Unbounce
Unbounce
Mailchimp Unbounce integration
You can name the fields as you see fit, but we recommend using the same name as below so that you can take advantage of some automations.
Unbounce Mailchimp AnyTrack integration
If you add the mailchimp embed form directly into your Unbounce page, you must add manually the hidden field into the embed code.
<input type="hidden" name="CLICK_ID" value="" data-at-value="{click_id}">
<!-- Begin Mailchimp Signup Form -->
<link href="//cdn-images.mailchimp.com/embedcode/classic-10_7.css" rel="stylesheet" type="text/css">
<style type="text/css">
#mc_embed_signup{background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; }
/* Add your own Mailchimp form style overrides in your site stylesheet or in this style block.
We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
</style>
<div id="mc_embed_signup">
<form action="https://anytrack.us10.list-manage.com/subscribe/post?u=xxxxxxx&id=xxx" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
<div id="mc_embed_signup_scroll">
<h2>Subscribe</h2>
<div class="indicates-required"><span class="asterisk">*</span> indicates required</div>
<div class="mc-field-group">
<label for="mce-EMAIL">Email Address <span class="asterisk">*</span>
</label>
<input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
/* Add the hidden field code, where the name="CLICK_ID" is the actual merge field name,
not the label. The field MUST exist in your list merge fields.
<input type="hidden" name="CLICK_ID" value="" data-at-value="{click_id}">
</div>
<div id="mce-responses" class="clear">
<div class="response" id="mce-error-response" style="display:none"></div>
<div class="response" id="mce-success-response" style="display:none"></div>
</div> <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
<div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_a63cc4793f68f437xxxxxxxx773a6a77d_37544c5a66" tabindex="-1" value=""></div>
<div class="clear"><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button"></div>
</div>
</form>
</div>
<script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';fnames[3]='ADDRESS';ftypes[3]='address';fnames[4]='PHONE';ftypes[4]='phone';fnames[5]='BIRTHDAY';ftypes[5]='birthday';fnames[6]='CLICK_ID';ftypes[6]='text';fnames[7]='UBPAGEID';ftypes[7]='text';fnames[8]='UBVARIANT';ftypes[8]='text';fnames[9]='UBDATE';ftypes[9]='date';fnames[10]='MMERGE10';ftypes[10]='number';fnames[11]='IP_ADDRESS';ftypes[11]='text';fnames[12]='PAGE_URL';ftypes[12]='url';}(jQuery));var $mcj = jQuery.noConflict(true);</script>
<!--End mc_embed_signup-->
By default, AnyTrack will AutoTag and AutoTrack affiliate links from affiliate networks integrated in AnyTrack.
In the illustration below, you can see
?sid=YHgyd9JQncnx8LOx58TwTd parameter which is the query string used by CJ Affiliates to track conversions.
- Disable Pass through parameters: This setting will grab the parameter from the browser url and appends them to the link. In some cases, this setting can alter the attribution settings.🛑
- Target: Same / open new tab or window.
- Goal Settings: whether you want to use unbounce to track clicks as "conversions"
Unbounce link settings
Unbounce editor does not give the ability to edit the link attributes on buttons elements. However, if you want to add link attributes on text links, you can.
Update text link in Unbounce editor
That's it, your Unbounce page is now fully tracked and ready to for any type of traffic.
Since Unbounce doesn't let you add standard link attributes to buttons or other html elements, you can use the CSS settings instead.
The CSS method follows the link attribute data-tracking-group but is shorter
tgid-{affiliate_network}CSS Code Examples
Hasoffers
tgid-hasoffers
Impact
tgid-impact
Click on the button you want to edit
Tracking group in css