Liquid variables in custom pixel for Checkout Extensibility

Retired Boards Appdev Store Design
1

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)

2

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.

3

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