Self-Managed Conversion Tracking Setup

This guide will walk you through how to set up self-managed conversion tracking. Before proceeding, read our comprehensive guide on conversion tracking set up. Doing so will ensure you understand the terminology, limitations, prerequisites, alternative methods, testing, troubleshooting, and additional resources available to you.

We’ve written this for an audience comfortable with working in HTML and JavaScript. This can be more challenging than integrating with Google Tag Manager and Parse.ly-managed conversions. However, self-managed conversions are a great option for teams with available technical resources. Even if you are self-managing, we still encourage you to contact Support with any questions.

By the end of this guide you should have the ability to set up self-managed conversion tracking with a label, type, and proper targeting.

Self-Managed Conversion Tracking Set Up Overview

In Parse.ly, tracking conversions involves sending a specific type of event along with a descriptive label. This process allows you to categorize and identify different user actions on your site, such as subscribing to a service, signing up for a newsletter, or making a purchase. Understanding how to send these conversion events is key to effectively leveraging Parse.ly’s analytics capabilities.

How to Send a Conversion Event:

1. Identify the User Action: Determine the user action on your site that you want to track as a conversion. This could be a form submission, a button click, or any other significant interaction.
2. Choose a Descriptive Label: Along with the conversion event, you will send a label that describes the action. This label helps categorize the event and makes it easier to identify and analyze in your Parse.ly dashboard. For example, labels could be ‘Newsletter Signup’, ‘Product Purchase’, or ‘Subscription Activation’.
3. Implement the Tracking Code: Use Parse.ly’s conversion tracking functions to send the event and label. Depending on the type of conversion, you might use one of these functions: trackLeadCapture, trackLinkClick, trackNewsletterSignup, trackPurchase, or trackSubscription. We call these functions in response to the user action (like form submission or button click) and send the event data to Parse.ly.

Important Considerations for Conversion Tracking

When implementing self-managed conversion tracking in Parse.ly, it’s essential to understand a few key aspects to ensure accurate data. Let’s cover these aspects before reviewing detailed sample implementations.

Consistency in Labeling:

When sending conversion events, use static, descriptive labels for each event type. For example, a label like ‘Demo Request’ clearly indicates the nature of the conversion. Avoid using dynamic labels that change with each event, as this can lead to fragmented data and make it difficult to aggregate and analyze conversion metrics effectively.

Availability of Tracking Functions:

The PARSELY.conversions.<track functions> are available only after the Parse.ly tracker code has fully loaded on your page. It’s crucial to ensure that you call these functions after the tracker is operational to avoid any tracking issues.

Handling Early Conversion Events:

Since conversion events might occur before the Parse.ly tracker has finished loading, we recommend using a wrapper function to handle these early events. This approach ensures that you capture conversion events regardless of the timing of the tracker’s load.

Example of Handling Early Conversion Events:

// Make a queue for conversion events
var parselyConversionEventQueue = [];

// Wrapper function to safely handle conversion events
function captureParselyLeadConversion(label) {
  if (window.PARSELY && window.PARSELY.loaded) {
    window.PARSELY.conversions.trackLeadCapture(label);
  } else {
    parselyConversionEventQueue.push(label);
  }
}

// Example usage of the wrapper function
captureParselyLeadConversion('Demo Request');

// Ensure the Parse.ly tracker code is loaded before processing the queue
window.PARSELY = window.PARSELY || {};
window.PARSELY.onload = function() {
  parselyConversionEventQueue.forEach(function(label) {
    window.PARSELY.conversions.trackLeadCapture(label);
  });
  // Clear the queue after processing to prevent duplicate tracking
  parselyConversionEventQueue = [];
};

// Insert the Parse.ly tracker code here...

Sample Implementations

The following implementations assume that you’ve already installed the Parse.ly tracking code on all pages of your site. You’ll need this for every url where the conversion occurs as well as all of the urls that could possibly lead to the conversion (for proper attribution). We will cover all five functions available to you in self-managed conversion tracking.

Implementing a Lead Capture Conversion

Lead Capture conversions are useful to track when users provide their contact information, typically through a form on your website. This could be for purposes like signing up for a newsletter, requesting a demo, or downloading a resource. Here’s how you can set up a Lead Capture conversion using a self-managed approach in Parse.ly:

