Add Google Analytics and Tag Manager codes

Setup Google Analytics 4 in Google Tag Manager

We recommend you control your Analytics and Third Party scripts within Google Tag Manager to give you enhanced control, flexibility and advanced configuration options when it comes to external scripts on your website.
You can find information about how to setup a GA4 tag in Google Tag Manager here: https://support.google.com/tagmanager/answer/9442095?hl=en

Adding Facebook Pixel in Google Tag Manager

You can find out more information on how to setup a Facebook Pixel tag in Google Tag Manager here: https://en-gb.facebook.com/business/help/1021909254506499

Tracking Google Analytics 4 Ecommerce Events in Google Tag Manager (additional setup)

If you are using the ecommerce event functionality within your KCW site, then you need to setup a GA4 event tag in Google Tag Manager to collect this data and pass it through from the website to your Analytics.
1. Create a new Tag Configuration within your container.
2. Name the tag something meaningful, such as "KCW - Ecommerce Event Capture".
3. For tag type, select Google Analytics: GA4 Event.
4. For Event Name use the built-in variable {{Event}}. This will use the GA4 ecommerce event names sent from your website via the gtag API.
5. Under More Settings > Ecommerce, check Send Ecommerce data.
6. For Data Source select Data Layer.
7. Now it's time to setup your Trigger, go ahead and click the Trigger section of your Tag to configure.
8. Add a New Trigger.
9. Name your Trigger something meaningful such as "KCW - Custom GTM Trigger".
10, Select your Trigger Type as Custom Event.
11. For Event Name, select the checkbox to use regex matching and add the following value "(?=purchase|item|cart|search|shipping|checkout|payment)"
Note: The above regex value will capture all events sent by KCW that contain the name "purchase" or "item" or "cart" etc. Each word is separated by a pipe "|"; If you want to avoid certain events, you can remove these words but keep in mind not to add spaces or double pipes "||".
12. Ensure All Custom Events  has been selected for the "Trigger Fire On" setting.
13. Save your new tag, preview your changes and publish when you are ready. 

You can find more information on the events here: https://developers.google.com/analytics/devguides/collection/ga4/ecommerce?client_type=gtag#select_an_item_from_a_list

Note: Currently KCW sends data for the following events, each event must be enabled within the CMS under the "KC:Web" > "Available Options" > "SEO and Cookies" tab.
- View items
- Purchases
- Search
- Add/remove products from cart
- Checkout process
- Apply promotions

There are a number of other settings in the "SEO and Cookies" tab to allow you to show a cookie consent banner, customise the text displayed on the banner, set whether certain tags require consent before firing, etc.
We recommend that you review your cookie consent settings to make sure that you are meeting all of the legal requirements for consent.

If you want to require consent for Google Analytics within Google Tag Manager you will need to log into the CMS and go to "KC:Web" -> "SEO and Cookies" tab, and make sure the "Require Consent for Google Tag Manager" is ticked.
This will then make use of the built-in consent types for GA tags called "ad_storage" and "analytics_storage", and will only allow the tag to fire if the customer consents via the cookie banner.

If you want to require consent before triggering the Facebook Pixel code then you can set this up within the tag options in Google Tag Manager.
When setting up or editing the Custom HTML tag you will need to click "Advanced Settings" > "Consent Settings".
You will then need to click the "Require additional consent for tag to fire" option, then click "Add required consent", and select/enter "analytics_storage":


This will then trigger the Facebook Pixel tag only after the user has consented to their analytics being stored.

Did you find this article helpful?