This article explains how you can track greenback user behaviour within your own Google Analytics (GA) reports.
🚀 4 easy steps
Contact your Custogmer Success representative to turn on your ‘data layer’ greenback events
Create custom variables to pass data layer values into your Google Tag Manager (GTM)
Create custom tags in your GTM to pass the data to your GA
Create the custom variables in your GA4 to use them in your reports
This guide covers passing all of the available greenback events into your GA, however you can choose to pass only the ones you need
Step 1: Check the data layer is turned on
After your CS rep has confirmed this is now activated, open up Google Chrome browser:
Visit your website page where greenback is loaded, e.g.
Interact with widget
When you have done some interaction, right-click > Inspect (or Ctrl+Shift+I) to open the Chrome Developer tools console
Choose the Console tab, type dataLayer (it’s case sensitive!) and hit Enter, you will now see the fired events:
Depending on what action you performed you will see greenback events fired (full details) for:
greenback.view - fired everytime greenback widget is loaded
greenback.opened - fired everytime someone opened chat window
greenback.1stMessageSent - fired everytime someone sent a first message
greenback.productRecommended - fired everytime products are recommended
greenback.productClick - fired everytime someone clicks on a product
greenback.addToCart - fired if someone adds a product to the cart from the widget
greenback.closed - fired when someone closed the widget
You’re now ready to join this custom data to your GA using GTM.
🖇️ Step 2: Pass greenback data into Google Tag Manager (GTM)
2a. Create the GTM Data Layer Variables
This will allow any GTM tags to use the preezie data variables (as GA4 parameters) in various ways.
First go to your GTM account:
Variables > User-Defined Variables > New
Give it a name of greenback.products
Click Variable Configuration > Data Layer Variable
In Data Layer Variable Name enter greenback.products hit Save
Repeat these 4 steps to create the other 8 data layer variables needed:
Variable name (8 Data Layer Variables) | Data Layer Variable Name | What it captures |
|---|---|---|
greenback.visitorid | greenback.visitor.id | The user using the greenback widget |
greenback.sessionid | greenback.session.id | The user using the greenback widget |
greenback.page | greenback.page | The page that user is on |
greenback.message | greenback.message | The message user sent in greenback |
greenback.products(array) | greenback.products | The products recommended |
greenback.productid | greenback.product.id | The unique id of the clicked product in the recommended products (as defined by your product feed) |
greenback.position | greenback.product.position | The position the clicked product was ranked in the recommendation products |
greenback.productname | greenback.product.name | The name of the product that was clicked on. |
greenback.productPrice | greenback.product.price | The price of the product that was clicked on |
Now to join the above to Data Layer events, repeat the above steps 7 times but instead use variable type Custom Event - just ensure the variable names match these below:
Variable name (Custom Event) | What it captures |
|---|---|
greenback.view | When the greenback loads |
greenback.opened | When the chat model opened |
greenback.1stMessageSent | When the 1st message sent |
greenback.productRecommended | Products recommended |
greenback.productClick | A click on a product recommendation |
greenback.addToCart | When add-to-cart is performed |
greenback.closed | When widget is closed |
You now have your new variables, they should look like this:
2b. Create the GTM triggers for your tags
In your GTM account, create these triggers before you create your tags:
greenback ‘view’ event
Triggers > New
Name: greenback.view
Trigger Type: Custom Event
Event name: greenback.view
Save
Now repeat these steps for the other 4 triggers:
Name (5 triggers) | Trigger Type | Event name | What it captures |
|---|---|---|---|
greenback.view | Custom Event | greenback.view | Each time a greenback widget loads on the page |
greenback.opened | Custom Event | greenback.opened | Each time the user opens greenback widget |
greenback.1stMessageSent | Custom Event | greenback.1stMessageSent | When the user sent the first message |
greenback.productRecommended | Custom Event | greenback.productRecommended | When products are recommended |
greenback.productClick | Custom Event | greenback.productClick | Each click to product in the recommended products |
greenback.addToCart | Custom Event | greenback.addToCart | When product is add to the cart |
greenback.closed | Custom Event | greenback.closed | When greenback widget is closed |
🥽 Step 3: Create GA4 tags
Now you need to create tags to tell GA what event data is available. Each event fired contains parameters, you can choose which parameters you’d like to send to GA4 (full details).
3a. Tag set up
In GTM > Tags > New
Create and publish these tags with the below values:
If you want to include other parameters just use the same format with the variables from Step 2a.
Tag name | Taq type | Configuration Tag | Event Name | Event Parameter Name | Value | Trigger (as per Step 2b) |
|---|---|---|---|---|---|---|
GA4 greenback_view | Google Analytics: GA4 Event | (Select your GA4 variable within GTM) | greenback_view | greenback_page | {{greenback.page}} | greenback.view |
User Properties | ||||||
greenback_user | {{greenback.visitorid}}{{greenback.sessionid}} | |||||
GA4 greenback_opened | Google Analytics: GA4 Event | (Select your GA4 variable within GTM) | greenback_opened | greenback_page | {{greenback.page}} | greenback.opened |
User Properties | ||||||
greenback_user | {{greenback.visitorid}}{{greenback.sessionid}} | |||||
GA4 greenback_1stMessageSent | Google Analytics: GA4 Event | (Select your GA4 variable within GTM) | greenback_1stMessageSent | greenback_page | {{greenback.page}} | greenback.1stMessageSent |
greenback_message | {{greenback.message}} | |||||
User Properties | ||||||
greenback_user | {{greenback.visitorid}}{{greenback.sessionid}} | |||||
GA4 greenback_productRecommended | Google Analytics: GA4 Event | (Select your GA4 variable within GTM) | greenback_productRecommended | greenback_page | {{greenback.page}} | greenback.productRecommended |
greenback_products | {{greenback.productRecommended}} | |||||
User Properties | ||||||
greenback_user | {{greenback.visitorid}}{{greenback.sessionid}} | |||||
GA4 greenback_productClick | Google Analytics: GA4 Event | (Select your GA4 variable within GTM) | greenback_productClick | greenback_page | {{greenback.page}} | greenback.productClick |
greenback_product_id | {{greenback.productid}} | |||||
greenback_product_name | {{greenback.productname}} | |||||
greenback_product_position | {{greenback.position}} | |||||
greenback_product_price | {{greenback.productPrice}} | |||||
User Properties | ||||||
greenback_user | {{greenback.visitorid}}{{greenback.sessionid}} | |||||
GA4 greenback_addToCart | Google Analytics: GA4 Event | (Select your GA4 variable within GTM) | greenback_addToCart | greenback_page | {{greenback.page}} | greenback.addToCart |
greenback_product_id | {{greenback.productid}} | |||||
greenback_product_name | {{greenback.productname}} | |||||
greenback_product_price | {{greenback.productPrice}} | |||||
User Properties | ||||||
greenback_user | {{greenback.visitorid}}{{greenback.sessionid}} | |||||
GA4 greenback_closed | Google Analytics: GA4 Event | (Select your GA4 variable within GTM) | greenback_closed | greenback_page | {{greenback.page}} | greenback.closed |
User Properties | ||||||
greenback_user | {{greenback.visitorid}}{{greenback.sessionid}} |
These events now need to be configured in GA4.
3b. Mapping your Custom events into GA4
Each GTM event will automatically fire into GA4 however you now need to set up the additional ‘values’ sent with each event.
In GA4 > Settings > Custom definitions
Create custom dimension
Then add each of these values for these events:
Dimension name | Scope | Description | Event parameter |
|---|---|---|---|
greenback_page | Event | Which page the greenback was on | greenback_page |
greenback_message | Event | What message was sent to greenback | greenback_message |
greenback_products | Event | What products are recommended to user | greenback_products |
greenback_product_id | Event | The unique ID of the clicked product | greenback_product_id |
greenback_product_name | Event | The name of the clicked product | greenback_product_name |
greenback_product_position | Event | The rank position of the clicked product in the product recommendation | greenback_product_position |
greenback_product_price | Event | The price of the clicked product | greenback_product_price |
preezie_user | User | The user who interacted with greenback | greenback_user |
Make sure the event parameter names are identical to your GTM parameter Names.
Note, all are Event scoped except for preezie_user.
That’s it!
Note: It can take up to 24 hours for these events to show within your GA4.
📊 Step 4: How to use the data in GA
These events will give you the ability to segment/group behaviour.
But you can also breakdown by matching exactly/partially on the text of the values, e.g.
Engagement with greenback i.e. how many users opened greenback when it was loaded?
Which pages are most engaging?
Which products are more frequently clicked on
A full event definition guide can be found here: Using Data Layer with Greenback
\uD83D\uDCCB Related articles
Some additional reading: