Stape

Envio de dados do Contentor Web do Gestor de etiquetas do Google para o Contentor do Servidor

Autor
Stape
Publicado
April 01, 2021
Também disponível em

Neste artigo, quero mostrar-vos como utilizar a Data Tag. Esta etiqueta personalizada envia parâmetros do Contentor Web do Gestor de Etiquetas da Google para o Contentor do Servidor. Quando usado em conjunto com o Data Client para o contentor do servidor do Gestor de Etiquetas da Google, permite enviar variáveis da camada de dados, parâmetros personalizados, e outros dados do contentor da web para o contentor do servidor. Como resultado, Data Client recupera informação do Data Tag para os Eventos do Servidor do Gestor de Etiquetas da Google. 

Como enviar dados do contentor web do Gestor de etiquetas da Google para o contentor do servidorCopiar link para esta secção

As empresas começaram a tirar partido dos contentores do lado do servidor do Gestor de etiquetas da Google nos últimos anos. Algumas delas estão a implementar a combinação de contentores web e de servidor. Outras querem mover o seu rastreamento do lado do cliente e começar a utilizar o rastreamento do lado do servidor. A Data Tag que criámos foi concebida para entregar dados do contentor web para o contentor do servidor. Vai ser especialmente útil para os clientes que desejem combinar o rastreamento da web e do servidor.

O rastreamento do lado do servidor permite mover a instrumentação do Gestor de etiquetas da Google para o ambiente do servidor. Por outras palavras, pode mover o seu rastreamento para fora do navegador e para dentro do servidor. O nosso Data Tag e Data Client resolve o problema do transporte de dados do contentor web do Gestor de Etiquetas da Google para o contentor do servidor. Digamos que tem todos os dados necessários configurados no contentor web, mas o ambiente do servidor não pode utilizar as mesmas variáveis de camada de dados, elementos DOM, etc. O nosso Data Tag e Data Client resolvem o problema de transportar todos os dados do contentor da web para o contentor do servidor, sem esforços adicionais.

Com a ajuda da Data Tag, pode configurar os eventos, parâmetros de eventos e dados de utilizador que pretende enviar para o contentor do servidor e quando pretende fazê-lo. Por outro lado, o nosso Data Client deve ser colocado dentro do contentor do servidor para ouvir a informação da Data Tag e processá-la nos dados de eventos.

Toda a informação será armazenada no seu servidor. Data Tag e Data Client permitirão armazenar, moldar, e recuperar os dados do contentor web e utilizá-los para configurar as etiquetas do lado do servidor. Data Tag e Data Client dentro do contentor do servidor moldarão e orientarão os dados para os destinos apropriados usando etiquetas.

Descrições da Data TagCopiar link para esta secção

Vou começar por descrever todos os campos e opções que esta etiqueta tem. Ajudá-lo-á a compreender melhor que informação pode enviar a partir da web para o servidor.

tag configuration

Nome do evento. Tem duas opções: seleccione um evento padrão a partir do menu pendente ou envie um evento personalizado. Usando o evento personalizado, pode adicionar a variável {{event}}, e neste caso, a Data Tag enviará todos os eventos que vê dentro do modo de pré-visualização.

O domínio do lado do servidor do GTM é um campo obrigatório. Pode encontrá-lo nas definições do seu contentor do servidor do Gestor de Etiquetas da Google sob a URL do servidor de etiquetagem. Data Tag irá utilizar este domínio para enviar pedidos.

Para ver os eventos no modo de pré-visualização do contentor do servidor do Gestor de etiquetas da Google, é necessário adicionar o cabeçalho HTTP de pré-visualização do servidor do GTM. Pode encontrá-lo clicando nos três pontos no canto superior direito do modo de pré-visualização de contentor do servidor do Gestor de etiquetas da Google -> Clique em "Enviar pedidos manualmente" -> Copie "X-Gtm-Server-Preview HTTP header". Note que este cabeçalho não é estático. Pode mudar quando se inicia a próxima sessão de depuração. Se não vir os eventos de Data Tag no contentor do servidor, verifique se o seu cabeçalho de Pré-visualização está correcto.

Pode optar por enviar todos os valores da camada de dados para o contentor do servidor, permitindo Enviar tudo a partir da camada de dados.

Se activar Enviar dados comuns, a Data Tag irá enviar page_location, page_path, page_hostname, page_referrer, page_title, page_encoding, screen_resolution, viewport_size.

Dentro do separador de dados do eventos, pode adicionar o parâmetro de evento personalizado que deseje enviar para o contentor do servidor. Pode escolher qualquer variável do gestor de etiquetas web ou digitar valor estático ou texto dentro dos campos Nome e Valor. Há também uma opção para modificar valores com funções Trim ou To lower case. No exemplo na captura de ecrã, enviei texto clicado da web para o contentor do servidor alterado com a função de minúsculas (lowercase function).

Com a ajuda dos Dados de Utilizador (User Data), pode enviar parâmetros de utilizador. É necessário seleccionar o nome do parâmetro no menu pendente, adicionar um valor estático, ou utilizar a variável. Há também uma opção para transformar o valor com as funções trim ou to lowercase. Pode usar estes campos para enviar dados de utilizador para a etiqueta do Facebook do servidor para aumentar a correspondência de eventos para a sua API de conversões do Facebook. Se estiver a utilizar o nosso Data Tag, Data Client, e a API de conversões do Facebook, então a etiqueta do Facebook irá automaticamente recolher os dados do utilizador da Data Tag.

Dentro da secção Definições, pode alterar o tipo de pedido (por defeito, o tipo de pedido é POST, alterá-lo para GET), caminho e as versões do protocolo.

As definições avançadas são definições padrão que tem dentro de todas as etiquetas web do Gestor de etiquetas da Google.

Vantagens da Data TagCopiar link para esta secção

Por enquanto, existem duas formas de enviar dados da web para o contentor do servidor: usando a etiqueta da GA4 e a Data Tag/Data Client. A Data Tag/Data Client têm várias vantagens sobre o GA4:

1. A Data Tag pode enviar matrizes (arrays) de dados. Em comparação, a etiqueta da GA4 só pode enviar variáveis e retorna um erro se tentar enviar uma matriz (array).

2. Com a ajuda do Data Tag/Data Client, é possível enviar toda a informação da camada de dados da Web para dados de eventos dentro do contentor do Servidor. Enquanto estiver no GA4, terá de enviar cada variável manualmente.

3. Se quiser armazenar dados do utilizador nas variáveis do GTM, então use o Data Tag. Por exemplo, pode ser usada quando as submissões do formulário tem dados de utilizador disponíveis ao clicar no botão, mas não nas páginas de agradecimento. Demonstrarei mais tarde como esta função funciona na secção de Casos de Utilização de Data Tag.

4. Data Tag/Data Client permite a transformação de dados. Por exemplo, dados com hash, minúsculas (lowercase), trim.

Como enviar dados da Web para o contentor do servidor usando Data Tag/Data ClientCopiar link para esta secção

Mostrarei como utilizar o Data Tag/Data Client para o evento de compra. Esta lógica de usar Data Tag/Data Client é a mesma para todos os eventos.

1.  Descarregue Data Tag a partir do GitHub  -> Abra o separador de Modelos dentro do contentor Web -> Clique em Novo -> Clique em três pontos no canto superior direito -> Importar -> Clique em Guardar.

2.  Descarregue o Data Client a partir do GitHub -> Abra o separador de Modelos dentro do contentor do Servidor -> Clique em Novo sob a secção de Clientes -> Clique em três pontos no canto superior direito -> Importar -> Clique em Guardar.

3. Abra contentor Web -> Criar nova etiqueta -> Tag Type Data para o lado do servidor do GTM -> Seleccionar nome do evento -> Adicionar URL do lado do servidor do GTM -> Cabeçalho HTTP de pré-visualização do servidor do GTM. É necessário adicionar um cabeçalho de pré-visualização para ver os pedidos de Data Tag dentro do contentor do servidor. Pode encontrá-lo clicando nos três pontos no canto superior direito do modo de pré-visualização do contentor do Servidor do Gestor de Etiquetas da Google e escolha a opção "Enviar pedidos manualmente" -> Adicionar dados de evento (tais como nome do produto, SKU, ID, etc.) -> Adicionar Dados de Utilizador.

tag configuration

4. Seleccione o acionador para o evento e clique em guardar.

5. Abra o contentor do servidor -> Abrir cliente -> Adicionar novo cliente -> Tipo de cliente Request Data para Event Data -> Clicar em Guardar. Publique o contentor do Servidor.

6.  Abra o modo de pré-visualização dos contentores da web e do servidor e verifique se o contentor do servidor vê a informação da Data Tag. Se não vir os pedidos de Data Tag, actualize o cabeçalho HTTP de pré-visualização do Servidor do GTM.

output of gtm

Casos de utilização de Data TagCopiar link para esta secção

1. Camadas de dados do contentor da web para o contentor do servidor.Copiar link para esta secção

O primeiro caso de utilização que me ocorre é o envio de uma camada de dados do contentor web para o servidor. Com a ajuda destes dados, pode adicionar parâmetros adicionais às suas etiquetas do lado do servidor. Na imagem abaixo, utilizei estas definições para enviar a camada de dados para o contentor do servidor:

Evento personalizado: {{event}}

Activado enviar tudo a partir da camada de dados

Activado enviar dados comuns

Esta data tag aciona quando um utilizador passa pelo processo de checkout no site.

tag configuration

Se eu for ao modo de pré-visualização dos contentores da web e do servidor, posso ver que a Data Tag acionou três vezes no contentor da web, e o Data Client recebeu e processou os três eventos dentro do contentor do servidor. Se eu clicar no nome do evento e verificar request_data, posso ver todos os parâmetros da camada de dados da web.

2. Envio de dados de utilizador para o API de conversões do Facebook.Copiar link para esta secção

