How to Set Up GTM Cookie Tracking (and Better Understand Content Engagement)




The extra you perceive the behaviour of your customers, the higher you possibly can market your services or products — which is why Google Tag Manager (GTM) is a marketer’s finest good friend. With built-in tag templates, resembling scroll depth and click on monitoring, GTM is a strong software to measure the engagement and success of your content material. 

If you’re solely counting on tag templates in GTM, or the often limiting out-of-box Google Analytics, then you possibly can be lacking out on insights that transcend regular engagement metrics. Which means you could be getting an incomplete story out of your information.

This publish will educate you ways to get much more perception by establishing cookies in GTM. You’ll learn the way to tag and monitor a number of web page views in a single session, monitor a selected set variety of pages, based mostly on particular on-page content material parts, and perceive how customers are partaking together with your content material so you can also make data-based selections to higher drive conversions.

Example use case

I lately labored with a consumer that needed to higher perceive the conduct of customers that landed on their weblog content material. The essential barrier they confronted was their URL construction. Their content material didn’t dwell on logical URL constructions — they positioned their goal key phrase straight after the basis. So, as a substitute of instance.com/weblog/some-content, their URL construction regarded like instance.com/some-content.

You can use superior segments in Google Analytics (GA) to monitor any variety of metrics, however should you don’t have a logically outlined URL, then monitoring and measuring these metrics turns into a guide and time-consuming observe — particularly when there’s numerous pages to monitor.

Fortunately, leveraging a customized cookie code, which I present beneath, helps you to reduce by that point, requires little implementation effort, and may floor highly effective insights:

  1. It can point out that customers are engaged together with your content material and your model.
  2. The saved information may very well be used for content material scoring — if a web page is included within the three pages of an occasion it might be extra helpful than others. You might want to goal these pages with extra upsell or cross-sell alternatives, if that’s the case.
  3. The identical scoring logic might apply to authors. If blogs written by sure authors have extra web page views in a session, then their writing model/subjects may very well be extra partaking and you might have considered trying to additional leverage their content material writing abilities.
  4. You can construct remarketing viewers lists to goal these seemingly engaged customers to align with what you are promoting targets — people who find themselves extra engaged together with your content material may very well be extra possible to convert.

So, let’s briefly focus on the anatomy of the customized code that you will want to add to set cookies earlier than we stroll by a step-by-step implementation information.

Custom cookie code

Cookies, as everyone knows, are a small textual content file that’s saved in your browser — it helps servers bear in mind who you’re and its code is comprised of three parts:

  • a name-value pair containing information
  • an expiry date after which it’s not legitimate
  • the area and path of the server it ought to be despatched to.

You can create a customized code to add to cookies to provide help to monitor and retailer quite a few web page views in a session throughout a set of pages.

The code beneath varieties the muse in establishing your cookies. It defines particular guidelines, such because the occasions required to set off the cookie and the expiration of the cookie. I will present the code, then break it up into two elements to clarify every phase.

The code

<script>
perform createCookie(title,worth,hours) 
if (doc.questionSelectorAll("CSS SELECTOR GOES HERE"").size > zero) 
</script>



Part 1

<script>
perform createCookie(title,worth,hours) 

Explanation:

This perform, because the title implies, will create a cookie should you specify a reputation, a price, and the time a cookie ought to be legitimate for. I’ve specified “hours,” however if you’d like to specify “days,” you’ll want to iterate variables of the code. Take a peek at this nice useful resource on establishing cookies.

Part 2

if (doc.questionSelectorAll("CSS SELECTOR GOES HERE").size > zero) 
else if (y == 2) 
else if (y == three) 
  
if (newCount == four) {
dataLayer.push();

Now that we have now a fundamental understanding of the script, we are able to use GTM to implement all the pieces.

First, you’ll want the arrange the next “Tags,” “Triggers”, and “Variables”:

Tags

Custom HTML tag: comprises the cookie script

Event tag: fires the occasion and sends the info to GA after a 3rd pageview is a session.

Triggers

Page View set off: defines the situations that can hearth your Custom HTML Tag.

Custom Event set off: defines the situations that can hearth your occasion.

Variable

First Party Cookie variable: This will outline a price set off wants to consider whether or not or not your Custom HTML tag ought to hearth.

Now, let’s stroll by the steps of setting this up in GTM.

Step 1: Create a customized HTML tag

First, we’ll want to create a Custom HTML Tag that can comprise the cookie script. This time, I’ve added the CSS selector, beneath:

 #content material > div.publish.type-post.status-publish.format-standard.hentry > div.entry-meta > span > span.creator.vcard > a

This matches authors on Distilled’s weblog pages, so that you’ll need to add your personal distinctive selector.

Navigate to Tags > New > Custom HTML Tag > and paste the script into the customized HTML tag field.

You’ll need to guarantee your tag title is descriptive and intuitive. Google recommends the next tag naming conference: Tag Type – Detail – Location. This will permit you to simply determine and type associated tags from the overview tag interface. You also can create separate folders for various initiatives to maintain issues extra organized.

Following Google’s instance, I’ve referred to as my tag Custom HTML – three Page Views Cookie – Blog.

Once you’ve created your tag, bear in mind to click on save.

Step 2: Create a set off

Creating a set off will outline the situations that can hearth your customized HTML tag. If you need to be taught extra about triggers, you possibly can learn up on Simo Ahava’s set off information.

Navigate to Triggers > New > PageView.

Once you’ve clicked the set off configuration field, you’ll need to choose “Page View” as a set off kind. I’ve additionally named my set off Page View – Cookie Trigger – Blog, as I’m going to arrange the tag to hearth when customers land on weblog content material.

Next, you’ll need to outline the properties of your set off.

Since we’re counting on the CSS selector to set off the cookie throughout the location, choose “All Page Views”.

Once you’ve outlined your set off, click on save.

Step three: Create your variable

Just like how a Custom HTML tag depends on a set off to hearth, a set off depends on a variable. A variable defines a price set off wants to consider whether or not or not a tag ought to hearth. If you need to be taught extra about variables, I like to recommend studying up on Simo Ahava’s variable information.

Head over to Variables > User-Defined Variables > Select 1st Party Cookie. You’ll additionally discover that I’ve named this variable “NumberOfBlogPagesVisited” — you’ll need this variable title to match what’s in your cookie code.

Having chosen “1st Party Cookie,” you’ll now want to enter your cookie title. Remember: the cookie title wants to replicate the title you’ve given your cookie within the code. I named my cookie BlogPagesVisited, so I’ve replicated that within the Cookie Name discipline, as seen beneath.

Step four: Create your occasion tag

When a consumer triggers a third-page view, we’ll need to have it recorded and despatched to GA. To do that, we want to arrange an “Event” tag.

First, navigate to Tags > New > Select Google Analytics – Universal Analytics:

Once you’ve made your tag kind “Google Analytics – Universal Analytics”, be certain monitor kind is an “Event” and also you title your “Category” and “Action” accordingly. You also can fill in a label and worth if you want. I’ve additionally chosen “True” within the “Non-interaction Hit” discipline, as I nonetheless need to monitor bounce price metrics.

Finally, you’ll need to choose a GA Setting variable that can move on saved cookie info to a GA property.

Step 5: Create your set off

This set off will reference your occasion.

Navigate to Trigger > New > Custom Event

Once you’ve chosen Custom Event, you’ll need to make sure the “Event name” discipline matches the title you’ve got given your occasion within the code. In my case, I referred to as the occasion “3 Blog Pages”.

Step 6: Audit your cookie in preview mode

After you’ve chosen the preview mode, you need to conduct an audit of your cookie to guarantee all the pieces is firing correctly. To do that, navigate to the location you the place you’ve arrange cookies.

Within the debugging interface, head on over to Page View > Variables.

Next, look to a URL that comprises the CSS selector. In the case of the consumer, we used the CSS selector that referenced an on-page creator. All their content material pages used the identical CSS selector for authors. Using the GTM preview software you’ll see that “NumberOfBlogPagesVisited” variable has been executed.

And the precise “BlogPagesVisited” cookie has fired at a price of “1” in Chrome DevTools. To see this, click on Inspect > Application > Cookies.

If we skip the second-page view and execute our third-page view on one other weblog web page, you’ll see that each our GA occasion and our Custom HTML tag fired, because it’s our third-page view.

You’ll additionally see the third-page view triggered our cookie worth of “3” in Chrome DevTools.

Step 7: Set up your superior phase

Now that you just’ve arrange your cookie, you’ll need to pull the saved cookie information into GA, which is able to permit you to manipulate the info as you see match.

In GA, go to Behaviour > Events > Overview > Add Segment > New Segment > Sequences > Event Action > after which add the occasion title you laid out in your occasion tag. I specified “three Blog Page Views.”

And there you’ve got it! 

Conclusion

Now that you understand how to arrange a cookie in GTM, you will get heaps of further perception into the engagement of your content material.

You additionally know the way additionally to mess around with the code snippet and iterate the variety of web page views required to hearth the cookie occasion in addition to the expiration of the cookies at every stage to fit your wants.

I’d have an interest to hear what different use circumstances you possibly can consider for this cookie, or what different varieties of cookies you arrange in GTM and what information you get from them.



Source hyperlink Internet Marketing