Instalar o Widget através do Google Tag Manager

Porquê utilizar o GTM?

O Google Tag Manager oferece um controlo avançado da implementação sem modificar o código do seu website:

• Segmentação por URL: Apresentar o widget apenas em páginas ou secções específicas

• Filtragem por dispositivo: Implementar widgets diferentes para computadores e dispositivos móveis

• Encaminhamento por idioma: Apresentar widgets específicos por idioma com base na estrutura do URL

• Testes A/B: Ativar diferentes configurações do widget para segmentos de utilizadores

Pré-requisitos

Pré-requisitos do ViaSay

• Certifique-se de que criou um Widget ViaSay

👍 Implante de forma invisível e lance quando estiver pronto

Defina a Distribuição do público como 0% durante a configuração. O código do widget será implantado em produção, mas permanecerá oculto. Quando estiver pronto para lançá-lo, ajuste a porcentagem em Integração para controlar a visibilidade — sem necessidade de alterações no código.

Pré-requisitos técnicos

• Google Tag Manager instalado no seu website

• Acesso ao contentor do GTM com editar permissões

• Compreensão básica dos conceitos do GTM (tags, gatilhos, variáveis)

Passos de instalação

Etapa 1: criar um gatilho

Os gatilhos definem quando e onde o seu widget é carregado.

1. Acesse Gatilhos na barra lateral esquerda

2. Clique em Novos

3. Clique na área de configuração do acionador

4. Selecione Visualização de página como o tipo de acionador

5. Configure o escopo do acionador:

Implementar em todas as páginas:

• Selecione Visualizações de todas as páginas

Implementar em URLs específicas:

• Selecione Algumas visualizações de página

• Adicionar condição: URL da página contém /your-path/

Exemplo: exibir o widget apenas nas páginas de FAQ:

'Display widget only on FAQ pages:'
Page URL contains /faq

'Display widget only on FR pages:'
Page URL contains /fr

1. Nomeie seu acionador claramente (por exemplo, "Widget - Todas as páginas", "Widget - Apenas FAQ", "Widget - Desktop FR")

2. Clique em Guardar

Etapa 2: criar uma tag

As tags contêm o código real do widget.

1. Acesse Tags na barra lateral esquerda

2. Clique em Novos

3. Clique na área de configuração da tag

4. Selecione HTML personalizado como tipo de tag

5. Cole o código do seu widget ViaSay (em Build > Integrate > Channels > Integration guia)

6. Role até Acionamento seção

7. Clique para adicionar um acionador

8. Selecione o(s) acionador(es) criado(s) na Etapa 1

9. Dê um nome à sua tag (por exemplo, "ViaSay Widget", "ViaSay Widget - Desktop")

10. Clique em Guardar

Etapa 3: testar e publicar

1. Clique em Pré-visualização no canto superior direito

2. Insira o URL do seu site para iniciar o modo de depuração

3. Verifique se o widget é carregado nas páginas pretendidas

4. Verifique a lista Tags acionadas seção confirma que sua tag foi executada

5. Clique em Enviar para publicar as alterações

6. Adicione um nome e uma descrição à versão

7. Clique em Publicar

Configurações avançadas

Segmentar tipos específicos de dispositivos

Crie uma variável JavaScript personalizada para detetar o tipo de dispositivo:

1. Acesse Variáveis na barra lateral esquerda

2. Clique em Novos em Variáveis definidas pelo utilizador

3. Selecione JavaScript personalizado como tipo de variável

4. Adicione esta função:

function() {
  return window.innerWidth <= 768 ? 'mobile' : 'desktop';
}

 

1. Dê-lhe o nome deviceType

2. Crie acionadores separados para dispositivos móveis e computadores:

   • Acionador: deviceType é igual a mobile

   • Acionador: deviceType é igual a desktop

Implementar vários widgets

Implemente diferentes configurações de widget por URL ou contexto:

Crie etiquetas separadas com tokens de widget diferentes para cada acionador.

Transmitir variáveis personalizadas ao widget

Enriqueça as conversas com o contexto do utilizador usando variáveis do canal do utilizador. Consulte a documentação sobre variáveis do canal do utilizador →

Solução de problemas

⚠️ Impacto dos bloqueadores de anúncios: o GTM é frequentemente bloqueado devido às associações com o Google Analytics. Se a visibilidade máxima do widget for essencial, utilize a instalação direta em HTML.

GTM vs instalação direta em HTML

Documentação do GTM

• Referência dos tipos de acionadores do GTM

• Referência dos tipos de variáveis do GTM

• Variáveis incorporadas do GTM

Próximas etapas

• Configure a aparência do widget em Formato e design

• Configure saudações específicas ao contexto em Saudações

• Transmita dados do utilizador com variáveis personalizadas

• Monitorize o desempenho por segmento de URL em Monitorar