Digamos que quer enviar dados do utilizador como o nome próprio, apelido, ou e-mail para a API de Conversões do Facebook para aumentar a qualidade da sua correspondência de eventos. Pode usar a Data Tag para isso. E se estiver a utilizar a nossa etiqueta para configurar uma etiqueta da API de conversões do Facebook, a etiqueta da FB irá capturar automaticamente os dados do utilizador a partir da Data Tag.

Queria enviar o e-mail do utilizador, nome próprio e apelido juntamente com os eventos de checkout nos exemplos abaixo. Adicionei os dados do utilizador à Data Tag no contentor Web do Gestor de etiquetas da Google. Estou a utilizar parâmetros estáticos para o teste, mas é possível passar estes parâmetros de forma dinâmica, utilizando variáveis. A nossa etiqueta do Facebook captura automaticamente os parâmetros de utilizador a partir do Data Client e envia informação com hash para o Facebook.

tag configuration

Para verificar mais uma vez se o Facebook recebeu estes parâmetros, pode adicionar o ID de teste do Facebook à etiqueta do servidor do Facebook e verificar quais os parâmetros que o Facebook vê na ferramenta de teste do gestor de eventos.

3. Enviar dados personalizados a partir do contentor Web para quaisquer outros servidores.Copiar link para esta secção

Pode enviar dados do contentor web do Gestor de Etiquetas da Google para o seu CRM, Slack, webhooks, etc. Este exemplo mostra-lhe como enviar informação sobre uma nova compra no seu site para o canal Slack.

1. Certifique-se de que envia a informação correcta a partir do contentor web do Gestor de Etiquetas da Google usando a Data Tag.

3. Dentro do contentor do servidor, crie uma nova etiqueta e escolha o tipo de etiqueta HTTP Request.

4. No URL de destino, adicione o URL que gerou em Slack.

5. Método de HTTP POST.

6. No Request body, adicione texto e parâmetros que deseja enviar para Slack.

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

4. Armazenar dadosCopiar link para esta secção

Se trabalha com o Gestor de etiquetas da Google com bastante frequência, então houve um tempo em que a camada de dados (ou qualquer outra variável) teve de ser transmitida de uma página do seu site para outra.

Infelizmente, o Gestor de Etiquetas do Google não tem a opção de armazenar dados e passá-los entre páginas do site. Por exemplo, é possível enviar um e-mail de utilizador apenas quando este existir na página. Mas e se os dados do utilizador não estiverem disponíveis na página de agradecimento, e só puderem ser capturados a partir da página antes da página de agradecimento?

Usando data tag, pode armazenar quaisquer variáveis que queira passar para outras páginas.

Como exemplo, utilizarei uma avaliação construída com Instapage. Precisávamos de configurar um evento de lead para a API de conversões do Facebook. Ao submeter a avaliação, o utilizador tinha de introduzir detalhes como e-mail, número de telefone, nome próprio, etc. Esta informação do utilizador estava disponível nas páginas de avaliação, mas não na página de agradecimento.

Para ter um alto índice de qualidade de correspondência de eventos no Facebook, deve enviar parâmetros de utilizador juntamente com o evento da API de conversões. Foi por isso que utilizei a Data Tag para armazenar os dados dos utilizadores no armazenamento local. Criei uma aplicação Submit Data Tag que retira parâmetros de utilizador da camada de dados e os armazena no Armazenamento Local. Esta etiqueta aciona quando um utilizador clica no botão submeter avaliação.

Para activar o armazenamento de dados no Data Tag, seleccione a opção de armazenamento ao lado dos dados que pretende armazenar.

Depois, adicionei um novo tipo de variável no contentor web (pode descarregá-la usando este link).  Crie novas variáveis para todos os dados que armazenou.

E finalmente, criei o Lead Data Tag que envia os dados armazenados para o contentor do servidor.

Problemas comuns com Data Tag e Data ClientCopiar link para esta secção

Se não puder ver os pedidos de Data Tag dentro do contentor do servidor, isso pode acontecer devido às seguintes razões:

1.  Cabeçalho de pré-visualização errado. Abra o modo de pré-visualização do contentor do servidor -> Clique em três pontos na parte superior direita -> Clique em enviar pedidos manualmente -> Copie o cabeçalho HTTP X-Gtm-Server-Preview -> Abra o contentor Web e actualize o cabeçalho HTTP de pré-visualização do servidor do GTM que utiliza dentro do contentor do servidor.

2. O Data Client não é publicado. Abra o contentor do servidor e publique Data Client.

3. Altere o POST para GET. Abra a consola e verifique se tem algum erro. Em seguida, abra a rede e digite os dados. Se vir erros, abra a Data Tag e mude o Request type de POST para GET.

ConclusãoCopiar link para esta secção

Data Tag e Data Client darão uma sólida fonte de informação para fornecer às etiquetas que utiliza dentro do contentor do servidor. Com a ajuda desta etiqueta, poderá avançar mais rapidamente na implementação de novas tecnologias de rastreamento do lado do servidor. Esta etiqueta poupará tempo e custos tanto para TI como para o marketing - uma clara vantagem para todos!

Aloje o seu servidor GTM no Stape

Ao se inscrever, você concorda com os Termos e Condições e a Política de Privacidade de Stape