1. Identify the Form to Track

First, identify the form on your website that you want to track. For example, let’s say you have a form for newsletter sign-ups. The form might look something like this in your HTML:

<form id="demo-request-form">
  <input type="email" name="email" placeholder="Enter your email">
  <button type="submit">Request a demo</button>
</form>

2. Add the Parse.ly Conversion Tracking Code

Next, you’ll need to add the Parse.ly conversion tracking code to your website. Place this code snippet such that it runs when the user submits the form. The code will use the PARSELY.conversions.trackLeadCapture function to send conversion data to Parse.ly’s servers when the form is submitted.

// Listen for submit events on a form to indicate a lead capture
var form = document.getElementById('demo-request-form');
form.addEventListener('submit', function() {
  // Track the lead capture event with Parse.ly
  if (window.PARSELY) {
    window.PARSELY.conversions.trackLeadCapture('Demo Request');
  }
}, false);

In this code:

1. We first wait for the DOM to load completely.
2. We then select the form by its ID.
3. We add a submit event listener to the form.
4. We then call PARSELY.conversions.trackLeadCapture with a descriptive label, such as ‘Demo Request’.

Implementing a Link Click Conversion

Link Click conversions track when users click on specific links on your website. These could be affiliate links, external links to partner sites, or any other links where you want to track user engagement. Here’s how you can set up a Link Click conversion in Parse.ly:

1. Identify the Link to Track

First, identify the link you want to track. For example, let’s say you want to track clicks on an affiliate link to an external product page. The link might look something like this in your HTML:

<a href="https://affiliate.example.com/product" class="affiliate-link">Check out this product</a>

2. Add the Parse.ly Conversion Tracking Code

Next, you’ll need to add the Parse.ly conversion tracking code to your website. Place this code snippet in the relevant page where the link exists. The code will use the PARSELY.conversions.trackLinkClick function to send conversion data to Parse.ly’s servers when the link is clicked.

document.addEventListener('DOMContentLoaded', function() {
  var affiliateLinks = document.querySelectorAll('.affiliate-link');
  affiliateLinks.forEach(function(link) {
    link.addEventListener('click', function() {
      if (window.PARSELY) {
        window.PARSELY.conversions.trackLinkClick('Affiliate Link Click - Product');
      }
    });
  });
});

In this code:

1. We first wait for the DOM to load completely.
2. We then select all elements with the class affiliate-link.
3. For each link, we add a click event listener.
4. When the link is clicked, we call PARSELY.conversions.trackLinkClick with a descriptive label, such as ‘Affiliate Link Click – Product’.

Implementing a Newsletter Signup Conversion

Newsletter Signup conversions are crucial for tracking user engagement and interest in your content. This type of conversion is helpful to monitor when users sign up for your newsletters through a form on your website. Here’s how you can set up a Newsletter Signup conversion using a self-managed approach in Parse.ly:

1. Identify the Newsletter Signup Form

Locate the form on your website used for newsletter signups. For instance, you might have a form like this in your HTML:

<form id="newsletter-signup-form">
  <input type="email" name="email" placeholder="Enter your email">
  <button type="submit">Subscribe</button>
</form>

2. Add the Parse.ly Conversion Tracking Code

Implement the Parse.ly conversion tracking code on your website where the newsletter signup form is located. This code will use the PARSELY.conversions.trackNewsletterSignup function to send conversion data to Parse.ly when the form is submitted.

document.addEventListener('DOMContentLoaded', function() {
  var newsletterForm = document.getElementById('newsletter-signup-form');
  newsletterForm.addEventListener('submit', function() {
    // Track the newsletter signup event with Parse.ly
    if (window.PARSELY) {
      window.PARSELY.conversions.trackNewsletterSignup('Newsletter Signup - Main Page');
    }
  }, false);
});

In this code:

1. We ensure the DOM is ready before attaching the event listener.
2. We select the newsletter signup form by its ID.
3. We add a submit event listener to the form.
4. When the form is submitted, we call PARSELY.conversions.trackNewsletterSignup with a descriptive label, such as ‘Newsletter Signup – Main Page’.

