How to send conversion to Short.io

How to Send Conversions Using Short.io Conversion Tracking

If you're looking to track and attribute conversions to Short.io links, you can take advantage of Short.io’s Conversion Tracking feature. By following a few simple steps, you’ll be able to pass a clid parameter and send conversion data back to Short.io. Here’s how:


1. Enable Conversion Tracking

  1. Log in to your Short.io account and navigate to your project (branded domain).
  2. **Go to the “Domain Settings”
  3. Look for “Enable Conversion Tracking” and toggle it ON.

Once conversion tracking is enabled, Short.io will automatically append a special clid parameter to your link’s destination URL. For example, your destination link might look like:

https://your-destination.com/?clid=eyJpIjoiOUJwaU4tUUZqcUppelBLeXVWVVA5IiwiaCI6IiIsInAiOiIvc2hvcnRpbyIsInQiOjE3MzQxMDkzNzV9.B2nqhKIbaDqw7_BHV3_5mfsvoYnjyQtBPXm6PRRU0ys

This clid parameter is a unique identifier that allows Short.io to associate a click with a conversion.


2. Capture the clid Parameter

When users click your Short.io link and land on your website or landing page, you’ll see the clid parameter in the URL (e.g., via window.location.search in JavaScript or as a GET parameter in your server-side code).

Example of capturing the clid parameter in JavaScript:

function getQueryParam(param) {
  const queryString = window.location.search.substring(1);
  const params = queryString.split('&');
  for (let i = 0; i < params.length; i++) {
    const pair = params[i].split('=');
    if (pair[0] === param) {
      return decodeURIComponent(pair[1]);
    }
  }
  return null;
}

// Grab the clid parameter from the URL
const clid = getQueryParam('clid');

3. Send a Conversion Event

After capturing the clid, you can programmatically send a conversion event back to Short.io. You do this by calling:

navigator.sendBeacon(
  'https://<branded-domain-name>/.shortio/conversion?c=optional_conversion_id&clid=<captured_clid>'
);

Here’s a more concrete example that uses the clid parameter from the example above:

const clid = 'eyJpIjoiOUJwaU4tUUZqcUppelBLeXVWVVA5IiwiaCI6IiIsInAiOiIvc2hvcnRpbyIsInQiOjE3MzQxMDkzNzV9.B2nqhKIbaDqw7_BHV3_5mfsvoYnjyQtBPXm6PRRU0ys';

// Use the optional conversion ID ("c") to differentiate between conversion types, 
// such as 'signup', 'purchase', 'download', etc.
const conversionId = 'purchase';

// Build the conversion URL
const conversionURL = `https://<branded-domain-name>/.shortio/conversion?c=${conversionId}&clid=${clid}`;

// Send the conversion event
navigator.sendBeacon(conversionURL);

Where to Place the Code

  • On Form Submission: If you want to track successful form submissions, place this code after a successful form validation or server response.
  • On Button Click: If the conversion is triggered when users click a button, attach this code to your button’s click event.

Example for a button click:

<button id="conversionButton">Complete Purchase</button>

<script>
  document.getElementById('conversionButton').addEventListener('click', () => {
    const clid = getQueryParam('clid');
    const conversionURL = `https://<branded-domain-name>/.shortio/conversion?c=purchase&clid=${clid}`;
    navigator.sendBeacon(conversionURL);
  });
</script>

4. Verify Conversions in Short.io Analytics

Once you send the conversion events, you can check your Short.io analytics to see the conversions being counted. The data should appear under your link analytics or conversion tracking reports, allowing you to see the performance of each short link and attribute conversions accurately.


Tips & Best Practices

  • Optional Conversion ID: The c parameter (c=optional_conversion_id) is not required, but it’s useful to differentiate between multiple types of conversions on the same page or across your site.
  • Reliable Tracking: Using navigator.sendBeacon() is recommended for analytics calls because it’s designed for sending data asynchronously before the page unloads.
  • Data Security: Ensure you are only sending the relevant conversion data and clid parameter. Avoid sending any personally identifiable or sensitive information in the query string.

Conclusion

By enabling conversion tracking and utilizing the clid parameter that Short.io appends to your links, you can accurately attribute conversions back to specific short links. With just a small snippet of JavaScript (navigator.sendBeacon), you’ll have clear insights into which links are driving the most valuable user actions on your website.

Get started today by enabling Conversion Tracking in your Short.io dashboard, and gain deeper visibility into your marketing performance!