Google Tag Manager Data Layer

In this article, I want to show you how to use Data Tag . This custom tag sends parameters from the Google Tag Manager Web Container to the Server Container. When used together with the Data Client for the Google Tag Manager server container, it allows sending data layer variables, custom parameters, and other data from the web to the server container. As a result, Data Client retrieves information from the Data Tag into the Google Tag Manager Server Events.

How to send data from the Google Tag Manager web to the server container

Companies started to take advantage of the Google Tag Manager server-side containers in the last couple of years. Some of them are implementing the combination of web and server containers. Others want to move their tracking from the client-side and start utilizing server-side tracking. The Data Tag that we created is designed to deliver data from the web to the server container. The clients who wish to combine web and server tracking will find it especially helpful.

The server-side tracking allows moving the instrumentation of Google Tag Manager to the server environment. In other words, you can move your tracking out of the browser and into the server. Our Data Tag and Data Client solve the problem of transporting data from the Google Tag Manager web to the server container. Let's say that you have all the data you need configured on the web container, but the server environment cannot use the same data Layer variables, DOM elements, etc. Our Data Tag and Data Client solve the problem of transporting all the data from the web to server container with no extra efforts required.

With the help of the Data Tag, you can configure what events, event parameters, and user data you want to send to the server container and when. On the other side, our Data Client should be placed inside the server container to listen to the Data Tag information and process it into the events data.

All the information will be stored on your server. Data Tag and Data Client will allow storing, molding, and retrieving the data from the web container and utilize it to set up server-side tags. Data Tag and Data Client inside the server container will shape and guide the data to the proper destinations using tags.

Data Tag Descriptions

I will start by describing all fields and options this tag has. It will help you understand better which information you can send from the web to the server.

Event Name.You have two options: select a standard event from the dropdown menu or send a custom event. Using the custom event, you can add variable {{event}}, and in this case, the Data Tag will send all events you see inside the preview mode.

GTM Server Side domainis a required field. You can find it in your Google Tag Manager Server container settings under Tagging server URL. Data Tag will use this domain to send requests.

You can choose to send all data layer values to the server container by enabling Send all from Data Layer.

If you enable Send common data, Data Tag will send page_location, page_path, page_hostname, page_referrer, page_title, page_encoding, screen_resolution, viewport_size.

Inside the event data tab, you can add the custom event parameter you want to send to the server container. You may choose any web tag manager variable or type static value or text inside the Name and Value fields. There is also an option to modify values with functions Trim or To lower case. In the example on the screenshot, I sent click text from the web to the server container altered with lowercase function.

click text to lowercese

With the help of User Data , you can send user parameters. You need to select the parameter name from the dropdown menu, add a static value, or use the variable. There is also an option to transform value with trim or to lowercase functions. You can use these fields to send user data to the server Facebook tag to increase event matching for your Facebook CAPI. If you are using our Data Tag, Data Client, and Facebook CAPI, then the Facebook tag will automatically take user data from Data Tag.

Inside the Settings section, you can change request type (by default, request type is POST, change it to GET), path and protocol versions.

Advanced Settings are standard settings you have inside all Google Tag Manager Web tags.

Data Tag benefits

For now, there are two ways of sending data from web to server container: using GA4 tag and Data Tag/Data Client. Data Tag/Data Client has several benefits over GA4:

1. Data Tag can send arrays of data. In comparison, the GA4 tag can send only variables and returns an error if you try to send an array.
2. With the help of the Data Tag/Data Client, you can send all information from the Web data layer to event data inside the Server container. While with GA4, you'll have to send each variable manually.
3. If you want to store user data in the GTM variables, then use a Data Tag. For example, it can be used when the form submits have available user data on button clicks but not at thank-you pages. I'll demonstrate how this function works later in the Data Tag Use Cases section.
4. Data Tag/Data Client allows transforming data. For example, hash data, lowercase, trim.

How to send data from Web to Server container using Data Tag/Data Client

I will show how to use Data Tag/Data Client for the purchase event. This logic of using Data Tag/Data Client is the same for all events.

1. Add Data Tag to the GTM Web container from the Template Gallery.

2. Download Data Client from the GitHub -> Open Template tab inside the Server container -> Click New under the Clients section -> Click three dots on the top right corner -> Import -> Click Save.

3. Open Web container -> Create New tag -> Tag Type Data to GTM Server Side -> Select event name -> Add GTM Server Side URL -> Add event data (such as product name, SKU, ID, etc.) -> Add User Data.

