How to Integrate Ruler Analytics with Unbounce Landing Pages

Many people use landing pages for a specific campaign and it is just as important (if not more so) to track leads that call up or submit a form while on your landing page. 

Research suggests that landing pages can increase leads and return on spend from Paid Campaigns so it is important to ensure you are tracking your landing page call to actions, both forms and calls.

One of the most popular software’s for this purpose is Unbounce

Ruler Analytics can track leads that come from your Unbounce landing pages as well as your website. To track your Unbounce visits and form completions please follow the instructions below. 

Log in to your Unbounce account. 

 1. Go to the edit section of your campaign

2. Click on ‘Javascripts’

3. Add your Ruler Analytics Tracking Javascript to the footer of the website.
You can find this in your Ruler Analytics dashboard under site setup. 

Once the main Javascript is in place you can then go on to add the extra code needed to track your Form submissions from Unbounce.

3. Go to Javascripts. Add the script provided below and fill in your button id. (You can find this by going to your landing page and inspect element on the forms submit button. It will look something like this; 


Javascript template to add:

window.addEventListener('load',function(){ function RulerManualSubmitClickTracking() {
try {
if (!RulerAnalyticsVisitorId)
throw "Ruler Analytics is not set on the page";

var RulerAnalyticsPayload = {
action: "convert",
name: document.getElementById('FIELDIDHERE').value,
email: document.getElementById('FIELDIDHERE').value,
} catch (error) {

// Event Listener for clicks
document.getElementById('BUTTONIDHERE').addEventListener('click', RulerManualSubmitClickTracking);
//Event Listener for mobile touches
document.getElementById('BUTTONIDHERE').addEventListener('touchend', RulerManualSubmitClickTracking);

How to populate the script. 

Each form field will have an input id. You can find this by again inspecting the element of the field. It will look something like this; 

The id= needs to go into the corresponding field name. So for this example it would look like this name: document.getElementById('#full_name').value,

Please ensure the variable ids are identical to what is in place on the form and take note that It is case sensitive. 

Ensure all numbers on the landing pages are wrapped with your dedicated call tracking class name given during set up to allow for the dynamic number insertion. 

If you have any questions or need any assistance please get in touch.

Did this answer your question?