Track dynamic content with Google Analytics

This blog post focuses on Universal Analytics. Since February 24, If-So now seamlessly integrates with GA4. You can easily enable this integration by adding ga4=”yes” to the trigger’s shortcode.

The result you will get:

Learn how to track your dynamic content with Google Analytics:

Personalized content is great. With little effort, it increases conversion and engagement rates and can decrease bounce rates drastically. In this guide, we are going to show you an easy way to track dynamic content results using Google Analytics and Google Tag Manager.

This setup is divided into two steps:

Step 1: Create an Analytics event to track when a dynamic version is visible.
Step 2:  Segment the Analytics reports to separate the data of users who saw the dynamic content version.

Let’s Get Started!

STEP 1: Create a Google Analytics event to track when a dynamic version is visible.

To see how dynamic content affects users engagement, we first need to set up an Analytics events collection every time a dynamic version is displayed. To do this, we will first add a class and an ID to each content version. We will then ask Google Analytics to collect an event every time an element with the class is visible in the user’s browser and to name the event according to the element’s ID.

In our example, we are going to name the class “ifsoEvent” and the IDs “versionA”, “VersionB,” etc. You can choose different names if you want to.

Adding Class and ID to the content’s versions

1. On your WordPress dashboard, go to If-So > Triggers and select the trigger you want to track with Analytics
2. Switch the content field to HTML mode
3. Assign the class “ifsoEvent” to the wrapping element of the content. Analytics will track an event every time an element with this class is visible at the browser viewport
4. Assign an ID to the wrapping element – The ID name you set here will be the name of the event on your Analytics reports.

* If you switch the editor to text mode and you don’t see any wrapping HTML element around your content, you’ll need to wrap the text in a P tag and assign the class and ID.

You can copy and paste the following code and just replace the text “your content” with your own content.

<div class="ifsoEvent" id="versionA">Your content</div>

Hereinafter is an example showing how it should look like:

Setting up event tracking using Google Tag Manager

Creating a tag

1. Go to your Google Tag Manager dashboard
2. Navigate to Tags.
3. Click New and name the tag “If-So tracking”
   (The name is for your own convenience; you can choose a different name if you want).
4. Click Tag configurations
5. Select Google Analytics – Universal Analytics as the tag type and set up the event parameters as follows:
   – Track type: Event
   – Category: ifso_tracking (you can choose a different name if you want to)
   – Action: view
   – Label: Click the ‘+’ sign and select {{Click ID}}.
   – Non-interaction hit: TrueYour tag should look like this:
   – Under Google Analytics settings select {{Google Analytics settings}}
   

Creating the trigger

1. Click the triggering box.
2. Click the ‘+’ sign and name your trigger (we named ours ‘ifso_tracking’. You can choose a different name if you want; it’s for your own use only).
3. Click Trigger Configuration.
4. Choose Element Visibility as the trigger type.
5. On the selection method field, select “CSS Selector”.
6. 6. On the element selector field, type the class you have chosen for your element (We did it in the first step of this guide. In our example, we assigned the class “.ifsoEvent”). Make sure to write the class name with a dot at the beginning.
7. Save! You should now hit the save button 3 times: on the trigger configurations window, the trigger container, and the tag window
8. Click the submit button

Note that changes on Google Tag Manager are applied only after hitting the submit button!

That’s it! If you followed the steps above, the events should now appear on your Google Analytics reports.

Step 2 -Viewing results for each version on Google Analytics

After completing the steps above, events with different names will be collected every time a version is displayed. The events label is defined by the ID we assigned to the version. Next, we are going to create users segmentation on Google Analytics so that we can compare users’ behaviors based on the content version they saw.

Segment users by the content version they saw:

1. On your Google Analytics account, go to the section you want to examine ( for example Behavior → Site Content → All Pages).
2. On top of the Google Analytics, click +Add Segment.
3. Click + New segment.
4. Name the segment. For example, we named ours “versionA” but you can choose any other name; it’s for your own use only.
5. At the side menu, click Conditions.
6. Set up a filter as follows:
   – In the first drop-down menu, choose event label.
   – In the second, select exactly matches.
   – In the type-form, insert the version ID (in our example – “versionA”).
7. Click Save

Voila! You’ve created a new segment that shows only users who watched version A. Repeat the last 7 steps to create segments for other content versions. Now you can track dynamic content across your entire website. Watch your conversion rates and ROI increase! 

Everything you need to know about Geolocation API

Jotform Conditional Content: 3 Ways for Crafting Personalized User Journeys

3 Powerful Ways to Reduce Bounce Rate Using If-So in Just 24 Hours!

Inspiring Examples: 5 Dynamic Content Strategies We Use on Our Site

All About the WordPress Notification Bars - Effortless Boost to Your Conversion Rate

Maximizing the Benefits of Content Personalization: Examples, Strategies, and 4 Golden Tips

6 Personalization Demos

Conditional CSS- Demo & 2 Simple Setup Methods

How to Insert a Contact's Name From your CRM/ESP into your Site?

Using If-So’s Main Features: How we changed the look of our homepage for Halloween