Categorias
Blog Google Tag Manager

Implementar pixel/tag de conversão no formulário do WIX com o Google Tag Manager


[fusion_builder_container hundred_percent=”no” hundred_percent_height=”no” hundred_percent_height_scroll=”no” hundred_percent_height_center_content=”yes” equal_height_columns=”no” menu_anchor=”” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” status=”published” publish_date=”” class=”” id=”” background_color=”” background_image=”” background_position=”center center” background_repeat=”no-repeat” fade=”no” background_parallax=”none” enable_mobile=”no” parallax_speed=”0.3″ video_mp4=”” video_webm=”” video_ogv=”” video_url=”” video_aspect_ratio=”16:9″ video_loop=”yes” video_mute=”yes” video_preview_image=”” border_size=”” border_color=”” border_style=”solid” margin_top=”” margin_bottom=”” padding_top=”” padding_right=”” padding_bottom=”” padding_left=””][fusion_builder_row][fusion_builder_column type=”1_1″ layout=”1_1″ spacing=”” center_content=”no” link=”” target=”_self” min_height=”” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” background_image_id=”” background_color=”” background_image=”” background_position=”left top” undefined=”” background_repeat=”no-repeat” hover_type=”none” border_size=”0″ border_color=”” border_style=”solid” border_position=”all” border_radius_top_left=”” border_radius_top_right=”” border_radius_bottom_left=”” border_radius_bottom_right=”” box_shadow=”no” box_shadow_vertical=”” box_shadow_horizontal=”” box_shadow_blur=”0″ box_shadow_spread=”0″ box_shadow_color=”” box_shadow_style=”” padding_top=”” padding_right=”” padding_bottom=”” padding_left=”” margin_top=”” margin_bottom=”” animation_type=”” animation_direction=”left” animation_speed=”0.3″ animation_offset=”” last=”no”][fusion_text columns=”” column_min_width=”” column_spacing=”” rule_style=”default” rule_size=”” rule_color=”” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=””]

Para fazer o tutorial você precisa ter implementado o Google Tag Manager no seu site, se você não sabe como implementar, clique aqui e siga as instruções!

WIX forms é outro elemento importante do website que os webmasters e os profissionais de marketing estão dispostos a acompanhar. Eles geralmente significam conversões micro ou macro para empresas. Assinaturas de boletim informativo, envios de formulários, etc. Todos eles devem ser rastreados a fim de obter uma melhor compreensão de onde os conversores estão vindo.


Eu não tentei todos os plug-ins do WIX form, mas percebi que os padrões estão realmente enviando formulários para a Data Layer (o que é bom!). Quando você enviar o formulário no seu site WIX, verifique o modo Preview and Debug. Algum evento apareceu? Se você tiver ativado a integração integrada do GTM, poderá ver um evento chamado lead.

enviando formulario ao site wix

Então, se esse também for seu caso, tudo o que você precisa fazer agora é criar um Custom Event Trigger no GTM que capture esse evento lead e você poderá usá-lo como uma condição de acionamento de tag (acionador).

custom lead criando evento

Em seguida, atribua esse acionador à tag que você deseja disparar (pode ser a tag GA Event, a tag de conversão do Google Ads ou qualquer outra coisa).

Se você não ativou o recurso integrado do WIX do GTM (talvez não funcione para você), há outras opções também. O acompanhamento de formulários não é fácil se você está começando com o GTM. Existem vários tipos de formulários on-line, portanto, diferentes métodos de rastreamento. 

[/fusion_text][/fusion_builder_column][/fusion_builder_row][/fusion_builder_container]


Categorias
Blog Google Tag Manager

Como implementar o Google Tag Manager em um website da Wix


[fusion_builder_container hundred_percent=”no” hundred_percent_height=”no” hundred_percent_height_scroll=”no” hundred_percent_height_center_content=”yes” equal_height_columns=”no” menu_anchor=”” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” status=”published” publish_date=”” class=”” id=”” background_color=”” background_image=”” background_position=”center center” background_repeat=”no-repeat” fade=”no” background_parallax=”none” enable_mobile=”no” parallax_speed=”0.3″ video_mp4=”” video_webm=”” video_ogv=”” video_url=”” video_aspect_ratio=”16:9″ video_loop=”yes” video_mute=”yes” video_preview_image=”” border_size=”” border_color=”” border_style=”solid” margin_top=”” margin_bottom=”” padding_top=”” padding_right=”” padding_bottom=”” padding_left=””][fusion_builder_row][fusion_builder_column type=”1_1″ layout=”1_1″ spacing=”” center_content=”no” link=”” target=”_self” min_height=”” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” background_image_id=”” background_color=”” background_image=”” background_position=”left top” undefined=”” background_repeat=”no-repeat” hover_type=”none” border_size=”0″ border_color=”” border_style=”solid” border_position=”all” border_radius_top_left=”” border_radius_top_right=”” border_radius_bottom_left=”” border_radius_bottom_right=”” box_shadow=”no” box_shadow_vertical=”” box_shadow_horizontal=”” box_shadow_blur=”0″ box_shadow_spread=”0″ box_shadow_color=”” box_shadow_style=”” padding_top=”” padding_right=”” padding_bottom=”” padding_left=”” margin_top=”” margin_bottom=”” animation_type=”” animation_direction=”left” animation_speed=”0.3″ animation_offset=”” last=”no”][fusion_text columns=”” column_min_width=”” column_spacing=”” rule_style=”default” rule_size=”” rule_color=”” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=””]

O WIX é um dos construtores de sites mais populares que se posiciona como “fácil de usar” e “permite construir sites lindos”. Mesmo que tais construtores tirem muita flexibilidade de você (especialmente quando se trata de modificações relacionadas a SEO – Mecanismo de busca do Google – ou GTMGoogle Tag Manager), sua popularidade ainda é sólida.

Os proprietários desses sites perceberam que poderiam acompanhar o que seus visitantes faziam, com Google Tag Manager e o Google Analytics, sendo essas ferramentas as primeiras a serem consideradas para esse acompanhamento. 


Há pouco mais de um ano (início de 2018), o WIX adicionou suporte ao Google Tag Manager (o que significa que você pode realmente implementar seu código e usar a ferramenta para o melhor possível, controlando tags de marketing e acionando quando realmente precisa). No entanto, ainda existem algumas nuances que as pessoas enfrentam e decidi abordá-las neste post.

Então, se você quiser acompanhar o website do WIX com o Google Tag Manager, continue lendo.

Contexto Rápido

Algum tempo atrás (em 2017 e antes disso), os widgets HTML personalizados do WIX não funcionavam adequadamente com o código do contêiner do GTM. E essa abordagem ainda não funciona. A única maneira de ativar o Google Analytics Tracking (acompanhamento do GA) era acessar uma seção dedicada do Google Analytics e adicionar o código de acompanhamento do GA.

Mas e se eu quisesse rastrear determinados cliques ou outras interações que acontecem em um site? Normalmente, o GTM era a ferramenta que poderia fazer isso. Bem, isso é muito ruim porque o WIX não se importava muito com isso e os fãs do GTM (usuários do WIX) estavam chorando no canto (ou talvez até mesmo mudando para outro criador de sites).

Felizmente, esse tempo acabou e o GTM pode ser instalado rapidamente.

Instale o Google Tag Manager em um site do WIX 

Em primeiro lugar, esse recurso está disponível apenas para planos pagos do WIX. Se você ainda está usando o plano gratuito, desculpe, não há solução alternativa. Você precisará atualizar ou ficar apenas com visualizações de página regulares. Se você estiver em um plano premium, continue lendo. Além disso, você deve ter um domínio conectado ao site. Caso contrário, a opção de integração do GTM não estará disponível.

Entre na sua conta WIX e escolha o site onde você deseja instalar o GTM, clique em Edit site.

adicionando codigo no wix

