Unbounce is a popular tool for landing pages - and for good reason. It enables users to easily test and experiment with landing page design and content variations.

Use it to

Name recordings after the Unbounce variant (if a user lands on page B, the recording will reflect this). This allows you to filter the recording list, heatmap list, funnels, and form analytics reports based on your experiments and variants.

The integration sets a custom variable in Mouseflow so you can filter the list of recordings by experiment name and variation name. This lets you filter for a page (with all variants combined into one), exclude all variants from a page (to view traffic not bucketed into tests), or view a specific variation for a page.

Note: To access the filter options in Mouseflow, click the 'Add Filter' button in the top-left hand side and then -> choose Variables -> select the appropriate experiment and value (either a variation name or * (for all variations to be combined)).

Setup

This detailed guide will walk you through the steps involved in integrating Mouseflow into Unbounce.

1. Choose a custom sub-domain for your Unbounce pages (e.g. unbounce.mydomain.com).

2. Create the necessary CNAME record(s), following these instructions.

3. Log in to your Unbounce account. From the Domains tab, click 'Add a Domain', and follow the on-screen prompts. It's important that the domain used to serve content from Unbounce is a subdomain of your primary website in Mouseflow. If not, you'll need to explicitly add the new domain (used for Unbounce) in Mouseflow under "Settings" > "Domains".

4. In Unbounce, create a new page. From the Pages tab, select the appropriate page. If you haven't already, click the 'Change URL' button and follow the on-screen prompts to activate your custom sub-domain.

5. Click "Edit" to modify the first-page variant, click "JavaScripts" (in the lower-left corner), click "Add Script to this Variant", change the Script Name to "Mouseflow", change the Placement to "Before Body End Tag", and paste your Mouseflow tracking code in the box (including the script tags). When you’re finished, click "Save Code" > "Save Changes"

The installed code should look like this:

<script type="text/javascript"> 
window._mfq = window._mfq || [];
(function() {
var mf = document.createElement("script"); mf.type = "text/javascript"; mf.defer = true;
mf.src = "//cdn.mouseflow.com/projects/your-website-id.js";
document.getElementsByTagName("head")[0].appendChild(mf);
})();
</script>


6. You should repeat the previous step for all other pages/variants, as needed.

7. From the Pages tab, select the page(s) you modified, and click "Publish Page".

8. The final step is to go to https://app.mouseflow.com/websites/settings/integrations and activating the Unbounce Integation (in the Marketing section).

Once this is done you’re all set! You should start to see data in your Mouseflow account shortly.

Did this answer your question?