Pular para o conteúdo principal

Varify® Snippet - Integração

Última atualização em 22 de abr. de 20263 min de leitura
Índice

Resumo​

Incorporar o snippet Varify.io® no seu website ou sistemas de loja pode ser feito rapidamente. O ideal é incluir o snippet JavaScript na tag <head> da sua página web para evitar o flickering da página. Se necessário, também podes usar um tag manager para a integração.

Se não conseguires integrar o snippet imediatamente, podes experimentar a nossa extensão do Google Chrome .

Implementação do snippet​

Integração na área do website (recomendado)​

Se quiseres integrar o snippet do Varify.io no teu website, é importante colocá-lo o mais alto possível na página - idealmente na área <head>. Isto garante que o snippet é carregado corretamente e sem atrasos.

Tens duas opções para integrar o snippet: síncrona e assíncrona. Ambas têm as suas próprias vantagens e desvantagens.

Dependendo dos requisitos e da estrutura específicos do teu website, decides qual o método de implementação mais adequado para ti.

Como integrar o script Varify.io de forma síncrona​

VantagemDesvantagem
Garante que o script é carregado antes de a página web ser exibida.Pode aumentar o tempo de carregamento da página web se houver problemas ao carregar o script.
Sem cintilação da páginaSe o script não carregar, a página web inteira pode não ser exibida.
<!-- Varify.io® code for YOUR ACCOUNT-->
<script>
  window.varify = window.varify || {};
  window.varify.iid = YOUR ACCOUNT ID;
</script>
<script src="https://app.varify.io/varify.js"></script>
important

Importante: Na linha 4, substitui «YOUR ACCOUNT ID» pelo ID de conta do teu dashboard.

Como integrar o script da Varify.io de forma assíncrona​

VantagemDesvantagem
Não afeta o tempo de carregamento da página web, porque a página web é carregada em paralelo.Existe a possibilidade de outros scripts serem executados primeiro, o que pode causar efeitos colaterais estranhos.
A página web continuará a carregar mesmo que haja problemas ao carregar o script.Pode ocorrer cintilação da página (flickering)
<!-- Varify.io® code for YOUR ACCOUNT-->
<script>
  window.varify = window.varify || {};
  window.varify.iid = YOUR ACCOUNT ID;
</script>
<script async src="https://app.varify.io/varify.js"></script>
important

Importante: Na linha 4, substitui «YOUR ACCOUNT ID» pelo ID da conta do teu dashboard.

Integração através do Tag Manager​

Integrar o snippet JS através do Google Tag Manager é uma forma rápida de integrar o Varify.io® no teu website. No entanto, esta opção também acarreta o risco de um efeito de flickering ser visível durante a entrega de uma variação.

Basta criar uma tag HTML personalizada no teu Tag Manager e inserir o snippet de código JavaScript. Como trigger, seleciona a opção para disparar a tag em todas as páginas o mais rapidamente possível. Uma opção seria, por exemplo, "Initialization - All pages". Nota que pode haver outras opções dependendo da configuração do teu website.

important

Certifica-te de que substituis "xxx" após o "window.varify.iid =" no screenshot pelo ID da tua conta.

Tag do Google Tag Manager do tipo „Custom HTML“ contendo o snippet do Varify, disparada pelo trigger „Initialization – All Pages“.

Ao integrar o script Varify através do GTM ou ao integrá-lo diretamente no <body>desativa a definição "Start Tracking on Activation Event" em Advanced Setup. Isto garante que o teu Varify Tracking funciona corretamente.

Advanced Setup com "Start Tracking on Activation Event" desativado e User Group Identification definido como Local Storage.

Experimenta o Varify.io através da extensão Chrome​

Podes descarregar a extensão Google Chrome para experimentar o Varify.io. A extensão integra o snippet do Varify.io no teu website exclusivamente para ti, no teu browser. Isto significa que só tu editas e vês variações no teu browser.

Para implementares o teu snippet personalizado no teu website sem teres de mexer no código, segue os passos abaixo:

  1. Faça o download da Extensão Varify® para Chrome
  2. Ative o plugin no teu navegador
  3. Copia o teu snippet de código Varify® a partir do teu dashboard (Get Snippet Here) e cola-o no campo "Your Snippet Code..." da extensão -. Pronto!

Uma explicação mais detalhada sobre a instalação e ativação, bem como outras funções, pode ser encontrada aqui: Extensão Varify® para navegador Chrome

Dashboard do Varify ao lado do plugin de pré-visualização: o link „Get Snippet Here“ e o campo de snippet do plugin estão ambos destacados

Evita o flickering durante a execução da experiência​

O flickering ocorre quando a página já está visível antes de o Varify ter aplicado totalmente a variante. A melhor forma de evitar isto é incluir o snippet no <head>.

Se isso não for suficiente ou não for tecnicamente possível, também podes usar o anti-flicker script. Podes encontrar as instruções para isso na documentação: Anti-flicker script

Nesta página