Então você será redirecionado para o Editor do WIX (a.k.a. ADI). No canto superior direito, clique em Site e escolha Settings.

Settings site wix

Em seguida, na barra lateral esquerda, acesse Tracking & Analytics.

editando wix para GTM

Por fim, no canto superior direito, clique em New Tool > Google Tag Manager.

Selecionando GTM

Insira o ID do seu contêiner do GTM (por exemplo, GTM-XXXXXXX) e clique em Apply. O snippet de código do contêiner do Google Tag Manager será adicionado a todas as páginas de um website do WIX. Você pode encontrar o ID do contêiner do GTM na barra superior da conta do Google Tag Manager:

codigo do container

Teste o Google Tag Manager no WIX

Agora, vamos testar se o contêiner do Google Tag Manager foi adicionado corretamente. Ative o modo Preview e Debug (pressionando o botão Preview no GTM), acesse o site em que você está trabalhando (a parte pública) e atualize a página. Uma janela do console de depuração aparecerá na parte inferior do navegador, mostrando informações detalhadas sobre as tags, incluindo o status de disparo e os dados que estão sendo processados.

Testando container GTM e WIX

Não vê isso? Continue lendo.

IMPORTANTE! Se você não vir o modo de visualização e depuração no WIX

Embora eu tenha conseguido adicionar o ID do contêiner do GTM (assim como descrevi acima), o contêiner do Google Tag Manager não foi mais carregado em uma página. A integração direta do Google Analytics estava funcionando bem, mas não o GTM.

Portanto, se essa situação também se aplicar a você, faça o seguinte.

#1. Diagnostique se o contêiner do GTM está carregado. Depois de adicionar o ID do contêiner às configurações do WIX, publique o website. Em seguida, acesse a seção pública de seu website (quero dizer, abra seu website como visitante) e abra as ferramentas de desenvolvedor do navegador (no Windows, você pode fazer isso pressionando F12). Vá até a guia Network e digite gtm.js no campo de pesquisa. Recarregue a página. A pesquisa retornou algo que contenha “gtm.js”? Se sim, isso significa que você tem algum outro problema. Leia este guia para encontrar uma solução.

Diagnostico do container do GTMNo entanto, se a pesquisa não retornou o gtm.js, isso significa que o contêiner do Google Tag Manager não foi adicionado ao seu website. Este é o caso exato aplicado a mim. Qual é a solução?

# 2. Substitua a integração integrada do GTM com a personalizada. Vá para analytics settings do WIX e desative a integração com o GTM.

desativando manager no wix

Em seguida, no canto superior direito, clique em New Tool > Custom e insira as seguintes configurações (no primeiro campo, você deve colar os primeiros (de dois) snippets de código do contêiner do Google Tag Manager (que estão entre as tags de script):

Configurando wix com gtm

Esta é uma solução alternativa que funcionou para mim. Talvez funcione para você também.

Mas espere, tem mais. O acompanhamento de exibição de página regular não funciona no WIX

Então aqui está a situação. Você deseja começar a acompanhar as pageviews com o Google Analytics por meio do Google Tag Manager. Você cria uma tag de Pageview, configura-a para ser acionar em todas as páginas, atualiza o modo de visualização e atualiza o site do WIX. A tag Pageview foi acionada com sucesso e você também a vê nos relatórios em tempo real do GA.

Ótimo!

No entanto, quando você continuar navegando em seu website, começará a perceber que nenhuma das page views subsequentes é exibida nos relatórios GA em tempo real (e, claro, a tag Universal Analytics nunca é acionada novamente, a menos que você atualize completamente a página). E isso sempre acontece assim: a primeira page view é rastreada, todas as subsequentes: não.

Por quê? Porque os sites WIX são codificados como aplicativos de página única. Mesmo parecendo que as páginas estão sendo recarregadas enquanto você navega, isso é apenas uma ilusão. Na verdade, quando você carrega inicialmente a página, o site inteiro (ou pelo menos o grande pedaço dele) é carregado imediatamente. Quando você está navegando no site, o WIX está mudando dinamicamente a exibição e imita o carregamento das páginas.

Isso significa que o snippet de contêiner do Google Tag Manager também é carregado apenas uma vez, portanto, apenas o primeiro carregamento (pageview) é rastreado. Como isso pode ser resolvido? Felizmente, o WIX está enviando eventos de page view toda vez que um visitante navega da seção A para a seção B. Esses dados são enviados para a Data Layer. Tudo o que você precisa fazer é capturar seus eventos de pageview da Data Layer e usá-los para disparar as tags de page view do Universal Analytics (ou o Facebook Pixel ou qualquer outra coisa). Aqui está um exemplo:

Como você pode ver na captura de tela acima, há duas Pageviews no fluxo de eventos. Quanto mais páginas você navegar, mais desses eventos você verá. A primeira Page View é gerada pelo próprio contêiner do GTM. O segundo evento Pageview (sem um espaço no título) é enviado pelo próprio WIX.

Então, como vamos acompanhar as page views no WIX?

Como o WIX envia automaticamente eventos de page view personalizados para a Data Layer sempre que um visitante navega para uma nova página, precisamos pegá-los, transformá-los em disparadores e usá-los para despachar nossa Google Analytics Pageview Tag.

Se você quiser transformar um determinado evento da Data Layer em um acionador, será necessário criar um Custom Event Trigger – disparador de evento personalizado. No seu contêiner do GTM, acesse Triggers > New > Custom Event. Digite Pageview (porque é o nome exato do evento que você viu na captura de tela do Preview&Debug Console’s acima). Nota: este campo faz distinção entre maiúsculas e minúsculas, portanto, certifique-se de digitar o caractere ‘P’ em maiúsculo.

Criando um custom eventAdicione o Custom Event Trigger à tag Google Analytics Pageview 

Na próxima etapa, você precisa atualizar sua tag GA pageview no Google Tag Manager. Antes de ler este guia, era mais provável que sua tag GA Pageview já tivesse acionado All Pages. Desta vez, adicione o acionador adicional que criamos neste guia, Custom Event Trigger.

adicionando um custom event a GA pageview tag

O que isso significa? Quando a página é inicialmente carregada, o acionador All Pages acionará sua tag GA Pageview. Quando um visitante continua navegando no site, o WIX enviará eventos da Pageview personalizados para a Data Layer, portanto, o Custom Event Trigger será ativado. Esse acionador disparará uma tag GA Page View e você verá esses dados nos relatórios GA Real-time.

comparacao de tag GA pageview

Testar pageviews

Depois de implementar todas as alterações descritas acima, atualize o modo Preview and Debug (P&D) no GTM, recarregue o site do WIX no qual você está trabalhando no momento. Comece a navegar. Você deve ver que a tag do GA Page View dispara com todos os eventos da Pageview personalizados no console P&D. Esse é o resultado que você deve esperar. Se a tag não disparar, certifique-se de inserir o nome do evento Pageview no Custom Event Trigger corretamente (com ‘P’ maiúsculo).

Na próxima etapa, acesse os relatórios do GA Real-time e verifique se as page views estão adequadamente rastreadas na seção Overview.

rastreamento de page view no overview

Como evitar problema de referência falsa

Como mencionei no início deste guia, os sites WIX se comportam como sites de página única (o que significa que eles não recarregam a página inteira à medida que um visitante navega de uma página para outra). Isso causa problemas com os dados de referência nos relatórios do GA, pois os dados se tornam imprecisos. Isso é especialmente prejudicial se você estiver recebendo tráfego pago (por exemplo, do Google Ads). 

Próxima parada: rastreamento de cliques

Se você deseja rastrear quais elementos estão sendo clicados mais, quais links estão afastando seus visitantes, etc., leia este guia. Aqui, eu expliquei o essencial que você precisa saber para rastrear cliques com o Google Tag Manager no seu site WIX.

Conclusão

Se você deseja acompanhar o website do WIX com o Google Tag Manager, precisa ter em mente várias nuances. Primeiro de tudo, você não pode simplesmente colar o snippet de código do contêiner do GTM no bloco de HTML personalizado no editor do WIX. Isso não vai funcionar. Em vez disso, você deve usar um recurso dedicado a isso (disponível nas configurações do site).

Além disso, os sites WIX são codificados como aplicativos de página única. Isso significa que, por padrão, somente a primeira pageview é rastreada. Todos as subsequentes não são. É por isso que você precisa fazer algumas modificações adicionais no contêiner do GTM para capturar também as “virtuais” page views.

Mas, além disso, o resto do rastreamento deve funcionar corretamente. A menos que você esteja esperando que um desenvolvedor envie alguns dados personalizados para a Data Layer. Eu realmente duvido que isso seja possível, mas, por outro lado, quando tive que trabalhar com sites WIX, eles eram relativamente pequenos e não havia necessidade de entrada do desenvolvedor.

Se você perceber que eu perdi algumas nuances importantes (porque talvez eu nunca tivesse enfrentado isso), me avise nos comentários.

[/fusion_text][/fusion_builder_column][/fusion_builder_row][/fusion_builder_container]


Categorias
Google Analytics Google Tag Manager

GTM – Como saber o que copiaram do seu site.


[fusion_builder_container hundred_percent=”no” hundred_percent_height=”no” hundred_percent_height_scroll=”no” hundred_percent_height_center_content=”yes” equal_height_columns=”no” menu_anchor=”” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” status=”published” publish_date=”” class=”” id=”” background_color=”” background_image=”” background_position=”center center” background_repeat=”no-repeat” fade=”no” background_parallax=”none” enable_mobile=”no” parallax_speed=”0.3″ video_mp4=”” video_webm=”” video_ogv=”” video_url=”” video_aspect_ratio=”16:9″ video_loop=”yes” video_mute=”yes” video_preview_image=”” border_size=”” border_color=”” border_style=”solid” margin_top=”” margin_bottom=”” padding_top=”” padding_right=”” padding_bottom=”” padding_left=””][fusion_builder_row][fusion_builder_column type=”1_1″ layout=”1_1″ spacing=”” center_content=”no” link=”” target=”_self” min_height=”” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=”” background_color=”” background_image=”” background_image_id=”” background_position=”left top” background_repeat=”no-repeat” hover_type=”none” border_size=”0″ border_color=”” border_style=”solid” border_position=”all” padding_top=”” padding_right=”” padding_bottom=”” padding_left=”” margin_top=”” margin_bottom=”” animation_type=”” animation_direction=”left” animation_speed=”0.3″ animation_offset=”” last=”no”][fusion_text columns=”” column_min_width=”” column_spacing=”” rule_style=”default” rule_size=”” rule_color=”” hide_on_mobile=”small-visibility,medium-visibility,large-visibility” class=”” id=””]

Ei gente, tudo bem?!

Os últimos artigos escritos foram sobre como implementar o disparado do Google Tag Manager no ContactForm7.


Agora vou escrever uma coisa que me pediram muito no inbox! Que tal você descobrir que parte estão copiando do seu site?

Isso pode te dar vários insights importantes, o blog pode saber qual assunto está sendo compartilhado indiretamente ou qual assunto está chamando atenção, já no ecommerce podemos saber os produtos que as pessoas estão compartilhando/procurando.

Basicamente vamos “salvar” tudo que a pessoa der ctrl c no seu site e mandar ele como evento para o seu Google Analytics (prepara que vai aparecer textão lá).

Esse script é bem simples e rápido! Vamos começar?

1. Implementando a tag

Vamos implementar uma tag que será disparada em todas as páginas. Ela vai criar um “Evento” no Google Tag Manager. Esse evento vamos usar para disparar o evento.

Descobrir o que copiam do meu site

Depois vamos em Criar Tag e HTML Personalizado.

Descobrir o que copiam do meu site

Dentro da Tag coloque a seguinte tag:

<script>
// Declare function to get selected text from document
function getSelectionText() {
var text = ”;
if (window.getSelection) {
text = window.getSelection().toString();
} else if (document.selection && document.selection.type != ‘Control’) {
text = document.selection.createRange().text;
}
return text;
}

// Declare function on copy event
document.addEventListener(‘copy’, function(e){
dataLayer.push({
‘event’: ‘textCopied’,
‘clipboardText’: getSelectionText(),
‘clipboardLength’: getSelectionText().length
});
});
</script>

Como disparador pode colocar a página que você quer que seja “rastreada”. Eu usei All pages pois quero em todas as páginas. Vai ficar assim:

Descobrir o que copiam do meu site

Se você entrar em modo Debug você vai conseguir ver o evento sendo criado na lateral esquerda.

Descobrir o que copiam do meu site

O texto que foi copiado foi enviado para o DataLayer.

Basicamente enviamos os dados para o DataLayer e agora vamos recuperar ele como variável. Essa variável vai ser enviado como evento para o Google Analytics.

Descobrir o que copiam do meu site

Shooooww! E agora, como recupero ela?

2. Criando variável do DataLayer

Vamos lá! Entre em Variáveis e clique em Nova.

Descobrir o que copiam do meu site

Descobrir o que copiam do meu site

Quando você for criar a nova variável, você tem que selecionar Variável da Camada de Dados (dataLayer).

Nele você pode escrever “clipboardText”, que é o nome do nosso dataLayer (tem a ilustração ali em cima). A variável vai ficar assim. (note o nome que dei pra ela também, vamos usar ele pra buscar a variável)

Descobrir o que copiam do meu site

3. Criando disparador

Já temos o script que cria o evento e me diz que alguém copiou, já temos a variável e só falta o disparado e a tag do Google Analytics. Vamos com o disparador primeiro, ok?

Vá em Acionadores e coloque para criar um Novo.

Descobrir o que copiam do meu site

Vamos usar o “Evento Personalizado”, pois o evento que criamos (textCopied) precisa ser nosso disparador.

Descobrir o que copiam do meu site

Coloque como nome do evento o “textCopied”. Ele vai sinalizar que sempre que o “textCopied” aparecer, a tag selecionada vai ser disparada.

Descobrir o que copiam do meu site

uffa! Abraços pra tu que já chegou até aqui, nem todo mundo aguenta textão hehehe.

4. Criando a Tag de Evento do Google Analytics

Vamos agora criar a tag que envia a variável para o seu Google Analytics.

Vá em Tags e crie uma Nova (já ensinei isso hoje em). Vamos usar o template do Google Analytics – Universal Analytics.

Nele você vai usar Evento em vez de Visualização de Página e fazer a seguinte configuração:

Categoria: Texto
Ação: Copiado
Rótulo: Coloque a variável que criamos, no caso é a {{ClipboardText}}

Configuração do Google Analytics você vai usar o seu código do Google Analytics.

Descobrir o que copiam do meu site

E depois disso colocamos o disparador que criamos agora pouco! Vai ficar assim:

Descobrir o que copiam do meu site

Só testar agora e ver se funciona. Quando copiar algo ele precisa Disparar a Tag e enviar o Evento no Google Analytics.

Descobrir o que copiam do meu site

Quando eu copiei o trecho ele disparou o eventlistener textCopied que fez a tag GA_Envio_Texto_Copiado ser disparado e mandou o evento para o Google Analytics.

Descobrir o que copiam do meu site

Deu certo!!! Viu como é simples?

Se tu gostou do artigo, só comentar e deixar um curtir (momento blogueiro).

Tem alguma dúvida em Google Tag Manager? Manda ai que eu tento resolver com você.

Obrigado 🙂

[/fusion_text][/fusion_builder_column][/fusion_builder_row][/fusion_builder_container]