TABLE OF CONTENTS
- About Google Analytics
- Set up GA4 property and set tracking in Google Tag Manager
- Set up cross-domain tracking for iframe in GA4
- GA4 e-commerce event snippets and how to access their data
- Set up GA4 ecommerce event tracking in Google Tag Manager
- NEW Enabling Google Analytics Measurement Protocol for purchase event
- NEW Implementing Server-side GTM
- Set up a referral exclusion list in GA4
- Send GA4 events to multiple Google Analytics properties
- Set up Facebook pixel tracking or other 3rd party services on Google Tag Manager
About Google Analytics
The IBIS E-Commerce platform supports Google Tag Manager - a system used to manage your own code snippets (known as tags) for conversion tracking, site analysis, remarketing, and many more. The biggest benefit of using Google Tag Manager is that it makes it easier for marketers to implement tags without having to rely on IBIS developers to do it for them. GTM features close integration with Google Analytics, and you can use the Tag Manager to configure and deploy your Google Analytics tag configurations easily.
Set up GA4 property and set tracking in Google Tag Manager
The screen recording below shows the GA4 set-up process on Google Tag Manager step-by-step.
Set up cross-domain tracking for iframe in GA4
You need the Editor privilege on your Google Analytics property to set up the following.
- Login to Google Analytics and select your GA4 property.
- Click the Admin button on the left, click the Data Streams in the Property column then select the Web Data Stream.
- Click More Tagging Settings option in the Additional Settings section.
- Click Configure your domains option.
- Click the Add condition button, list all your domains then Save.
GA4 e-commerce event snippets and how to access their data
You will see the following data in the below order for all GA4 events under items:
- item_id = Item PLU code
- quantity = Quantity of price option selected.
- item_name = Product Name
- item_brand = ""
- item_category = Booking, Retail, Membership etc
- item_variant = Price Option
- affiliation = "IBIS E-Commerce"
- price = Price
View Item
- Tag type: GA4 Event
- Event name: view_item
- Event parameters: items, value, currency
This event fires on page load on the following pages:
- Page: Appointments (/appointment/add)
- Page: Activity (/activity/add)
- Page: Transport (/transport/add)
- Page: Hire (/hire/add)
- Page: Package (/package/add)
- Page: Event (/event/add)
- Page: Gift voucher (/giftvoucher/add)
- Page: Membership (/membership/add)
- Page: Retail (/retail/add)
- Page: Admission (/admission/add)
DATA STRUCTURE
dataLayer.push({
event: "view_item",
ecommerce: {
currency: "NZD",
value: "100.00",
items: [
{
item_id: "1000",
quantity: 2
item_name: "Tourism Cruise",
item_brand: "",
coupon: "",
location_id: "Online"
item_category: "Booking",
item_category2: "",
item_category3: "",
item_category4: "",
item_category5: "",
item_list_id: "",
item_list_name: "",
item_variant: "Adult",
affiliation: "IBIS E-Commerce"
price: 100,
item_list_id: "",
item_list_name: "",
index: 1001,
},
{
item_id: "1000",
quantity: 1
item_name: "Tourism Cruise",
item_brand: "",
coupon: "",
location_id: "Online"
item_category: "Booking",
item_category2: "",
item_category3: "",
item_category4: "",
item_category5: "",
item_list_id: "",
item_list_name: "",
item_variant: "Child",
affiliation: "IBIS E-Commerce"
price: 50,
item_list_id: "",
item_list_name: "",
index: 1001
},
Add to Cart
- Tag type: GA4 Event
- Event name: add_to_cart
- Event parameter: items, value, currency
This event fires on page load on the cart page immediately after adding an item to the cart:
- Page: Cart (/cart)
dataLayer.push({
event: "add_to_cart",
ecommerce: {
currency: "NZD",
value: "201.00",
items: [
{
item_id: "1000",
item_name: "Tourism Cruise",
affiliation: "IBIS E-Commerce",
coupon: "",
currency: "",
discount: 0,
index: 1,
item_brand: "",
item_category: "Booking",
item_category2: "",
item_category3: "",
item_category4: "",
item_category5: "",
item_list_id: "",
item_list_name: "",
item_variant: "Adult",
location_id: "Online",
price: 100,
quantity: 2
},
{
item_id: "1000",
item_name: "Toursim Cruise",
affiliation: "IBIS E-Commerce",
coupon: "",
currency: "",
discount: 0,
index: 1,
item_brand: "",
item_category: "Booking",
item_category2: "",
item_category3: "",
item_category4: "",
item_category5: "",
item_list_id: "",
item_list_name: "",
item_variant: "Child",
location_id: "Online",
price: 50,
quantity: 1
}
]
},View Cart
- Tag type: GA4 Event
- Event name: view_cart
- Event parameters:
- currency
- value
- items
This event fires on page load on the cart page immediately after adding an item to the cart:
- Page: Cart (/cart)
dataLayer.push({
event: "view_cart",
ecommerce: {
currency: "NZD",
value: "202.39",
coupon: null,
payment_type: null,
tax: null,
shipping: null,
items: [
{
item_id: "1000",
item_name: "Tourism Cruise",
affiliation: "IBIS E-Commerce",
coupon: "",
currency: "",
discount: 0,
index: 1,
item_brand: "",
item_category: "Booking",
item_category2: "",
item_category3: "",
item_category4: "",
item_category5: "",
item_list_id: "",
item_list_name: "",
item_variant: "Adult",
location_id: "Online",
price: 100,
quantity: 2
},
{
item_id: "1000",
item_name: "Tourism Cruise",
affiliation: "IBIS E-Commerce",
coupon: "",
currency: "",
discount: 0,
index: 1,
item_brand: "",
item_category: "Booking",
item_category2: "",
item_category3: "",
item_category4: "",
item_category5: "",
item_list_id: "",
item_list_name: "",
item_variant: "Child",
location_id: "Online",
price: 50,
quantity: 1
},Remove from Cart
- Tag type: GA4 Event
- Event name: remove_from_cart
- Event parameter: items, value, currency
This event fires on page load on the cart page immediately after removing an item from the cart either by the "Remove item" or "Reset cart" button click:
- Page: Cart (/cart)
dataLayer.push({
event: "remove_from_cart",
ecommerce: {
currency: "NZD",
value: "175.00",
items: [
{
item_id: "1000",
item_name: "Toursim Cruise",
affiliation: "IBIS E-Commerce",
coupon: "",
currency: "",
discount: 0,
index: 1,
item_brand: "",
item_category: "Booking",
item_category2: "",
item_category3: "",
item_category4: "",
item_category5: "",
item_list_id: "",
item_list_name: "",
item_variant: "Adult",
location_id: "Online",
price: 100,
quantity: 1
},
{
item_id: "1000",
item_name: "Tourism Cruise",
affiliation: "IBIS E-Commerce",
coupon: "",
currency: "",
discount: 0,
index: 1,
item_brand: "",
item_category: "Booking",
item_category2: "",
item_category3: "",
item_category4: "",
item_category5: "",
item_list_id: "",
item_list_name: "",
item_variant: "Child",
location_id: "Online",
price: 75,
quantity: 1
}
]
},Begin Checkout
- Tag type: GA4 Event
- Event name: begin_checkout
- Event parameter: items
This event fires on page load on the "Your details" page:
- Page: Your details (/checkout/payforcart)
dataLayer.push({
event: "begin_checkout",
ecommerce: {
currency: "NZD",
value: "105.69",
coupon: null,
payment_type: null,
tax: null,
shipping: null,
items: [
{
item_id: "901",
item_name: "Online booking fee (0.69%)",
affiliation: "IBIS E-Commerce",
coupon: "",
currency: "",
discount: 0,
index: 2,
item_brand: "",
item_category: "Surcharge",
item_category2: "",
item_category3: "",
item_category4: "",
item_category5: "",
item_list_id: "",
item_list_name: "",
item_variant: null,
location_id: "Online",
price: 0.69,
quantity: 1
},
{
item_id: "996",
item_name: "Website postage PLU to New Zealand",
affiliation: "IBIS E-Commerce",
coupon: "",
currency: "",
discount: 0,
index: 1000,
item_brand: "",
item_category: "Postage",
item_category2: "",
item_category3: "",
item_category4: "",
item_category5: "",
item_list_id: "",
item_list_name: "",
item_variant: null,
location_id: "Online",
price: 5,
quantity: 1
},Add Payment Info
- Tag type: GA4 Event
- Event name: add_payment_info
- Event parameters:
- transaction_id
- value
- currency
- items
This event fires on page load on the payment page:
- Page: Your Payment Details (/paybypxpay)
dataLayer.push({
event: "add_payment_info",
ecommerce: {
currency: "NZD",
value: "201.38",
coupon: null,
payment_type: null,
tax: null,
shipping: null,
items: [
{
item_id: "1000",
item_name: "Single component",
affiliation: "IBIS E-Commerce",
coupon: "",
currency: "",
discount: 0,
index: 1,
item_brand: "",
item_category: "Booking",
item_category2: "",
item_category3: "",
item_category4: "",
item_category5: "",
item_list_id: "",
item_list_name: "",
item_variant: "Adult",
location_id: "Online",
price: 100,
quantity: 2
},
{
item_id: "901",
item_name: "Online booking fee (0.69%)",
affiliation: "IBIS E-Commerce",
coupon: "",
currency: "",
discount: 0,
index: 2,
item_brand: "",
item_category: "Surcharge",
item_category2: "",
item_category3: "",
item_category4: "",
item_category5: "",
item_list_id: "",
item_list_name: "",
item_variant: null,
location_id: "Online",
price: 1.38,
quantity: 1
}
]
},Purchase
- Tag type: GA4 Event
- Event name: purchase
- Event parameters:
- currency
- value
- transaction_id (Transaction ID = POS ID & Itinerary ID)
- coupon
- payment_type
- tax
- shipping
- items
This event fires on page load on the receipt page. This fires only once per transaction:
- Page: Confirmation (/receipt)
dataLayer.push({
event: "purchase",
ecommerce: {
currency: "NZD",
value: "100.69",
transaction_id: "xxxxx"
coupon: null,
payment_type: null,
tax: null,
shipping: null,
items: [
{
item_id: "1000",
item_name: "Tourism Cruise",
affiliation: "IBIS E-Commerce",
coupon: "",
currency: "",
discount: 0,
index: 1,
item_brand: "",
item_category: "Booking",
item_category2: "",
item_category3: "",
item_category4: "",
item_category5: "",
item_list_id: "",
item_list_name: "",
item_variant: "Adult",
location_id: "Online",
price: 100,
quantity: 1
},
{
item_id: "901",
item_name: "Online booking fee (0.69%)",
affiliation: "IBIS E-Commerce",
coupon: "",
currency: "",
discount: 0,
index: 2,
item_brand: "",
item_category: "Surcharge",
item_category2: "",
item_category3: "",
item_category4: "",
item_category5: "",
item_list_id: "",
item_list_name: "",
item_variant: null,
location_id: "Online",
price: 0.69,
quantity: 1
}
]
},You can access the data (the value object in ecommerce in the above example snippet) in Google Tag Manager in the following manner.
- Login to Google Tag Manager and select your container.
- Select Variables from the left-hand side menu, then click New in the User-Defined Variables section.
- Name this variable (for example "Ecommerce Purchase Value"), click the icon in the middle of the Variable Configuration section and select Data Layer Variable under Page Variables.
- Add ecommerce.value in the Data Layer Variable Name field then click Save.
- You can invoke this value object with the following syntax {{Ecommerce Purchase Value}}, like this snippet example below:
var $value = {{Ecommerce Purchase Value}};
console.log('Revenue: ' + $value);
Set up GA4 ecommerce event tracking in Google Tag Manager
The screen recording below shows how to set up GA4 ecommerce purchase event step-by-step.
Below screen recording shows how to set up additional GA4 ecommerce events (view_item, add_to_cart, view_cart, remove_from_cart, begin_checkout and add_payment_info)) step by step
NEW Enabling Google Analytics Measurement Protocol for purchase event
IBIS now supports Google Analytics (GA) Measurement Protocol (MP) for E-Commerce purchase events.
Background
Standard GA4 tracking is typically performed on the client-side, relying on the viewer’s device to send data to GA. However, due to increasing privacy concerns and countermeasures, acquiring accurate data through this method has become more challenging. The Measurement Protocol allows us to send event data directly from our server to GA servers, bypassing the client. This ensures highly precise data transmission.
How to enable Measurement Protocol
- Obtain GA4 Measurement ID
On GA property, navigate to Admin -> Data collection and modification -> Data streams. Click on the stream you wish to use. Measurement ID should be displayed in the next screen.
- Obtain MP API secrets
Locate the Measurement Protocol API secrets menu further down on the same screen. If this is your first time creating API secrets, you will need to review and acknowledge the terms. Click on the "Review terms" button and follow the instructions. Then, click the "Create" button. Assign a nickname to this API secret (e.g., IBIS E-Commerce) and click "Create." You will find the secret key value on the next screen.
- Set them on IBIS Server
Navigate to Setup -> Settings -> System settings -> E-Commerce Setup on the IBIS Server. Enter the measurement ID and secret key into the appropriate fields.
Disabling the standard purchase events
Once MP is enabled, you may wish to disable the standard purchase events to prevent data duplication. To do this, simply disable the purchase event tag in your Google Tag Manager.
Restrictions
This MP setting is currently configured on a per-system basis, meaning you can only specify a single Measurement ID. Support for multiple IDs — such as for different brands or business units — is not available.
NEW Implementing Server-side GTM
IBIS has extended support for GTM to its server-side variant. Server-side GTM implementation helps improve data quality and serves as an ideal alternative to standard (client-side) GTM. However, it comes with some caveats. It requires a high level of development to set up your own GTM container on your server, which involves costs for development and maintenance, a new sub-domain, and its own secure certificate.
Background
Server-side GTM is a way to manage and deploy tags on your website using a server-side container. Unlike standard client-side tagging, where tags run in the user's browser, server-side tagging processes the tags on a server that you control. Server-side GTM can also be configured to run on your own sub-domain instead of googletagmanager.com. Here are some key benefits and features:
- Improved Performance: By moving tag execution to the server, you can reduce the load on the user's browser, leading to faster page load times.
- Enhanced Security: Server-side tagging allows you to control and secure the data before it is sent to third-party services, reducing the risk of data leaks.
- Better Data Quality: Since the data is processed on your server, you can filter and clean it before sending it to analytics platforms, ensuring higher data accuracy. Additionally, hosting it on your own sub-domain treats it as a first-party application rather than a third-party one, reducing the risk of it being blocked.
- Privacy Compliance: It provides more control over user data, helping you comply with privacy regulations like GDPR and CCPA.
How to enable server-side GTM on IBIS E-Commerce
- Set values for server-side GTM head and body tags
Navigate to Setup -> Settings -> System settings -> E-Commerce Setup on the IBIS Server. Google Server-side GTM Snippet – Header setting takes the whole GTM snippet inside the <script></script>block and Google Server-side GTM Snippet – Body setting takes the value for the src attribute for the GA iframe inside the <noscript></noscript> block.
Disabling the standard/client-side GTM
Once the server-side GTM is enabled, you may wish to disable the client-side variant to avoid duplicate tagging. You can do so by simply removing the Google Tag Manager Container ID value in the setting.
Set up a referral exclusion list in GA4
You need the Editor privilege on your Google Analytics property to set up the following.
- Login to Google Analytics and select your GA4 property.
- Click the Admin button on the left, click the Data Streams in the Property column then select the Web Data Stream.
- Click More Tagging Settings option in the Additional Settings section.
- Click List unwanted referrals option.
- Click the Add condition button, list all the domains you want to exclude as traffic source then Save.
Since there's a limit of 50 conditions in the unwanted referrals list, we recommend having the following as "Referral domain contains" match type to exclude 3D secure providers as referrals.
Update the list when you find a new one in your Analytics report also.
3d
aasc.nz
acsweb-pa.dnp-cdms.jp
acs.
ansimclick.hyundaicard.com
arcot.com
authenticationweb
bankserv.co.za
betalen.rabobank.nl
cap.attempts.securecode.com
cardinalcommerce.com
cardsecurity
cmbchina.com
dkb.de
esecure
hdfcbank.com
hume.cardinalcommerce.com
hyundaicard.com
ibsbjstar.ccb.com.cn
lloydstsb.com
lottecard.co.kr
luottokunta.fi
mastercardsecurecode.sparkassen-kreditkarten.de
mycardsecure.com
portal.afterpay.com
ps4acs.netcetera-payment.ch
s3-us-west-2.amazonaws.com
sas.redsys.es
sec.paymentexpress.com
secure.barclaycard.co.uk
secureauthentication.apac.citibank.com
securecode.com
secureshopping
securesuite
site-auditor.online
swedbank.se
thecardservicesonline.com
thepaymentsplace.com.au
touchtechpayments.com
tsys.arcot.com
verifiedbyvisa
visa.com
windcave.com
wlp-acs.com
yalamanchili.in
demo-uat.ibisnz.com
Send GA4 events to multiple Google Analytics properties
If you have multiple IBIS E-Commerce websites under one IBIS system (i.e. multi-branding) and if you wish to send traffic and event data to separate Google Analytics properties, please see the screen recording below.
What's demonstrated in the below clip is to set up a general GA4 configuration for a specific URL (book.ibis.co.nz in this example). You set up the other GA4 ecommerce events in the same manner and repeat the process for the other IBIS E-Commerce websites you may have.
Set up Facebook pixel tracking or other 3rd party services on Google Tag Manager
Facebook Pixel, and any other third-party or custom services that work in a similar way, can be installed to your IBIS E-Commerce website via Google Tag Manager. Below are the steps for how to install Facebook Pixel, use this as an example if configuring other third-party services.
Step 1: Set the Facebook Pixel Base Code
- Login to Google Tag Manager and select your container.
- Select Tags from the left-hand side pane, then click New.
- Name the Tag (Facebook Pixel - Base Code in this example)
- Click the icon in the middle in the Tag Configuration section, then select Custom HTML from the right-hand side pane.
- Copy and paste the Facebook Pixel Base Code into the HTML field, then click and expand the Advanced Settings.
- From Advanced settings, select Once per page from the Tag firing options menu, then set All Pages as a trigger and Save your changes.
