Liquid variables in custom pixel for Checkout Extensibility

Solved

Liquid variables in custom pixel for Checkout Extensibility

indextwo
Shopify Partner
14 1 5

We currently have some standard GTAG and GA4 JS to track conversions, defined under Settings->Checkout->Additional scripts. For example:

gtag('event', 'conversion', {
	'send_to': 'AW-1122334455/AABBCCDDEEFF',
	'value': {{ checkout.total_price | divided_by: 100.0 }},
	'currency': '{{ currency }}',
	'transaction_id': '{{ order_number }}',
});

We're currently looking to migrate to Checkout Extensibility for the 'Thank-you' & 'Order status' pages before the end of August. However, I can't find anything in any docs about using Liquid variables in custom pixels. Is it possible? And if not, is there an alternative method?

 

I can't find a single example that shows the details of the transaction being used in a custom pixel, as is common with conversion tracking for AdWords, Bing, GA4 etc. Any ideas? (This is for a Plus store, if that makes a difference)

n00b
Accepted Solution (1)

indextwo
Shopify Partner
14 1 5

This is an accepted solution.

Eventually I stumbled across a third-party blog where they linked to a shopify.dev page:

https://shopify.dev/docs/api/web-pixels-api/standard-events/checkout_completed

If you expand the `data (PixelEventsCheckoutCompletedData)` variable, it shows all the vars that are accessible by JS for Custom Pixels.

n00b

View solution in original post

Replies 2 (2)

indextwo
Shopify Partner
14 1 5

This is an accepted solution.

Eventually I stumbled across a third-party blog where they linked to a shopify.dev page:

https://shopify.dev/docs/api/web-pixels-api/standard-events/checkout_completed

If you expand the `data (PixelEventsCheckoutCompletedData)` variable, it shows all the vars that are accessible by JS for Custom Pixels.

n00b
Liam
Shopify Staff
2873 312 820

Glad you figured it out and thanks for posting your solution!

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog