DTC Guide to

Tagging & Analytics

May 2020
9/11/2020
What Analytics Should my DTC Store have?
Every DTC store should have the following enabled:
• Ecommerce enabled in GA
• Enhanced Ecommerce enabled in GA and implemented on the website
• Advanced global tag container implemented on the website
• The following global goals enabled in GA and implemented on the website
• Goal 1 Acquisition Complete
• Goal 2 Add to Cart Intent
• Goal 5 Purchase Intent
• Goal 6 Purchase Complete
• Goal 10: Submit Review
• Goal 13 Viewed a Product Page
• The following standard events must implemented on your website for Enhanced Ecommerce:
• Event_buy_now_add_to_cart (goal 2)
• Event_buy_now_choose_product
• Event_remove_from_cart
• Event_checkout_now
What Analytics Should my DTC Store have? (Continued)
• The following standard events must be implemented:
• Event_coupon_redemption
• The following standard events should also be implemented if applicable to your website:
• Event_gift_certificate_redemption
• Event_product_consultation_reco
• Event_reward_submit_codes
• Event_plan_frequency
• Event_coupon_request
Global Tagging
Solution Overview
Global Tagging Architecture

Global Tag Container

P&G Global Tag Containers allow us to bring core tracking capabilities
to all P&G consumer websites, regardless of platform, at scale
and in a standard + compliant way.

Local Containers
Olay Swiffer PGEveryDay CrestWhiteSmile Align Enable management of tags to meet individual
tracking requirements of each website
Global Tagging Architecture
• P&G uses Google Tag Manager (GTM 360) as our tag management platform
• P&G has built a global solution used across all consumer-facing websites
• Our GTM architecture consist of two types of containers: a global container and a local container
• Every consumer-facing website should have a global container implemented
• Local containers are optional and used for additional tagging needs
• There are two global containers to choose from: Basic or Advanced
Global vs. Local 
Global Container
• The global containers are used across all consumer-facing websites
• The global container deploys all core tracking tags that are commonly used across consumer-facing
websites
• It also deploys P&G's data privacy solution to be compliant with data privacy laws like GDPR &
CCPA
Local Container
• This is used to deploy any additional tags needed on your individual website that is not deployed via
the global container
• The local container is implemented via the PGdataLayer.GTM object using the SiteLocalContainer
attribute
PGdataLayer vs. dataLayer
DataLayer
• JavaScript object used to store information you pass to it from the website
• This information can then be used to populate variables and configure triggers in your tags in GTM

PGdataLayer
• Custom defined on-page JSON object used to provide data for GTM tags
• The PGdataLayer has over 100 standardized variables and parameters defined by the central Web
Analytics (Please see PGdataLayer Specification spreadsheet in appendix for more info)
• PGdataLayer.GTM is the object used to tell the Global containers how/if tags should fire
• The PGdataLayer is also leveraged by local tags (ex: Retention Science)
PGdataLayer.GTM Object
<!-- BEGIN PGdataLayer -->
<script type="text/javascript"> • PGdataLayer.GTM object must be placed on all
if(typeof PGdataLayer == "undefined"){
var PGdataLayer = {};
pages
}
PGdataLayer.GTM ={
• Each setting within the PgdataLayer.GTM object
'SiteBrand': 'Olay', must be updated to reflect your website
'SiteCountry': 'US',
'SiteEnvironment': 'Prod', • Some settings are informational, while other
'SiteHost': 'BigCommerce',
'SiteTechnicalAgency': 'MindTree', settings will enable tags within the global container
'SiteLocalContainer': 'GTM-ABC123',
'GoogleAnalyticsLocal': 'UA-111111-1', • See appendix for a full list of PGdataLayer
'GoogleAnalyticsAllowLinker': '', settings/attributes
'GoogleAnalyticsLinkerDomains': '',
'ConsentOverlay': 'OneTrust',
'ConsentOverlayID': '12345678912345',
• SiteLocalContainer: used to enable your website's
'SitePrivacyProtection': 'CCPA', local GTM container
'GoogleReCaptcha': 'false',
'FacebookRemarketingID': '123456789012345', • If you don't have a local GTM container, leave this
'FacebookConnectAppID': '', value blank
'FacebookConnectLocale': '',
'GoogleAnalyticsDisabled': '',
'Segment': 'A1b2C3d4E5f6G7h8I9j0x',
• GoogleAnalyticsLocal: used to enable Google
'Lytics': 'T1u2V3w4X5y6Z7a8B9c0', Analytics, and sends data to the correct property by
'Monetate':
'//se.monetate.net/js/2/a-6eac1087/p/widgets.com/entry.js' specifying your UA tracking ID
}
</script>
<!-- END PGdataLayer -->
Global Advanced Container Configuration

<!-- Google Tag Manager -->

<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-N94XXFB');</script>
<!-- End Google Tag Manager -->

<!-- Google Tag Manager (noscript) -->

<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-N94XXFB"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
BigCommerce Implementation

• BigCommerce is not on
P&G's standard hosting
• The global container needs
to manually inserted
• Examples of standard
platforms using P&G's
standard hosting:
• Brand.com
• Multibrand
• ModernWeb

Choose the “Manually add Google Analytics tracking Code” option under
the Google Analytics tab
BigCommerce Implementation
• Insert the PGdataLayer script on slide 3 and the Advanced container on slide 4 into
BigCommerce in the Advanced Settings area under the Web Analytics section

• If site has ecommerce, use the standard ecommerce script on slide 7 or enhanced
ecommerce implementation on slides (x-x)

• Note: if you're implementing Enhanced Ecommerce, do not implement the standard

ecommerce script
Standard vs Enhanced Ecommerce
Standard
• Tracks transactions on the order Confirmation Page/ Thank-You page only

Enhanced
• Track your consumer's entire journey throughout the site
• Track data on:
• Adding products to cart
• Payment method
• Shipment details
• Order review
• Checkout
• EE allows you to see funnels and build audiences off this data

Enhanced Ecommerce article by Google

BigCommerce Standard Ecommerce
<!-- BC Purchase -->
<script type="text/javascript">
window.dataLayer = window.dataLayer||[];
function trackBCecommerce() {
this._addTrans = addTrans;
• IMPORTANT: This section is intended for
this._addItem = addItems;
this._trackTrans = trackTrans;
BigCommerce standard ecommerce
} integration ONLY, not enhanced ecommerce
var transaction = {};
transaction.transactionProducts = [];
function addTrans(orderID, store, total, tax, shipping, city, state, country)
{ • The standard ecommerce script is only used
transaction.transactionId = orderID;
transaction.transactionAffiliation = store; for BigCommerce and used to expose bigc
transaction.transactionTotal = total;
transaction.transactionTax = tax; variables to GTM dataLayer for use in
transaction.transactionShipping = shipping;
} ecommerce tracking
function addItems(orderID, sku, product, variation, price, quantity) {
transaction.transactionProducts.push({
'id': orderID,
'sku': sku, • Insert this script immediately after the
'name': product,
'category': variation, PGdataLayer script in BigC
'price': price,
'quantity': quantity
});
}
function trackTrans() {
transaction.event = 'BCtransactionComplete';
dataLayer.push(transaction);
}
var pageTracker = new trackBCecommerce();
</script>
<!-- End BC Purchase -->
Ecommerce
Implementation
Enhanced Ecommerce Overview
• Enable Enhanced Ecommerce in your GA view settings
• The central Web Analytics operations team can do this, please submit a ticket via
dpops.pg.com 🡪 Web Analytics
• Populate the PGdataLayer.GTM object and global container tracking code on all pages
• The following standard events must be implemented:
• Event_buy_now_add_to_cart
• Event_buy_now_choose_product
• Event_remove_from_cart
• Event_checkout_now
• Populate the PGdataLayer.ecomm object settings on your PDPs, checkout page, order
complete page, and product category pages
• The PGdataLayer.ecomm.transaction object should be populated on order complete
pages
Standard Events
• The following standard events send ecommerce hits to GA when implemented with
P&G's standard solution:
Standard Event Ecommerce Action

Event_buy_now_add_to_cart Add

Event_buy_now_choose_product Click

