Pessoal, o vídeo foi feito com a versão anterior do Google Analytics. Caso você estiver usando a versão do Google Analytics GA4, o processo é muito semelhante. A única coisa que irá mudar será a inserção do código do Google Analytics na sua tag de evento correspondente ao GA4. Assim, caso você queira saber exatamente como colocar o código do GA4 para configurar o evento, dê uma olhadinha no vídeo abaixo. Nele, eu explico como inserir o código do Google Analytics na nova versão, o que já resolve essa dúvida em relação ao GA4: ruclips.net/video/bcfpzlC34CY/видео.html
Esse foi um dos vídeos mais proveitosos que assisti nos últimos anos. Procurei em tudo quanto foi lugar uma forma de rastrear a mensagem que aparecia no próprio site! Valeu e parabéns pelo canal!
Há muitos vídeos no YT, mas com esse tipo de detalhamento e explicação não achei! Mt bom, parabéns! Eu sou leiga na área e consegui. Deu até vontade de aprender CSS!!
Bom dia, Thais, tudo bem? Então, tente veicular ao Google Analytics como opção de evento (se estiver usando o Google Analytics 4) e verificar se houve o disparo, porque normalmente é mais fácil para verificar e testar, antes de veicular à tag do Google Ads. E também recomendo sempre veicular ao Google Analytics, pois, quando precisar criar relatórios, fica tudo integrado ao GA, o que facilita muito mais a análise dos dados de conversão. No mais, o que você pode testar também é tentar colocar somente "div.wpforms-confirmation", mas, claro, tudo isso vai depender do que você teve de resultado ao utilizar document.querySelector em seu navegador. O ideal é utilizar exatamente aquilo que correspondeu à seleção ao utilizar o comando, pois é isso que vai gerar o disparo corretamente da tag
Oi, então, tem diferença, porque na integração somente com o Google Ads vai apenas puxar as informações do Google Ads para o Analytics. Mas na hora de criar relatórios no Google Analytics, vai complicar, porque é necessário mostrar ao Google Analytics quais são os eventos que você determinou como conversão. E isso só vai ser possível se você também criar uma tag de registro do evento específico no Analytics, mesmo que seja o mesmo acionador no Google Ads. Resumindo: sempre crie as duas tags, tanto para o Google Anaytics e o Google Ads, para o mesmo acionamento, pois você consegue ter mais controle das conversões do seu site na hora de analisar de onde vieram as compras ou ações de contato específicas.
Olá., Muito obrigado pelo vídeo. Fiquei com uma dúvida apenas onde devo criar as metas e conversões. Eu NAO devo criar uma meta no Analytics e no TMG, e sim criar somente no TMG? E o mesmo para o Google Ads, somente criar meta de conversão no TMG? Eu estava criando nos dois. Criando somente no TMG, eu conseguirei ver as metas no GAU? obrigado!
Fala, Evandro. Então, o que recomendo é você criar tanto o evento como a conversão do Google Ads através do Google Tag Manager. Aí, você pode criar uma meta no Google Universal ou uma conversão no Google Analytics 4. O propósito vai ser o mesmo, só vai mudar o modo de configuração de cada versão. Assim, o que eu recomendo é que vc já faça a transferência da sua versão do GA Universal e passe para o GA4, pois criar as conversões ficou bem mais fácil, além de ver no relatório de aquisição exatamente de onde vieram as vendas. Ah, e é claro, o GA Universal só funcionará até o começo de 2023. Conclusão: crie sempre as conversões do Google Ads no GTM, o evento do Analytics também, e a meta ou a conversão crie no Analytics mesmo, pois é ali que vc vai precisar demonstrar ao Analytics quais são as ações específicas que vc quer registrar como as mais importantes na hora avaliar os resultados.
Qual seria a maneira correta de escrever no SELETOR DE CSS quando existe o DIV ID= #contact-message > p..... MAS ele precisa do texto de confirmação: Em breve entraremos em contato. Pra garantir que o formulario foi enviado com sucesso?? Fiquei na duvida se é com . ou # na frente dos codigos. Consegue clarear pra mim?
Quando vc quer se referenciar ao ID de um elemento vc usa "#". Quando vc quer se referenciar a uma classe vc usa "." No caso, o que mais recomendo é vc tentar encontrar algum elemento .div que seja específico de uma mensagem que apareça. Ou pode ser também pelo ID. Mas, nesse caso, use "#" para encontrar o elemento em específico
@@AquinoCanal oque acontece é que neste site (plataforma engessada que meu cliente contratou) o mesmo lugar que aparece a mensagem de confirmação… é o mesmo lugar onde aparecem as mensagens de: - Preencha com nome Válido - Prenncha com um email válido - Preencha com um telefone válido, etc. Logo, eu preciso que o seletor de CSS identifique a DIV ID + (o texto específico) Em breve entraremos em contato. Como ficaria isso pra eu colocar no seletor de css? Consegue descrever?
@@andreassaiante9070 dá para você pegar a mensagem específica que aparece somente quando a mensagem é enviada com sucesso. Mas vc vai precisar testar para encontrar. Eu sei como é, porque já tive um cliente com a mesma situação. Mas é possível sim. O que dá para fazer também é criar duas variáveis que precisam corresponder a um evento específico para que ocorra. Mas, por ser um acionamento por visibilidade do elemento, creio que seja mais complicado fazer assim. Assim, dê uma olhada para pegar o elemento de classe específica dessa mensagem única ou pegar o ID mesmo. Porque vai ser mais fácil fazer isso, do que colocar duas variáveis para acionar a partir da visibilidade do elemento. E dá para fazer isso simm. É mais trabalhoso, e exige vários testes, mas já consegui captar elementos nessa mesma condição também
Um brother conseguiu desenvolver esse JS function () { var cont = document.getElementById('contact-message'); if (cont.textContent.toLowerCase().includes('em breve entraremos em contato.')) { return true; } return false; } Mas não consegui entender onde conseguiria usar essa variavel de JS como acionador... tem alguma ideia?
Aí fica mais fácil. É só criar uma conversão de acionamento pra quando a pessoa acessar uma URL específica em seu site. E aí, você pode usar o acionamento de page path no Google Tag Manager, disparando a conversão quando a pessoa acessar a página específica do seu site, referente a URL de redirecionamento, agradecendo a pessoa pelo contato.
@@AquinoCanal obrigada, vou fazer aqui!!! Sabe um video q seria legam vc fazer? Como monitorar converção de varias paginas sem precisar ficar criando varios acionadores e sim trabalhar com variaveis
Olá, obrigado pelo vídeo...Mas fiz como ensinou, e depois de clicar em enviar e aparecer a mensagem, não dispara a tag. Só dispara a tag se depois de clicar em Enviar e aparecer a menagem de envio, eu rolar a página ou clicar em algum lugar fora do formulário. Saberia me dizer o pq está acontecendo isso? Obrigado
Bom dia, Paulo, tudo bem? Teria que ver certinho, porque cada caso vai depender das configurações de classe e aparição de mensagem em seu site. Caso precisar de uma ajuda personalizada, pode entrar em contato comigo via o e-mail contato@mateusaquino.com.br
Dê uma olhadinha no meu vídeo sobre como instalar o G4A. O princípio é o mesmo, só muda, o local de inserção do código do evento do Google Analytics: ruclips.net/video/bcfpzlC34CY/видео.html
Aquino, vinculei o evento no GA4 e marquei como conversão, Depois fui lá no ADS e puxei a conversão do GA4. Minha dúvida : é confiável o ADS puxar essas conversões do GA4? ou melhor instalar a tag de conversão mesmo?
Instale a tag de conversão do Google Ads no Tag Manager. É mais fácil para obter os relatórios depois no Google Analytics. Recomendo só fazer por lá também, porque, caso você crie uma conversão internamente pelo Google Ads e pelo Tag Manager, pode ser que ele duplique a conversão quando ocorrer. Resumindo: sempre crie as conversões do Google Ads no Tag Manager e faça o mesmo gerando um evento no GA4, no GTM também
Ótimo vídeo. Mas tenho duas dúvidas. 1: Se o CSS puxa a mesma class (wpcf7-response-output) tanto para a mensagem de confirmação de envio, quanto para a mensagem de erro por não preencher algum campo obrigatório. Com fazer essa distinção? 2: Em outro site tenho dois formulários em páginas distintas e que usam a mesma página de obrigado. Como consigo criar uma configuração no GA ou GTM em que usa algum critério de página para diferenciar cada conversão. Ex: Formulário de contato: a pessoa tem que passar na página /contato e depois /obrigado = conversão 1 Formulário de produto: a pessoa tem que passar na página /produto e depois /obrigado = conversão 2 Existe alguma maneira de fazer isso? Vlw
Fala, Alan, tudo certo? Vamos por partes: 1- A distinção entre elementos que possuem a mesma classe pode ser feita a partir da atribuição de um ID diferente para cada. Isso provavelmente já vai ajudar a selecionar a mensagem específica, pois não precisa ser necessariamente a classe do elemento, no seletor CSS. 2- Você pode atribuir conversões diferentes com base na especificação das mensagens diferentes a partir de um ID único. OU, é possível você atribuir a conversão quando a pessoa chega a uma página específica, com uma URL única em seu site. Essa última precisa testar, porque às vezes pode não funcionar. Por fim, se for um e-commerce ou uma atividade específica, você pode utilizar um evento personalizado de acordo com as categorias que o próprio Tag Manager classifica, com base na integração com o Analytics. Ex: eu criei uma tag de evento personalizado para o termo "purchase", no qual o Analytics já identifica a venda quando for aprovada, em um site meu e-commerce. Você pode testar isso com categorias específicas que apareçam na seu painel do Tag Manager. Mas, avaliando no geral, creio que a conversão por chegar a uma URL específica ou elemento com ID específico já resolva o sue problema ali.
Não. A função "div" será provavelmente a mesma. Mas como você pode determinar a classe diferente para cada elemento no site, então tudo vai depender. No caso do elementor, esse é o padrão. Caso não for um site em Elementor, use a função document.querySelector, que nem eu mostrei ali em 11:03. Assim, você deve antes inspecionar o elemento, ver qual seria a classe da mensagem que aparece em seu site, para, depois, colocar essa função na parte de Console do navegador. Eu testei esse mesmo procedimento em sites HTML, com CSS e Javascript, e também funcionou. Assim, o importante é você entender o que foi feito, pois já vai ser possível aplicar em outros sites também.
Pessoal, o vídeo foi feito com a versão anterior do Google Analytics. Caso você estiver usando a versão do Google Analytics GA4, o processo é muito semelhante. A única coisa que irá mudar será a inserção do código do Google Analytics na sua tag de evento correspondente ao GA4.
Assim, caso você queira saber exatamente como colocar o código do GA4 para configurar o evento, dê uma olhadinha no vídeo abaixo. Nele, eu explico como inserir o código do Google Analytics na nova versão, o que já resolve essa dúvida em relação ao GA4:
ruclips.net/video/bcfpzlC34CY/видео.html
Esse foi um dos vídeos mais proveitosos que assisti nos últimos anos. Procurei em tudo quanto foi lugar uma forma de rastrear a mensagem que aparecia no próprio site! Valeu e parabéns pelo canal!
Muito obrigado. Único vídeo que resolveu meu problema com o Elementor.
Muito obrigado!
boa primo, tava precisando desse vídeo
muito obrigada migo, salvou meu job aqui
Que explicação sensacional! Eu estava quebrando a cabeça aqui com a bendita tag que não disparava, segui seus passos e deu certo. Obrigado!
maravilhosooooooooooooooooooo
Há muitos vídeos no YT, mas com esse tipo de detalhamento e explicação não achei! Mt bom, parabéns! Eu sou leiga na área e consegui. Deu até vontade de aprender CSS!!
Muito top sua explicação
Muito bom o vídeo parabéns! A parte de código foi um pouco chata mas consegui me encontrar e resolveu o meu problema!
salvou irmao ! agradeç demais VLWWW
realmente ngm ensina isso, vc foi o unico que encontrei
Muito bom!! Consegui!
Cara obrigado por ter feito esse vídeo! Conteúdo preciso demais!🙂 Meu caso era com Elementor Pro então foi mais simples mesmo
Aquino, sensacional! fiz todas as etapas, deu certo, porem o tag nao sobe no teste.
usei o "div.wpforms-confirmation-container-full"
Bom dia, Thais, tudo bem? Então, tente veicular ao Google Analytics como opção de evento (se estiver usando o Google Analytics 4) e verificar se houve o disparo, porque normalmente é mais fácil para verificar e testar, antes de veicular à tag do Google Ads. E também recomendo sempre veicular ao Google Analytics, pois, quando precisar criar relatórios, fica tudo integrado ao GA, o que facilita muito mais a análise dos dados de conversão. No mais, o que você pode testar também é tentar colocar somente "div.wpforms-confirmation", mas, claro, tudo isso vai depender do que você teve de resultado ao utilizar document.querySelector em seu navegador. O ideal é utilizar exatamente aquilo que correspondeu à seleção ao utilizar o comando, pois é isso que vai gerar o disparo corretamente da tag
Outra duvida: eu geralmente vinculo com o conversion tracking do google ads... no caso voce linkou com o analytics... da no mesmo?
Oi, então, tem diferença, porque na integração somente com o Google Ads vai apenas puxar as informações do Google Ads para o Analytics. Mas na hora de criar relatórios no Google Analytics, vai complicar, porque é necessário mostrar ao Google Analytics quais são os eventos que você determinou como conversão. E isso só vai ser possível se você também criar uma tag de registro do evento específico no Analytics, mesmo que seja o mesmo acionador no Google Ads. Resumindo: sempre crie as duas tags, tanto para o Google Anaytics e o Google Ads, para o mesmo acionamento, pois você consegue ter mais controle das conversões do seu site na hora de analisar de onde vieram as compras ou ações de contato específicas.
Olá., Muito obrigado pelo vídeo. Fiquei com uma dúvida apenas onde devo criar as metas e conversões. Eu NAO devo criar uma meta no Analytics e no TMG, e sim criar somente no TMG? E o mesmo para o Google Ads, somente criar meta de conversão no TMG? Eu estava criando nos dois. Criando somente no TMG, eu conseguirei ver as metas no GAU? obrigado!
Fala, Evandro. Então, o que recomendo é você criar tanto o evento como a conversão do Google Ads através do Google Tag Manager. Aí, você pode criar uma meta no Google Universal ou uma conversão no Google Analytics 4. O propósito vai ser o mesmo, só vai mudar o modo de configuração de cada versão. Assim, o que eu recomendo é que vc já faça a transferência da sua versão do GA Universal e passe para o GA4, pois criar as conversões ficou bem mais fácil, além de ver no relatório de aquisição exatamente de onde vieram as vendas. Ah, e é claro, o GA Universal só funcionará até o começo de 2023. Conclusão: crie sempre as conversões do Google Ads no GTM, o evento do Analytics também, e a meta ou a conversão crie no Analytics mesmo, pois é ali que vc vai precisar demonstrar ao Analytics quais são as ações específicas que vc quer registrar como as mais importantes na hora avaliar os resultados.
Qual seria a maneira correta de escrever no SELETOR DE CSS quando existe o
DIV ID= #contact-message > p.....
MAS ele precisa do texto de confirmação: Em breve entraremos em contato.
Pra garantir que o formulario foi enviado com sucesso??
Fiquei na duvida se é com . ou # na frente dos codigos. Consegue clarear pra mim?
Quando vc quer se referenciar ao ID de um elemento vc usa "#". Quando vc quer se referenciar a uma classe vc usa "."
No caso, o que mais recomendo é vc tentar encontrar algum elemento .div que seja específico de uma mensagem que apareça. Ou pode ser também pelo ID. Mas, nesse caso, use "#" para encontrar o elemento em específico
@@AquinoCanal oque acontece é que neste site (plataforma engessada que meu cliente contratou) o mesmo lugar que aparece a mensagem de confirmação… é o mesmo lugar onde aparecem as mensagens de:
- Preencha com nome Válido
- Prenncha com um email válido
- Preencha com um telefone válido, etc.
Logo, eu preciso que o seletor de CSS identifique a DIV ID + (o texto específico) Em breve entraremos em contato.
Como ficaria isso pra eu colocar no seletor de css?
Consegue descrever?
@@andreassaiante9070 dá para você pegar a mensagem específica que aparece somente quando a mensagem é enviada com sucesso. Mas vc vai precisar testar para encontrar. Eu sei como é, porque já tive um cliente com a mesma situação. Mas é possível sim. O que dá para fazer também é criar duas variáveis que precisam corresponder a um evento específico para que ocorra. Mas, por ser um acionamento por visibilidade do elemento, creio que seja mais complicado fazer assim. Assim, dê uma olhada para pegar o elemento de classe específica dessa mensagem única ou pegar o ID mesmo. Porque vai ser mais fácil fazer isso, do que colocar duas variáveis para acionar a partir da visibilidade do elemento. E dá para fazer isso simm. É mais trabalhoso, e exige vários testes, mas já consegui captar elementos nessa mesma condição também
@@andreassaiante9070 me envie por favor a url da pagina
Um brother conseguiu desenvolver esse JS
function () {
var cont = document.getElementById('contact-message');
if (cont.textContent.toLowerCase().includes('em breve entraremos em contato.')) {
return true;
}
return false;
}
Mas não consegui entender onde conseguiria usar essa variavel de JS como acionador... tem alguma ideia?
e se o formulário tem uma pagina de resposta ed obrigado? como taguear isso atrealndo não somente a exibição da pagina de obrigado?
Aí fica mais fácil. É só criar uma conversão de acionamento pra quando a pessoa acessar uma URL específica em seu site. E aí, você pode usar o acionamento de page path no Google Tag Manager, disparando a conversão quando a pessoa acessar a página específica do seu site, referente a URL de redirecionamento, agradecendo a pessoa pelo contato.
@@AquinoCanal obrigada, vou fazer aqui!!! Sabe um video q seria legam vc fazer? Como monitorar converção de varias paginas sem precisar ficar criando varios acionadores e sim trabalhar com variaveis
@@danielacordeiro2005 anotado aqui! Logo providencio
Olá, obrigado pelo vídeo...Mas fiz como ensinou, e depois de clicar em enviar e aparecer a mensagem, não dispara a tag. Só dispara a tag se depois de clicar em Enviar e aparecer a menagem de envio, eu rolar a página ou clicar em algum lugar fora do formulário. Saberia me dizer o pq está acontecendo isso? Obrigado
Bom dia, Paulo, tudo bem? Teria que ver certinho, porque cada caso vai depender das configurações de classe e aparição de mensagem em seu site. Caso precisar de uma ajuda personalizada, pode entrar em contato comigo via o e-mail contato@mateusaquino.com.br
Cara, e quando é no G4, como faz?
Dê uma olhadinha no meu vídeo sobre como instalar o G4A. O princípio é o mesmo, só muda, o local de inserção do código do evento do Google Analytics:
ruclips.net/video/bcfpzlC34CY/видео.html
@@AquinoCanal Muito obrigado, salvou o dia!
Aquino, vinculei o evento no GA4 e marquei como conversão, Depois fui lá no ADS e puxei a conversão do GA4.
Minha dúvida : é confiável o ADS puxar essas conversões do GA4? ou melhor instalar a tag de conversão mesmo?
Instale a tag de conversão do Google Ads no Tag Manager. É mais fácil para obter os relatórios depois no Google Analytics. Recomendo só fazer por lá também, porque, caso você crie uma conversão internamente pelo Google Ads e pelo Tag Manager, pode ser que ele duplique a conversão quando ocorrer. Resumindo: sempre crie as conversões do Google Ads no Tag Manager e faça o mesmo gerando um evento no GA4, no GTM também
Ótimo vídeo. Mas tenho duas dúvidas.
1: Se o CSS puxa a mesma class (wpcf7-response-output) tanto para a mensagem de confirmação de envio, quanto para a mensagem de erro por não preencher algum campo obrigatório. Com fazer essa distinção?
2: Em outro site tenho dois formulários em páginas distintas e que usam a mesma página de obrigado. Como consigo criar uma configuração no GA ou GTM em que usa algum critério de página para diferenciar cada conversão.
Ex: Formulário de contato: a pessoa tem que passar na página /contato e depois /obrigado = conversão 1
Formulário de produto: a pessoa tem que passar na página /produto e depois /obrigado = conversão 2
Existe alguma maneira de fazer isso?
Vlw
Fala, Alan, tudo certo? Vamos por partes:
1- A distinção entre elementos que possuem a mesma classe pode ser feita a partir da atribuição de um ID diferente para cada. Isso provavelmente já vai ajudar a selecionar a mensagem específica, pois não precisa ser necessariamente a classe do elemento, no seletor CSS.
2- Você pode atribuir conversões diferentes com base na especificação das mensagens diferentes a partir de um ID único. OU, é possível você atribuir a conversão quando a pessoa chega a uma página específica, com uma URL única em seu site. Essa última precisa testar, porque às vezes pode não funcionar. Por fim, se for um e-commerce ou uma atividade específica, você pode utilizar um evento personalizado de acordo com as categorias que o próprio Tag Manager classifica, com base na integração com o Analytics. Ex: eu criei uma tag de evento personalizado para o termo "purchase", no qual o Analytics já identifica a venda quando for aprovada, em um site meu e-commerce. Você pode testar isso com categorias específicas que apareçam na seu painel do Tag Manager. Mas, avaliando no geral, creio que a conversão por chegar a uma URL específica ou elemento com ID específico já resolva o sue problema ali.
E quando tem outros formulários no site? A classe é a mesma?
Não. A função "div" será provavelmente a mesma. Mas como você pode determinar a classe diferente para cada elemento no site, então tudo vai depender. No caso do elementor, esse é o padrão. Caso não for um site em Elementor, use a função document.querySelector, que nem eu mostrei ali em 11:03. Assim, você deve antes inspecionar o elemento, ver qual seria a classe da mensagem que aparece em seu site, para, depois, colocar essa função na parte de Console do navegador. Eu testei esse mesmo procedimento em sites HTML, com CSS e Javascript, e também funcionou. Assim, o importante é você entender o que foi feito, pois já vai ser possível aplicar em outros sites também.