Custom Conversion Tracking in WooCommerce

By Devin

If you integrate any third-party services with your WooCommerce site (for ads, analytics, marketing, drop shipping, or A/B testing), it’s often helpful or necessary to provide conversion data through javascript.

A lot of the big services, like Google Analytics (tutorial) or Facebook ads, have off-the-shelf extensions you can use. But for smaller services, you often have to write some custom code to send them the conversion information.

Generally the easiest way to do this is by using the woocommerce_thankyou hook. This action is only fired on the order confirmation page and also provides the $order_id variable, which gives access to all the order details.

Using the Hook

Basic Conversion Information

Here’s an example of how you might pass data like order id, order total, and customer e-mail to a third-party service using the woocommerce_thankyou hook:

https://gist.github.com/devinsays/3d8ccc69a1f433bc6f88

Product Conversion Information

Occasionally you might also want to send specific information about which products were purchased. That information is also available. If you’re outputting it into a javascript variable, it might look something like this:

https://gist.github.com/devinsays/d65db56ad333782e9424

Additional Information

Depending on the service you’re integrating with, you may also need to send address information, tax amounts, or coupon information. You can always look through the WooCommerce docs to figure out how to get this. A var_dump of $order can also be really helpful when looking for specific pieces of data.

Alternates to the Hook

I recently had a project where the conversion data needed to be output in the footer markup (using the wp_footer hook) rather than inline after the order markup, which is where the woocommerce_thankyou hook places it.

This was a bit tricker to implement since I didn’t have immediate access to the $order_id variable in wp_footer. I also now needed to add some conditional logic in order to display the script only on the thankyou page.

But, after a bit of digging I found a solution. To output the script only on the order confirmation page, I used the WooCommerce function is_order_received_page. And to get access to the order information, I used $wp->query_vars[‘order-received’].

Here’s what an example of this method looks like:

https://gist.github.com/devinsays/dfdddebda9d3108c0ba1

About Devin

I am a developer based in Austin, Texas. I run a little theme shop called DevPress and help manage a WooCommerce shop with Universal Yums. Find me on twitter @devinsays.

10 Responses

    1. Devin

      Looks great for inserting generic conversion code that just needs to be run on a specific template, but not for passing custom values like purchase amount or user ids.

  2. Beka

    Thanks for this :)

    I’d suggest one change: $order = new WC_Order( $order_id ); to $order = wc_get_order( $order_id ); so the order object has all order details, i.e., subscription meta, in case you need to check / include additional details in the conversion script.

  3. Jon

    That’s pretty useful information. I was not aware of the is_order_received_page function when I made my own solution back in January. (Maybe it wasn’t available then?)

    I used the woocommerce_thankyou hook to redirect to a specific thank you page and then checked for the right page ID in my wp_footer action. In my case, I was able to use global $order; to get the order object. Does this not work in your code as well?

    Another thing I noticed is that the call to $wp->query_vars[‘order-received’] on line 4 of wc-footer-conversion-tracking-example.php is redundant. This is already confirmed as part of is_order_received_page, so you should know that if that function returns true, which it would have to to get this far in the code, then this condition is already met.

    I almost forgot: The link to documentation on the woocommerce_thankyou hook in the third paragraph is broken.

    1. Devin

      Hi Jon. Thanks for the comments. It’s been a couple weeks since I implemented this code, so not sure if I checked if global $order was available. It is passed in the hook though, so it’s pretty safe to assume it will always be there. If someone else implements this and has an opinion, feel free to chime in.

      The call to $wp->query_vars[‘order-received’] is necessary as that supplies the order_id. I’m just doing a bit of data sanitization to make sure it is an integer before moving forward in the script. There could be rare cases where an order is deleted from the system or errors and that variable would not return an integer.

  4. Amit Sharma

    Hi,

    I’ve js tracking code from various affiliates and from past 2 weeks it has stopped logging sales in affiliates db, though the code has remained the same.
    I am using simple woocommerce thanks page hook with following code, any clues where I am going wrong or how to debug this to get the correct result?

    [redacted]

    Urgently need this help! Please

    Thanks
    Amit.

  5. Aaron Hanson

    Just wanted to say that the last alternate hook was EXACTLY what I needed. Was trying to integrate GrowSumo on my WooCommerce install and your code worked perfectly. So, thank you!

  6. Philip

    Great tutorial. I actually thought it would be really difficult to pull order details for then to insert them in custom tracking. You made it easy.
    Now I just need to learn how to do it this Google Tag Manager.

Leave a Reply