...
🚀 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
...
Repeat these 4 steps to create the other 3 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 4 7 times but instead use variable type Custom Event - just ensure the variable names match these below:
...
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:
| Info |
|---|
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_message | {{greenback.message}} | |||||
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 |
...
| Note |
|---|
Make sure the event parameter names are identical to your GTM parameter Names. |
...
That’s it!
| Info |
|---|
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: