A seguir, explicaremos como integrar o Google Tag Manager com o Privacy Controls and Cookie Solution da iubenda para a CCPA, o GDPR e o consentimento por categoria.
O uso do Google Tag Manager é recomendado, pois simplifica significativamente a adoção dos requisitos da Lei dos Cookies. No entanto, só é eficaz para scripts que não são “posicionais”. Os scripts “não posicionais” são todos os scripts que não visualizam um elemento específico em um determinado local da página. Resumindo, você pode usar essa solução para todas as ferramentas de análise, mas não para banners do AdSense, vídeos do Youtube, botões sociais ou qualquer tipo de widgets.
Verifique a documentação oficial do Google para obter mais informações sobre o Google Tag Manager. Dito isso, começaremos o tutorial!
Para começar com o Gerenciador de tags do Google, você precisará criar uma conta gratuita e configurar um contêiner.
Após a criação do contêiner, podemos avançar para a criação da tag. É importante repetir que a tag corresponde ao script que só será ativado de acordo com determinadas regras que, neste caso, é o consentimento do usuário para o uso de cookies.
A tag que criaremos é relativa ao ao Google Analytics 4:
Clique na janela Tag configuration conforme imagem abaixo:
Em seguida, insira seu ID de rastreamento do Google Analytics (ex.: G-A2ABC2ABCD) e salve.
Agora, você pode configurar as regras para a ativação da tag. Vamos ver como fazer isso.
Após preencher os parâmetros acima, é preciso definir os acionadores (as regras que permitirão o disparo dos scripts):
iubenda_consent_given ou, se você ativou o recurso de consentimento por categoria no seu Privacy Controls and Cookie Solution, iubenda_consent_given_purpose_1...5iubenda_preference_not_needediubenda_ccpa_opted_outSe você estiver implementando o Google Consent Mode, pule esta etapa e vá direto para a instalação.
Clique na seção “Triggering” abaixo:
e clique no sinal de mais, no canto superior direito, para adicionar um novo acionador. Na janela de configuração do acionador, selecione Custom Event (nota: certifique-se de NÃO selecionar “All Pages” como acionador).
Para o nome do evento, insira o seguinte valor: iubenda_consent_given. Isso ativará o acionador em All Custom Events identificados como Consent Given.
Salve o acionador clicando em Save:
Se você ativou o recurso de consentimento por categoria no seu Privacy Controls and Cookie Solution, no lugar do evento iubenda_consent_given, você precisará criar um evento personalizado para cada finalidade exibida em seu banner/política de cookies (com exceção da finalidade “necessários”).
Se você não souber a qual finalidade/categoria os serviços executados em seu site pertencem, você pode consultar os subtítulos aos quais eles se enquadram na sua política de cookies da iubenda.
Estes são as 5 finalidades (e os valores de eventos personalizados):
iubenda_consent_given_purpose_2)iubenda_consent_given_purpose_3)iubenda_consent_given_purpose_4)iubenda_consent_given_purpose_5)Como o Google Analytics faz parte da categoria “Medição” incluída na finalidade “Medição”, você terá que criar um evento personalizado com o seguinte valor: iubenda_consent_given_purpose_4. Isso ativará o acionador em All Custom Events identificados como Consent Given Purpose 4.
Feito isso, salve o acionador como de costume.
Use o mesmo procedimento para criar outro evento personalizado chamado iubenda_preference_not_needed, invocado sempre que uma preferência não for necessária (por exemplo, quando gdprApplies:false, ou gdprAppliesGlobally:false, countryDetection:true e o usuário estiver localizado fora da UE):
Se a CCPA se aplicar a você e, como neste caso, a tag/serviço for considerada uma venda, ela deve ser desativada quando o usuário optar por sair. Para tanto, você terá que criar uma exceção chamada iubenda_ccpa_opted_out.
Antes de criar este evento, você terá que definir um filtro para ele. Clique em Variables e, depois, em New (ao lado de User-Defined Variables). Nomeie como iubenda_ccpa_opted_out, clique na caixa Variable Configuration e selecione Data Layer Variable, use como iubenda_ccpa_opted_out como o Data Layer Variable Name e selecione Version 2 como Data Layer Version. Depois clique em Save.
Agora que você definiu a variável, crie um acionador chamado iubenda_ccpa_opted_out. Em Trigger Configuration:
.* como Event name e selecione Use regex matching;iubenda_ccpa_opted_out, equals e true
e clique em Save.
Ao final, sua tag do Google Analytics: GA4 Configuration ficará assim:
Clique em Save para salvar a tag.
Não há qualquer problema em adicionar os acionadores iubenda_consent_given e iubenda_consent_given_purpose_4, ainda que você não use o recurso de consentimento por categoria. A definição de ambos evitará que você precise editar todas as suas tags, caso decida ativar esse recurso no futuro.
Ao estabelecer esta regra, o Google Tag Manager ativará a tag do Google Analytics, criada acima, apenas quando as regras forem verdadeiras. Isso significa que ele será disparado sempre que o Google Tag Manager receber um evento com o valor iubenda_consent_given ou iubenda_consent_given_purpose_4 ou iubenda_preference_not_needed.
dataLayer em todos os contêineres, conforme explicado aqui.Para instalar o Google Tag Manager, acesse a conta de administrador do GTM, copie o código que o Google fornece e insira-o em todas as páginas do seu site, conforme as instruções fornecidas. Se você estiver usando um CMS, que extrai o cabeçalho de uma página de modelo de cabeçalho (por exemplo, header.php), basta colá-lo nesse arquivo.
Observação: você precisará remover seu próprio código do Google Analytics.
O Google Analytics apenas será ativado automaticamente pelo script do Google Tag Manager após o consentimento do usuário/visitante para o uso de cookies.
Acesse o dashboard da iubenda > [seu site] > Privacy Controls and Cookie Solution, clique no botão Integrar para acessar a seção de incorporação:
e extraia o código para o seu banner de cookie (se você ainda não ativou o Privacy Controls and Cookie Solution, basta clicar em Ativar, configurar e ir para a seção de incorporação para extrair o código conforme descrito).
Seu código ficará mais ou menos assim:
<script type="text/javascript">
var _iub = _iub || [];
_iub.csConfiguration = {
"lang": "en",
"siteId": XXXXXX, //use your siteId
"cookiePolicyId": YYYYYY, //use your cookiePolicyId
"banner": {
"position": "float-top-center",
"acceptButtonDisplay": true,
"customizeButtonDisplay": true
}
};
</script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>Ele deve ser editado da seguinte forma:
<script type="text/javascript">
var _iub = _iub || [];
_iub.csConfiguration = {
"lang": "en",
"siteId": XXXXXX, //use your siteId
"cookiePolicyId": YYYYYY, //use your cookiePolicyId
"banner": {
"position": "float-top-center",
"acceptButtonDisplay": true,
"customizeButtonDisplay": true
},
"callback": {
onPreferenceExpressedOrNotNeeded: function(preference) {
dataLayer.push({
iubenda_ccpa_opted_out: _iub.cs.api.isCcpaOptedOut()
});
if (!preference) {
dataLayer.push({
event: "iubenda_preference_not_needed"
});
} else {
if (preference.consent === true) {
dataLayer.push({
event: "iubenda_consent_given"
});
} else if (preference.consent === false) {
dataLayer.push({
event: "iubenda_consent_rejected"
});
} else if (preference.purposes) {
for (var purposeId in preference.purposes) {
if (preference.purposes[purposeId]) {
dataLayer.push({
event: "iubenda_consent_given_purpose_" + purposeId
});
}
}
}
}
}
}
};
</script>
<script type="text/javascript" src="//cdn.iubenda.com/cs/iubenda_cs.js" charset="UTF-8" async></script>Por isso, adicionamos um callback que, no momento em que o consentimento é dado pelo usuário, convoca o código do Google Tag Manager para desbloquear o evento configurado e ativar o do Google Analytics.
Agora que o código está adaptado para a integração com o Google Tag Manager, vamos incluí-lo em nossas páginas antes do fechamento da tag BODY.
Se estiver tudo pronto, siga diretamente para Publicar, caso contrário, continue lendo a Configuração avançada (essas configurações permitem acelerar a ativação das tags, disparar tags apenas em páginas específicas e definir vários tipos de rastreamento na mesma página por meio da inclusão de parâmetros adicionais à sua configuração do GTM).
Nesta seção, usaremos “Variáveis” e “Exceções de acionadores” para sermos mais específicos. O Google Tag Manager permite que variáveis sejam criadas e exceções sejam definidas nas condições de acionamento da tag.
Você pode pensar nessas exceções como “acionadores de bloqueio”. Por exemplo, se você quiser que sua tag do Google Analytics seja disparada apenas na página do carrinho de compras, pode definir uma exceção à regra de disparo que dispõe que a tag não dispara em nenhuma página que não seja a página do seu carrinho de compras. A definição dessa exceção bloqueia o disparo da tag em outras páginas além da página do carrinho de compras. Da mesma forma, você pode definir um acionador para disparar apenas se as condições relacionadas a uma determinada variável forem atendidas.
Dessa forma, tanto as variáveis quanto as exceções permitirão maior flexibilidade no gerenciamento de tags (veja aqui o que o Google fala sobre exceções e aqui o que ele fala sobre variáveis).
Conforme acima mencionado, se você quiser apenas que sua tag do Google Analytics seja disparada na página do seu carrinho de compras, você pode definir uma exceção à regra de disparo estabelecendo que a tag não será disparada em outra página além da página do seu carrinho de compras. Você deve fazer da seguinte forma:
Crie uma variável URL da página (clique em “Variables” no painel esquerdo e em “New Variable”). Em seguida, clique na caixa de configuração da variável para escolher o tipo de variável e selecione URL.
Agora clique em salvar e nomeie a variável com um nome relacionado à página em que você deseja que a tag seja disparada. No exemplo, nomeamos a variável como “Carrinho de compras”.
Em seguida, crie o novo acionador de bloqueio ou Exceção que gostaria de adicionar (clique em “Triggers” no painel esquerdo e depois em “New”). Tente colocar em sua exceção um nome relevante. Neste exemplo, nomeamos como: “NÃO é um carrinho de compras”
Em seguida, clique na caixa de configuração do acionador para escolher o tipo de acionador, neste exemplo, “Page View”.
Clique em salvar
Por fim, volte para sua tag e, além do ativador “consentimento da iubenda concedido”, você também precisa associar a exceção que acabamos de criar. Isso pode ser feito clicando no lápis na seção “Triggering”,
em seguida, clique no link “Add Exception” que irá aparecer.
Em seguida, selecione a exceção que acabamos de criar, salve e pronto! Agora a tag só será disparada depois que o consentimento para os cookies for obtido (conforme exigido por lei), mas não será disparada em páginas que não sejam sua página “Carrinho de compras”.
Se você quiser rastrear mais de um evento na mesma página (por exemplo, rastreamento de visualizações de página e de envio de um formulário de compra), você precisará criar as tags adicionais e especificar o tipo diverso de rastreamento. Embora seja simples configurar vários tipos de rastreamento no Tag Manager, para cumprir a lei, você deve se certificar de que os outros eventos de acionamento ocorrem somente após receber o consentimento. Veja como fazer:
Para este exemplo, suponhamos que, além de rastrear visualizações de página no Google Analytics (conforme definido na tag que criamos na primeira seção), você também queira rastrear as transações.
Para tanto, precisaremos criar outra tag do Google Analytics, definir o tipo de rastreamento como “Transaction” e salvar (você pode dar um nome descritivo como “Universal Analytics Transactions”).
Em seguida, crie uma variável de cookies próprios (clique em “Variables” no painel esquerdo e adicione uma nova variável personalizada)
Clique no botão “Save” e nomeie de forma parecida com “Cookieiubenda”
Em seguida, crie o novo acionador que deseja adicionar: por exemplo. “Purchase Made”; digite “Form submission”.
If you’ve set perPurposeConsent to true, the “Cookieiubenda” variable will not contain the value “consent”:true, but the values referred to the single accepted purposes (i.e. “1”:true, “2”:true, “3”:true, “4”:true etc). Adaptar as etapas sugeridas desta forma.
Por fim, volte para sua tag “Universal Analytics Transaction” e associe o acionador que acabamos de criar. Você pode fazer isso clicando na seção “Triggering” e selecionando o acionador “Purchase Made” que acabamos de criar.
Salve e pronto!
Nota: se você quiser que o rastreamento da transação ocorra apenas em uma página (por exemplo, na página do carrinho de compras), veja o tutorial sobre como fazer isso no tutorial na primeira aba desta seção.
É possível ativar as tags de forma mais rápida, modificando dois parâmetros adicionais no GTM, como:
Crie uma variável de cookies próprios (clique em “Variables” no painel esquerdo e adicione uma nova variável personalizada)
Em seguida, crie um novo acionador: “Cookie Law not accepted”; tipo “Page View”, este novo acionador permitirá que a presença do cookie da iubenda seja tratada como uma exceção:
Por fim, volte para sua tag e, além do ativador “consentimento da iubenda concedido”, você também precisa associar a exceção que acabamos de criar. Isso pode ser feito clicando no lápis na seção “Triggering”,
em seguida, clique no link “Add Exception” que irá aparecer. Agora selecione o acionador que acabamos de criar e salve.
Ao implementar esta configuração avançada, lembre-se de que, se o cookiePolicyId for modificado, a modificação também deve ser aplicada na configuração. Para uma configuração correta, não é necessário nem vantajoso incluir o código da iubenda através do GTM.
Fonte: tagmanageritalia.it/guida-base-gestire-la-cookie-law-di-iubenda-con-google-tag-manager
Se você foi direto para a Seção Avançada logo após criar e configurar sua Tag e seus Acionadores, certifique-se de instalar o Google Tag Manager em seu site e instalar o script iubenda ANTES de continuar na seção de publicação abaixo.
Após configurar as regras, você precisará publicar o contêiner para realizar as modificações EM TEMPO REAL em seu site:
Para isso, clique no botão SUBMIT, no lado superior direito da página de visão geral do contêiner, e, em seguida, confirme.
Esses exemplos podem ser reutilizados para qualquer outro script ou função JavaScript.