Skip to main content
All CollectionsReferrals & TrackingReferral Tracking Setup
WooCommerce Referral Tracking Script Installation Instructions
WooCommerce Referral Tracking Script Installation Instructions
Marcella Edwards avatar
Written by Marcella Edwards
Updated over a week ago

When following these steps be sure to begin by referencing the instructions outlined in the main article.


Step 1. Add the Click Tracking Script

  1. Ensure you have admin access permissions within your WooCommerce account

  2. To add click tracking to your WooCommerce store in your Wordpress admin portal, navigate to Appearance > Theme Editor > header.php

  3. Follow the instructions on Step 2 in the main article to embed the tracking script just before the </head> tag in your HTML.

  4. Replace the ACCESS_TOKEN placeholder with your public access token created in Step 1 of the main article.


Step 2. Integrate Order Tracking on the Thank You page

You have 2 options to accomplish this. Whenever possible we recommend the first option below. (see this article for more details on the WC_Order object)

Option 1 (recommended): Include the order tracking script directly on ALL the "Thank You" page .php files you have.

  1. To track orders, copy the code snippet below . Edit file wp-content/plugins/woocommerce/templates/checkout/thankyou.php and place the code below line:

  2. Using a custom WooCommerce theme and the thankyou.php file is located there as well? You have to integrate the script there instead of the default one.

    1. Usually located here: /themes/your_custom_theme/woocommerce/checkout/thankyou.php

First, find this line of code in the thankyou.php page:

<?php do_action( 'woocommerce_thankyou', $order->get_id() ); ?>

Then, copy/paste the following script just below that line above and replace the ACCESS_TOKEN placeholder with your public access token.

<!-- Roster Order Submission: START -->
<script type='application/javascript'>
function submitOrder() {
if (sAttribution) {
var totalPrice = <?php echo $order->get_subtotal(); ?>;
var discount_total = <?php echo $order->get_total_discount(); ?> ?? 0;
var subTotal = totalPrice - discount_total;

sAttribution.set({
orderId: "<?php echo $order->get_id(); ?>",
orderDate: "<?php echo $order->get_date_created(); ?>",
discountCodes: <?php echo json_encode($order->get_coupon_codes()); ?>,
currency: "<?php echo $order->get_currency(); ?>",
subtotalPrice: subTotal,
totalPrice: <?php echo $order->get_total(); ?>,
firstName: "<?php echo $order->get_billing_first_name(); ?>",
lastName: "<?php echo $order->get_billing_last_name(); ?>",
email: "<?php echo $order->get_billing_email(); ?>"
});
sAttribution.emitOrder();
}
}
var saScript = document.createElement("script");
saScript.addEventListener("load", submitOrder);
saScript.src = "https://sa.getroster.com/sa.js?token=ACCESS_TOKEN";
document.body.appendChild(saScript);
</script>
<!-- Roster Order Submission: END -->

Option 2: Include the order tracking script in the functions.php file.

  1. Navigate to Appearance > Theme Editor > functions.php

    1. See this Wordpress article to learn more about the scripts/hooks used in the functions.php code

  2. Important: if you are using a custom theme, in the dropdown labeled "Select theme to edit" make sure you have your custom theme selected. You likely don't want to edit the primary theme's code.

  3. Safety first: copy the code that is currently in functions.php and save it somewhere on your computer in case you accidentally break something and need to revert the code.

  4. The code: copy/paste the code snippet below at the end of the functions.php file. Replace the ACCESS_TOKEN placeholder with your public access token.

  5. Finally, don't forget to click "Update File" to save your changes

/**
* Add Roster analytics code to the thank-you page
* Ref: https://docs.woocommerce.com/wc-apidocs/class-WC_Order.html
*/
add_action( 'woocommerce_thankyou', 'roster_attribution' );

function roster_attribution( $order_id ) {
$order = wc_get_order( $order_id );

if ( $order ) {
$usedCoupons = json_encode($order->get_used_coupons());

echo "<!-- Roster Order Submission: START -->
<script type='application/javascript'>
function submitOrder() {
if (sAttribution) {
var totalPrice = {$order->get_subtotal()};
var discount_total = {$order->get_total_discount()} ?? 0;
var subTotal = totalPrice - discount_total;

sAttribution.set({
orderId: \"{$order_id}\",
orderDate: \"{$order->get_date_created()}\",
discountCodes: {$usedCoupons},
currency: \"{$order->get_currency()}\",
subtotalPrice: subTotal,
totalPrice: {$order->get_total()},
firstName: \"{$order->get_billing_first_name()}\",
lastName: \"{$order->get_billing_last_name()}\",
email: \"{$order->get_billing_email()}\"
});

sAttribution.emitOrder();
}
}

var saScript = document.createElement(\"script\");
saScript.addEventListener(\"load\", submitOrder);
saScript.src = \"https://sa.getroster.com/sa.js?token=ACCESS_TOKEN\";
document.body.appendChild(saScript );
</script>
<!-- Roster Order Submission: END -->";
}
}

This is what the end result should look like:


Testing

Reference Step 4 in the main article to make sure you have everything setup.


Congrats, You're Done!!

You're all set up and your WooCommerce store is now able to track referral links and discount codes within Roster.


Troubleshooting Tips

Are you using a 3rd party plugin for your checkout flow?

  • The "XL Plugin" is an example where additional work is needed to get the tracking script fully integrated properly. See their help article for more details.

Did this answer your question?