Sending data from the Google Tag Manager web container to the server container

Having reliable data in the server Google Tag Manager is a key to accurate server-side GTM tagging. One of the most popular ways to send data from web to server GTM is by setting up server-side Google Analytics 4. GA4 has its limitations. That is why we created Data Tag and Data Client that should work together to deliver event and user data from web to server GTM.

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.

The server container has no direct access to browser-side data – such as the data layer, cookies, or page context – so this data must be explicitly sent from the web container. Two methods are available for this: 

Step 1. Install the Data Tag template:

Step 2. Next, we’ll configure Data Tag for the pageview event:

Step 3. Next, you can configure the Data Tag for other events. The example below shows how to configure e-commerce events when Data Layer is available. 

This tag triggers each e-commerce event in the Data Layer. In this example, all e-commerce events end with _stape, so we’re using a regex that includes all events that contain _stape. 

Example of the variable that extracts user data from the Data Layer. 

Step 4. Next, download Data Client from the GitHub:

Step 5. Now to import the Data Client:

Step 6. Open the Clients tab and click New → choose Data Client → click Save. 

Step 7. Open web and server GTM preview screens and test the setup. You should see Data Tag triggered in the web GTM container and Data Client parsed Data Tag requests in the sGTM.

Step 1. Create a configuration variable for the server container URL. To do that:

Step 2. Create a Google Analytics 4 tag:

Step 3. Next, let’s see how to create a GA4 event, using the All Clicks event as an example:

Next, you'll need to configure sending your event data to your marketing / analytics platform. Exact steps will depend on your choice of platform. Check out our guides on the popular platforms for more information:

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: 

This data tag fires on all enhanced e-commerce events.

In the server container preview mode, you will see that Data Tag sent requests on all e-commerce events, and Data Client received and processed these requests inside the server container. If I click on the event name and check event_data, you should see all the parameters from the web data layer.

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.

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.

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 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}}”}

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.

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.

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

You can use Data Client to retrieve any incoming requests. To do that, you need to modify Path Settings. It can be used, for example, to retrieve data from Webhooks. We have this article that describes how to use incoming webhooks.

If you can’t see Data Tag requests inside the server container, it might be because of the following reason: Data Client is not published. Open Server container and publish Data Client.

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!