Implementing a Purchase Conversion

Purchase conversions are essential for tracking when users complete a one-time purchase of a product on your site. This conversion is crucial for e-commerce platforms and online stores. Here’s the setup process:

1. Identify the Purchase Form or Button

Find the form or button on your website that users use to make a purchase. For a simple purchase button, your HTML might be:

<button id="purchase-button" data-product-id="123">Buy Now</button>

2. Add the Parse.ly Conversion Tracking Code

Add the Parse.ly tracking code to the page with the purchase button. Use the PARSELY.conversions.trackPurchase function to track the purchase event.

document.addEventListener('DOMContentLoaded', function() {
  var purchaseButton = document.getElementById('purchase-button');
  purchaseButton.addEventListener('click', function() {
    var productId = this.getAttribute('data-product-id');
    if (window.PARSELY) {
      window.PARSELY.conversions.trackPurchase('Product Purchase - ' + productId);
    }
  }, false);
});

1. This code attaches a click event listener to the purchase button.
2. When the button is clicked, the trackPurchase function is called with a label that includes the product ID, like ‘Product Purchase – 123’.

Implementing a Subscription Conversion

Subscription conversions are key for tracking when users subscribe to your services, such as a monthly magazine or a premium content platform. This conversion helps you understand the effectiveness of your subscription model. Here’s how to set it up:

1. Identify the Subscription Form

Locate the form on your website where users sign up for a subscription. Your form might look like this:

<form id="subscription-form">
  <input type="text" name="username" placeholder="Username">
  <input type="email" name="email" placeholder="Email">
  <button type="submit">Subscribe Now</button>
</form>

2. Add the Parse.ly Conversion Tracking Code

Implement the Parse.ly tracking code on your website where the subscription form is located. Use the PARSELY.conversions.trackSubscription function to send data when the form is submitted.

document.addEventListener('DOMContentLoaded', function() {
  var subscriptionForm = document.getElementById('subscription-form');
  subscriptionForm.addEventListener('submit', function() {
    if (window.PARSELY) {
      window.PARSELY.conversions.trackSubscription('User Subscription');
    }
  }, false);
});

1. This code selects the subscription form by its ID and adds a submit event listener.
2. When the form is submitted, the trackSubscription function is called with a label like ‘User Subscription’.

Handling Conversions in iframes

Tracking conversions within iframes presents unique challenges due to the isolated nature of iframes in the web environment. However, it is possible to track conversions occurring in iframes if you’ve correctly implemented the Parse.ly tracker within them. Here’s how to set this up:

Implementing the Tracker in an Iframe:

1. Add the Parse.ly Tracker Script: Include the Parse.ly tracker script within the HTML content of the iframe. This is similar to how you would include the tracker on a regular webpage.
2. Configure the Tracker for Manual Tracking: In the iframe’s script, configure the Parse.ly tracker for manual tracking by setting autotrack to false. This gives you control over the events you want to track.
3. Add Event Listeners or Custom Logic: Use the onload function to add any event listeners or custom logic needed for tracking conversions within the iframe.

<script>
  window.PARSELY = window.PARSELY || {
    autotrack: false,
    onload: function() {
      // Add event listeners or other logic for tracking conversions
      // Example: Track a button click within the iframe
      var button = document.getElementById('conversion-button');
      button.addEventListener('click', function() {
        // Track the conversion event
        if (window.PARSELY) {
          window.PARSELY.conversions.trackPurchase('Product Purchase');
        }
      });
    }
  };
</script>
<!-- START Parse.ly Include -->
<!-- Include the Parse.ly tracker script as you would on a regular page -->
<!-- END Parse.ly Include -->

Testing and Troubleshooting

Now that you’ve setup self-managed conversion tracking, it’s time to test all of it. Please see the Testing and Troubleshooting section of our comprehensive guide.

If you need technical assistance, contact Support.

Using your data

Once you’ve confirmed that the tracking is working correctly, you can start monitoring your conversions data in your Parse.ly dashboard.

Analyze the data to gain insights into user behavior and the effectiveness of your conversions. To learn more about how to do this, see our Conversions Feature Guide. For personalized assistance with planning, strategy, and insights, contact your Relationship Manager.