Event_remove_from_cart Remove

Event_checkout_now Checkout

• These events should be implement via the CSS class or PGdataLayer.events object
(please see event tracking guide in appendix for more details)

• By implementing these events in combination with the PGdataLayer.ecomm object, the

global solution will recognize this as enhanced ecommerce and automatically send the
ecommerce hits or actions to GA
Enhanced Ecommerce Object settings
The following object settings are used for enhanced ecommerce (EE):
• PGdataLayer.ecomm.step
• PGdataLayer.ecomm.options
• PGdataLayer.ecomm.products[]
• PGdataLayer.ecomm.transaction
• PGdataLayer.ecomm.promo

These values are included in EE hits sent to GA and other tags

EE Step & Options Settings
PGdataLayer.ecomm.step
• Must be set on checkout process pages to correspond with step number in the checkout funnel (ex. 1)
PGdataLayer.ecomm.options
• This can be set on checkout process pages to provide additional information (ex. Visa)

Example Code
PGdataLayer.ecomm ={
'step': '2',
'options': 'Visa'
}
EE Products Object Array Settings
Example Code
PGdataLayer.ecomm ={
'step': '',
PGdataLayer.ecomm.products[]
'options': '',
'products':[{ • PGdataLayer.ecomm.products must be updated to include
"sku": "SK2-HR-FT-ESS",
"name":"SK-II Facial Treatment Essence",
information on all products displayed on a page
"brand":"SK-II",
"category":"our-products", • PGdataLayer.ecomm.products must be updated on an order
"position": "1",
"quantity": "1", confirmation page to include information on all products
"price" : "229.0",
"product_coupon": "",
purchased on the order
"product_coupon_value": "",
"recurrence": "", • See appendix for full list of ecomm.products settings in the
"listtype":"best-sellers",
"variant_sku" : "",
PGdataLayer Specification link
"product_discount_value" : "",
"product_discount" : "",
"bundle_products" : "",
"frequency" : ""},{ Where do I populate this code?
"sku": "SK2-HR-FT-MASK",
"name":"SK-II Facial Treatment Mask",
"brand":"SK-II",
• The products array should be populated on any page with
"category":"product-forms-masks", products, this includes PDPs, product category pages,
"position": "2",
"quantity": "1", checkout pages, reccommended items list, wish lists, etc.
"price" : "95.0",
"product_coupon": "",
"product_coupon_value": "",
"recurrence": "",
"listtype":"best-sellers",
"variant_sku" : "",
"product_discount_value" : "",
"product_discount" : "",
"bundle_products" : "",
"frequency" : ""}]
EE Transaction Object Settings
Transaction Object Settings:
• PGdataLayer.ecomm.transaction.id
• PGdataLayer.ecomm.transaction.store
• PGdataLayer.ecomm.transaction.revenue Example Code
• PGdataLayer.ecomm.transaction.tax PGdataLayer.ecomm ={
'transaction': {
• PGdataLayer.ecomm.transaction.shipping 'id': '827123',
'store': 'ACME Store3',
Where do I populate this code? 'revenue': '101.99',
'tax': '8.99',
• The transaction object must be updated on the website order
'shipping': '19.00',
confirmation page/ checkout complete page
'shipping_option': 'ground',
• The transaction.id must be set to the order number 'order_coupon': '',
• The transaction.revenue must be set to the order total amount 'order_couponprice': '0'
(including tax + shipping) }}
• See appendix for full list of PGdataLayer.ecomm.transation settings in
the PGdataLayer Specification link
Enhanced Ecommerce
Implementation
Examples & Testing
How do I test my EE Implementation?
• Please install the GA Debugger Chrome plugin, link can be found here
• This plugin will provide a detailed breakdown of each tracking beacon sent to GA in a readable format in
the JavaScript console (example shown below)

Type of hit = pageview Where the hit is being sent

to: GA tracking ID
Shopping Behavior Report

• The Shopping Behavior

Report in GA receives its
data from the website's
enhanced ecommerce
implementation
• Ecommerce actions or hits
are sent with GA pageview
hits or events to feed data
into the shopping funnel
Sessions with Product Views
• To get this data correctly flowing into GA, you need the following populated on your website:
• PGdataLayer.GTM object and global container tracking code implemented
• PGdataLayer.ecomm object populated
• The GA debugger plugin is showing the ecommerce action "detail" that is sent to GA when a PDP is
viewed by a user
Sessions with Product Views
The global Advanced container will send an ecommerce hit when the PGdataLayer.ecomm object is
populated correctly on a page, as show below
Sessions with Add to Cart
• To get this data correctly flowing into GA, you need the following populated on your website:
• PGdataLayer.GTM object and global container JavaScript code implemented t
• PGdataLayer.ecomm object populated
• Standard event implemented: event_buy_now_add_to_cart on the "add to cart/bag" button
• The GA debugger plugin is showing the ecommerce action "add" that is sent to GA when a user adds
an item to their cart
Sessions with Checkout
• The ecommerce 'checkout' hit will be automatically sent with the pageview hit if the following is true:
• PGdataLayer.GTM object and global container tracking code implemented correctly
• PGdataLayer.ecomm.step must be greater than 0
• The PGdataLayer.ecomm products array must match what's in the user's shopping cart
• The GA debugger plugin is showing the ecommerce action 'checkout' that is sent to GA when a
user navigates to the checkout page:
Insert example code here
Checkout Funnel Report

• The Checkout Funnel

Report in GA receives its
data from the website's
enhanced ecommerce
implementation
• The checkout funnel is
helpful to understand how
many user successfully
moved through your
checkout process
How to setup your Checkout Funnel in GA
• Each GA property can be setup to reflect the checkout funnel based on your website's checkout process
• You can setup user friendly checkout step names (this can be requested via dpops.pg.com 🡪 web analytics)

• Once this is configured in GA, you need to implement our enhanced ecommerce solution
• Update PGdataLayer.ecomm.step on each page of your checkout with the appropriate step number based on
your checkout funnel
How to Implement the Checkout Funnel 
To collect where the user is in your website's checkout process, you must do the following:
• Implement PGdataLayer.ecomm.step and update the step to correspond with each section or page
of your checkout process
Example Code
'ecomm': {
‘step': '1',
'options':'',
'products': [{
'sku': '04620000002192',
'name': 'COVERGIRL Ultra Smooth Foundation + Applicator ',
'brand': 'Covergirl',
'category': 'Cosmetics',
'position': '1',
'creativetype': '',
'quantity’: '1' 'price': '16.99’;
'couponname': '’
'couponprice': ''
'discount': ''
'recurrence_type': 'one-time'
'product_listtype': ''
'variant': 'Soft Honey'
}]
}
Single Page Checkout Process
If your website has a single page checkout process, the web analytics team recommends the following
implementation:
• Option 1:PGdataLayer.ecomm.step is set to 1 and not updated, indiciating that there is only one
step
• Option 2: If the checkout page has multiple sections in the page, do the following:
• Treat the page like a single-page website
• Use virtualPageview events to manually send a pageview hit
• Update PGdataLayer.ecomm.step with appropriate value
• Update PGdataLayer.page.url with the virtual page url to be use for the section/step
• Implement a dataLayer.push of the virtualPageview to send hit to GA
GA Global Goals for DTC
Stores
How to Implement Global Goals?
• The Advanced Global GTM container includes an event management framework that
handles the flow of standard (consumer actions) events across our MarTech ecosystem
• There are 3 different methods if implementing these standard events:
• CSS Class
• dataLayer.push()
• PGdataLayer.event[]
• There are ~130 standard events defined around specific "consumer action" types and
subtypes as defined in our CRM platform
• A full list of these events can be found in the appendix section
• Please review the Consumer Actions & Standard Events guide in the appendix section for
a detailed guide on how to implement standard events
Global Goals Overview
Goal Name Type Category Equals Action Equals • The highlighted global goals are
1 Acquisition Complete Event applicable to most DTC
event_crm_action event_profile_register_complete
websites
2 Add to Cart Intent Event event_bin_action event_buy_now_add_to_cart
• You should implement all
3 Trial (sample) Intent Event event_sample_action event_sample_request 14 goals if it's applicable
4 Trial (coupon) intent Event event_coupon_action event_coupon_request for your website
5 Purchase Intent Event event_bin_action event_buy_now • Global goals are setup in your
6 Purchase Complete Event event_bin_action event_buy_now_checkout_complete Reporting View by default
7 Watch a Video Event event_informational_action event_video_play • Goals 15-20 are reserved for the
8 Exit to Social Site Event event_social_action event_socialmedia_exit Web Analytics' team future use
9 Trial (coupon) printed Event event_coupon_print|event_coupon_request_sca • If you want to setup custom
event_coupon_action
n|event_coupon_request_card
goals, please submit a ticket via
10 Submit Review Event event_ratings_action event_submit_review dpops.pg.com 🡪 Web Analytics
11 Sweepstakes Event
event_sweepstakes_action event_sweepstakes_complete • The following global goals can
Complete
12 Viewed an article Event event_informational_action event_view_article_page
be implemented using the
'Consumer Actions & Standard
13 Viewed a product Event
page
event_informational_action event_view_product_detail_page Events" guide in the appendix
14 POME Action Event
event_informational_action event_online_tool_start
Online Tool
Event Triggering Methods
CSS Class: JS listener code loaded via GTM executes send(onClick) of objects with standard CSS classes.
<a class="event_buy_now" data-action-detail="Shop
Now" href="/en-us/products"><span>Shop Now</span></a>

dataLayer.push(): Website initiates dataLayer.push() command to share event details with GTM for sending.
Primarily used for sending non-standard events to your GA property.
dataLayer.push({
'event': 'customEvent',
'GAeventCategory': 'event_bin_action',
'GAeventAction': 'event_buy_now',
'GAeventLabel': 'Shop Now',
'GAeventValue': 0,
'GAeventNonInteraction': false
});

PGdataLayer.events[]: JSON object in page source is read by GTM (on page load) and event is sent to GA.
Primarily used for non interactive events (ex: viewed a product page).
PGdataLayer.event=[{
'category': 'event_bin_action',
'action': 'event_buy_now',
'label': 'Shop Now',
'value': 0,
}]
 DTC Standard Events
event_bin_action event_buy_now
event_bin_action event_buy_now_choose_retailer
• These are additional standard
event_bin_action event_buy_now_choose_product events that can be used on DTC
event_bin_action event_buy_now_eretailer_exit websites
event_bin_action event_where_to_buy
event_bin_action event_buy_now_add_to_cart • Implement any events that are
event_bin_action event_buy_now_checkout_complete applicable to your website
event_bin_action event_remove_from_cart
event_bin_action event_view_cart • Please see full list of standard
event_bin_action event_preview_cart
events in appendix
event_bin_action event_checkout_now
event_bin_action event_update_quantity
event_bin_action event_out_of_stock
event_bin_action event_product_quickview
event_bin_action event_buy_now_add_to_wishlist
event_bin_action event_continue_shopping
Goal 1: Acquisition Complete

... • Acquisition Complete (event_profile_register_complete)

PGdataLayer.event =[{
'category': 'event_crm_action',
is one of P&G's global GA goals
'action': 'event_profile_register_complete',
'label': '',
• This event should be sent using the
'value': 0 PGdataLayer.event[] method since this will be sent on
}]
... the registration complete/finsihed page
Goal 2: Add to Cart Intent 
• Purchase Intent (event_buy_now_add_to_cart) is one
of P&G's global GA goals
• Use the CSS class assignment trigger method to send
this event when the user clicks on the "Add to bag"
button
• Set the event label (data-action-detail) to the product
SKU to understand which products consumers are
adding to their cart

<div class="card-text">
<a href="https://www.olay.com/cart.php?action=add&amp;product_id=595"
data-event-type="product-click" class="button button--small button--primary event_buy_now_add_to_cart"
data-product-id="595" data-action-detail="00075609196379">Add to Bag</a>

</div>
Goal 5: Purchase Intent

• Purchase Intent (event_buy_now) is one of

P&G's global GA goals
• Use the CSS class assignment trigger method to
send this event when the user clicks on the
"Shop Now" button
• Set the event label (data-action-detail) to the
name of the button (e.g. "Shop Now") to
<a class="btn event_buy_now" understand which buttons/pages the user is
data-action-detail="Shop Now" clicking on
href="/en-us/products"><span>Shop
Now</span></a>
Goal 6: Purchase Compelte

...
• Purchase Compelte
PGdataLayer.event =[{ (event_buy_now_checkout_compelte) is one of P&G's
'category': 'event_bin_action',
'action': 'event_buy_now_checkout_complete', global GA goals
'label': '',
'value': 0 • This event should be sent using
}]
... the PGdataLayer.event[] method since this will be sent
on the order compelete page
• This event will help you understand how many
consumers compelted a purchase
 Goal 10: Submit Review

• Submit Review (event_submit_review) is one

of P&G's global GA goals
• Use the CSS class assignment trigger method
to send this event when the user clicks on
the "submit" button
• Set the event label (data-action-detail) to
the product SKU to understand which products
are getting reviewed
<input type="image" name="phdesktopbody_0$ibtnSubmit"
id="phdesktopbody_0_ibtnSubmit" class="submit-btn btn-war-submit
event_submit_review" title="Submit" data-action-detail="037000855620"
eventname_callingdatalayer="" fb_eventname="" fb_eventtype=""
fb_customeventname="" fb_iscustomenable=""
src="https://azcdn.galileo.pgsitecore.com/en-us/-/media/Tide/Images/Common%
20Icons/buttonsubmit.png?v=1-201710310724" alt="Submit">
Goal 13: Viewed a Product Page

... • Viewed a Product Page

PGdataLayer.event =[{
'category': 'event_informational_action', (event_view_product_detail_page) is one
'action': 'event_view_product_detail_page', of P&G's global GA goals
'label': 'PRODUCT SKU HERE',
'value': 0
}]
• This event should be sent
... using the PGdataLayer.event[] method since this will be
sent when user views a PDP
Event_coupon_redemption
• The standard event: event_coupon_redemption can be
used on your "Apply" coupon buttons
• You can set the event label (data-action-detail) to the
coupon code to understand which coupons are being
used the most by your consumers

<a href=“/apply-coupon” class=“ event_coupon_redemption” data-action-detail

"COUPONCODE" >…</a>
Event_gift_certificate_redemption
• The standard event: event_gift_certificate_redemption
can be used on your "Apply" gift card/certificate buttons
• You can set the event label (data-action-detail) to the
gift card code to understand how often your consumers
are using gift cards

<a href=“/apply-gift” class=“ event_gift_certificate_redemption” data-action-detail

"GIFTCARDCODE" >…</a>
Event_reward_submit_codes
• The standard event: event_reward_submit_codes can
be used on your "submit" rewards buttons
• You can set the event label (data-action-detail) to the
coupon code/offer to understand coupon codes are
being used and how often

<button class=“btn btn—submit-code-modal js-modal-code-submit

event_reward_submit_codes” data-action-detail "COUPON CODE" >…</button>
Event_product_consultation_reco

• The standard event:

event_product_consultation_reco can be
used on your "recommend product" buttons
• You can set the event label
(data-action-detail) to the recommended
product to understand your consumers and
retarget them with the recommended
product

<img
src="https://haircodestorageprod.blob.core.windows.net/assets/images/Branding/H
airCode_Logo.png" class="inViewImg hc-haircode-logo-i hc-img-loaded"
event_product_consultation_reco data-action-detail "RECO PRODUCT"
title="HairCode" alt="HairCode">
Event_plan_frequency 
• The standard event:
event_plan_frequency can be used on
your plan frequency buttons (see
screenshot for example)
• You can set the event label
(data-action-detail) to the plan
frequency (3 mo, 6 mo, etc.) to
understand how often your consumers
are purchasing a certain item

ADD EXAMPLE CODE

Appendix
Helpful Materials:

Consumer Actions & Standard Event Guide

Standard Events Spreadsheet

PGdataLayer Specification Spreadsheet

Enhanced Ecommerce Guide

For access to the above documents, please contact analyticsaccount.im@pg.com