4. Select trigger for the event and click save.

5. Open Server container -> Open Client -> Add new client -> Client type Request Data to Event Data -> Click Save. Publish Server container.

6. Open the preview mode of the web and server container and check that the server container sees Data Tag information. If you don't see Data Tag requests, update the GTM Server Preview HTTP header.

7. Once you've verified that the Data Tag and Data Client works correctly, publish a web and server container.

Data Tag use cases

1. Data layers from the web to the server container.

The first use case that comes to mind is sending a data layer from the web container to the server. With the help of this data, you can feed additional parameters to your server-side tags. On the screenshot below, I used these settings to send the data layer to the server container:

Custom event: {{event}}

Enabled send all from data layer

Enabled send common data

This data tag fires when a user goes through the checkout process on the site.

send dataLayer from web tag manager to server

If I go to the web and server container preview mode, I can see that Data Tag fired three times on the web container, and Data Client received and processed all three events inside the server container. If I click on the event name and check request_data, I can see all the parameters from the web data layer.

data tag checkout

datalayer to server container

2. Sending User Data to Facebook Conversion API.

Let's say that you want to send user data like the first name, last name, or email to Facebook Conversion API to increase your event match quality. You can use Data Tag for that. And if you are using our tag to set up a Facebook conversion API tag, the FB tag will automatically capture user data from the Data Tag.

I wanted to send the user email, first name, and last name together with the checkout events in the examples below. I added the user data to the Data Tag on the Web Google Tag Manager container. I'm using static parameters for the test, but you can pass these parameters dynamically using variables. Our Facebook tag automatically captures user parameters from the Data Client and sends hashed information to Facebook.

facebook user data

To double-check if Facebook received these parameters, you can add Facebook test ID to the Facebook server tag and check which parameters Facebook sees in the events manager testing tool.

3. Send custom data from the Web container to any other servers.

You can send data from the Google Tag Manager web container to your CRM, Slack, webhooks, etc. This example shows you how to send information about a new purchase on your site to the Slack channel.

1. Make sure that you send the correct information from the Google Tag Manager web container using Data Tag.
2. Generate a webhook https://api.slack.com/tutorials/slack-apps-hello-world on Slack.
3. Inside the server container, create a new tag and choose a tag type HTTP Request.
4. In the destination URL, add the URL that you've generated on Slack.
5. HTTP method POST.
6. In the Request body, add text and parameters that you want to send to Slack.

{"text": "New Purchase \n email: {{email}} \n transation_id: {{transaction ID}} \n purchase_value: {{transaction ID}}"}

notification from slack to google tag manager

4. Store data.

If you work with Google Tag Manager quite often, then there has been a time when the data layer (or any other variable) had to be passed on from one page of your site to another.

Unfortunately, Google Tag Manager doesn't have an option to store data and pass it between site pages. For example, it's possible to send a user email only when it exists on the page. But what if user data is not available on the thank you page, and it can be captured only from the page before the thank you page?

Using a data tag, you can store any variables you want to pass to other pages.

As an example, I will use an assessment built with Instapage. We needed to set up a lead event for the Facebook conversion API. While submitting the assessment, the user had to enter details like email, phone number, first name, etc. This user information was available on the assessment pages but not on the thank you page.

To have a high event match quality score on Facebook, you should send user parameters together with the CAPI event. That is why I used Data Tag to store user data in the local storage. I created a Submit application Data tag that takes user parameters from the data layer and stores them in the Local Storage. This tag triggers when a user clicks on the submit assessment button.

To enable data storing in the Data Tag, select the storing option next to the data you want to store.

data tag store data

Then, I added a new variable type in the web container (you can download it using this link.) Create new variables for all data that you stored.

store data variables

And finally, I created a Lead Data Tag that sends stored data to the server container.

sends stored data server container

Common Problems with Data Tag and Data Client

If you can't see Data Tag requests inside the server container, it might be because of the following reasons:

1. Data Client is not published. Open Server container and publish Data Client.

data tag error

Want us to implement server-side tracking on your site?
Find out how much it'll cost!

Conclusion

Data Tag and Data Client will give a solid source of information to feed into the tags you use inside the server container. With the help of this tag, you can move faster in the deployment of new server-side tracking and technologies. This tag will save time and cost for both IT and marketing – a clear win-win!

If you want to test what the GTM server is and how it works, please register an account.

If you need help setting up a GTM server account on your website, contact us right away!