Como criar um tour do produto com o Google Tag Manager sem programador
Um walkthrough guiado com o Google Tag Manager em uns vinte minutos: instale uma linha, percorra a sua própria interface no editor visual e publique um tour que começa exatamente onde os utilizadores novos precisam.
- Tempo
- ● 20 minutos
- Preço
- Plano Free
- Quem faz
- Quem pode publicar no GTM
Exemplo: um tour do produto com o Google Tag Manager
Um SaaS de analytics lançou um novo criador de relatórios, mas não consegue tempo de programação para o onboarding. Via GTM, o equipa de produto adiciona um tour de 4 passos em /app/reports: escolher período, escolher métricas, guardar a vista e compartilhar. Aparece para todos, uma vez.
Grátis no plano Free do Clew, sem cartão e sem prazo: um site e até 3 tours ou tooltips publicados. Regras de público e testes A/B vêm com o Pro.
Como criar o tour do produto com o Google Tag Manager, passo a passo
- Passo 01
Copie o seu snippet do Clew
Crie uma conta gratuita (ou entre), adicione o seu site e abra Visão geral no admin. Clique na linha do cartão O widget ainda não deu sinal. para copiar: ela já vem com a chave real do seu site no lugar do marcador.
<!-- Clew: substitua COLE_AQUI_A_SUA_CHAVE pela chave do site em Admin > Visão geral --> <script src="https://tryclew.io/widget/COLE_AQUI_A_SUA_CHAVE.js" async></script>
Passo 1 · ilustração esquemática - Passo 02
Crie uma tag Custom HTML no GTM
Em tagmanager.google.com abra o seu contêiner, Tags → New → Tag Configuration → Custom HTML, e cole a linha do Clew. Dê à tag o nome
Clew widget.
Passo 2 · ilustração esquemática - Passo 03
Dispare em All Pages
Em Triggering escolha All Pages e guarde. Carregue em todas as páginas: em qual página o tour do produto aparece é decidido no Clew, não no GTM.
Passo 3 · ilustração esquemática - Passo 04
Preview, depois Submit e Publish
Verifique no Preview que
Clew widgetestá em Tags Fired e depois Submit → Publish. Nada chega ao site real antes de publicar.
Passo 4 · ilustração esquemática - Passo 05
Crie o tour por cima da sua página
No Clew abra Fluxos → + Novo fluxo, deixe Formato em Tooltips passo a passo e clique em Editar no seu site. Na sua página clique em Escolher elemento, clique no elemento do passo 1 e escreva um título e uma ou duas frases. Repita para 3–5 passos; a pré-visualização atualiza-se enquanto escreve.
Passo 5 · ilustração esquemática - Passo 06
Escolha onde, quando e para quem aparece
No mesmo editor, preencha Onde mostrar (URL da página), Quando mostrar, Segmentação de público e Frequência. Estas são as configurações do exemplo acima:
Configuração Valor Formato Tooltips passo a passo Onde mostrar (URL da página) Secção por prefixo /app/reportsQuando mostrar Logo ao carregar a página Segmentação de público Sem regras: toda nós que abre a página Frequência Uma vez por visitante 
Passo 6 · ilustração esquemática - Passo 07
Publique e verifique no site real
Mude Estado para Publicado e guarde. Abra a página numa janela anónima: o Clew lembra quem já viu um item de “uma vez”, por isso o seu navegador de sempre pode saltar. Visualizações, conclusões e abandonos aparecem nas estatísticas.
Passo 7 · ilustração esquemática
Armadilhas: tour do produto com o Google Tag Manager
Não use um acionador History Change
O widget acompanha sozinho a navegação de apps de página única. Um segundo acionador em History Change só carrega o script de novo sem necessidade.
Prenda os passos a elementos que todos veem
Banners, blocos personalizados e variantes de teste A/B não aparecem para toda a gente. Use navegação, títulos e botões principais; se um elemento faltar, o passo aparece em Estado.
Perguntas e respostas
O tour pode aparecer só para administradores?
Sim, com uma regra de público sobre uma propriedade como role vinda da camada de dados; as regras fazem parte do Pro.
O GTM atrasa o tour do produto?
O widget carrega um instante depois do contêiner. Só um item Logo ao carregar a página na primeiríssima visualização pode aparecer uma fração de segundo depois do que numa instalação direta.
O tour do produto é grátis?
Sim: tours estão no plano Free, com até 3 publicados. Só precisa do Pro para regras de público, testes A/B e mais tours.
Preciso de saber seletores CSS?
Não. Editar no seu site abre o editor na sua página e Escolher elemento preenche o seletor quando clica num elemento.
O que mais é possível adicionar com o Google Tag Manager
- Como colocar um pop-up em seu site com o Google Tag Manager sem programador
- Como adicionar um checklist de onboarding com o Google Tag Manager sem programador
- Como configurar o onboarding de utilizadores com o Google Tag Manager sem programador
- Como adicionar um tooltip em seu site com o Google Tag Manager sem programador
- Como criar um guia interativo do produto com o Google Tag Manager sem programador
- Como criar um aviso de paywall com o Google Tag Manager sem programador
Tour do produto em outras plataformas
- WordPressComo criar um tour do produto no WordPress sem programador
- LovableComo criar um tour do produto numa app do Lovable sem programador
- Bolt.newComo criar um tour do produto numa app do Bolt.new sem programador
- v0Como criar um tour do produto numa app do v0 sem programador
- ReplitComo criar um tour do produto numa app do Replit sem programador
- CursorComo criar um tour do produto numa app feita no Cursor sem programador
- Claude CodeComo criar um tour do produto com o Claude Code sem programador
- ChatGPT CodexComo criar um tour do produto com o ChatGPT Codex sem programador
- Qwen CodeComo criar um tour do produto com o Qwen Code sem programador