(A) Embed an XPO Remarketing pixel
- Log into your Shopify Store Account and click on Online Store.
- From your live theme, click Actions > Edit Code.
- Click on Theme.Liquid. This is where you will place the XPO remarketing pixel into.
- The remarketing pixel will now be added to your shopify live site theme.
- To use different parameters, you will need to change your code/script with the correct variables. For instance, if you want to include v1=%%PAGE_TYPE%% into your script, you will need to replace %%PAGE_TYPE%% with the actual value.
(B) Embed XPO conversion pixel
- Log into your Shopify Store Account . From your Home page, go to Settings.
- Select Checkout to customize your conversion pixels.
- Scroll down to Additional scripts. This is where you will place the XPO conversion pixel script/code.
- Once you have included the script/code, replace the necessary variables such as currency, value, product ID, page URL, order number/ID, etc. with your desired corresponding values.
The pixel code placed under these Additional scripts will only be applied to the Thank You page only. All other conversion pixels should be included in the theme.liquid (or other liquid themes such as cart.liquid; customers/account.liquid, etc.). The corresponding conditions such as cart/product URL must be added to these scripts.
- Once you have included the script/code, replace the necessary variables such as currency, value, product ID, page URL, order number/ID, etc. with your desired corresponding values.
YOU MAY WANT TO DO THIS:
Since this script is fired every time a Thank you page is loaded (e.g. when a customer re-visits the page to check his/her order status multiple times), you will need to add the below codes to your script to prevent duplicate records of multiple conversion events.
{% if first_time_accessed %}
Insert the conversion pixel(s) that you only want to fire during the first visit.
{% endif %}
How Do I Embed Google Tag Manager (GTM) Pixel on Shopify?
- Log in to your Shopify Store Account , and go to Settings.
- Select Online Store > Themes, and from the Actions dropdown click Edit Code.
- Click on theme.liquid.
Once you have your GTM code, enter it into the script below and click Save.
- To allow GTM to read and process your Purchase (checkout) data you will need to copy the script below and paste it into your Checkout page under Additional Scripts. Then, click Save.
The code includes the following variables: page type, currency, shipping price, total price, tax price, payment type and transaction ID.
{% if first_time_accessed %}
<script>
window.dataLayer = window.dataLayer || [];
var shipping_price = '{{shipping_price | money_without_currency }}';
shipping_price = shipping_price.replace(",", ".");
var total_price = '{{total_price | money_without_currency }}';
total_price = total_price.replace(",", ".");
var tax_price = '{{tax_price | money_without_currency }}';
tax_price = tax_price.replace(",", ".");
window.dataLayer.push({
'page_type': 'purchase',
'event': 'analyzify_purchase',
'currency': "{{ shop.currency }}",
'totalValue': total_price,
'shipping': shipping_price,
'tax': tax_price,
'payment_type': '{{order.transactions[0].gateway}}',
'transaction_id': "{{order.name}}",
});
</script>
{% endif %}
- Once you have completed the above steps, go to your Google Tag Manager and learn how to embed XPO Tag Via Google Tag Manager (GTM).
Comments
0 comments
Article is closed for comments.