Pular para o conteúdo principal

Experiment JavaScript & Experiment CSS

Última atualização em 23 de out. de 20262 min de leitura

Resumo​

Com o Experiment JavaScript e o Experiment CSS, podes entregar código JavaScript e CSS em todas as variantes de um experimento, incluindo o original. O código do experimento é sempre executado antes do código das variantes individuais.

Isto é útil sempre que o código tem de ser executado de forma idêntica para todos os visitantes do experimento, por exemplo para carregar um script de tracking em todas as variantes. O código do experimento destina-se a utilizadores experientes com experiência em programação.

Dashboard da Varify com o menu de três pontos de um experimento aberto, mostrando a secção „Code applied for all variations“ com as entradas Add Experiment JavaScript, Add Experiment CSS e Add Reset JavaScript

Onde encontrar o Experiment JS e o Experiment CSS​

Podes encontrar ambas as funções na visão geral de experimentos do teu dashboard:

  1. Clica no menu de três pontos no canto superior direito do experimento.
  2. Em Code applied for all variations, seleciona Add Experiment JavaScript ou Add Experiment CSS.
  3. Introduz o teu código e guarda-o.

O badge junto a cada entrada mostra se já foi adicionado código.

Como funciona o código do experimento​

  • Entregue a todas as variantes: O código do experimento é aplicado a todas as variantes do experimento e ao original.
  • Executado primeiro: O código do experimento é sempre executado antes do código da variante. O código ou os estilos que adicionas numa variante podem, por isso, basear-se no que o código do experimento já configurou.
  • Mesmo código, mesmo resultado para todos: Como o código é entregue a todas as variantes, não cria uma diferença entre elas. Usa-o para coisas que devem aplicar-se a todos, e usa o código da variante (ver Add JavaScript e Add CSS) para as alterações que queres testar.

Exemplos de aplicação​

Executar um script de tracking em todas as variantes​

Um caso de uso típico para o Experiment JavaScript é um script de tracking que deve ser adicionado a todas as variantes. Em vez de copiar o script para cada variante, adiciona-o uma vez como Experiment JavaScript.

// Runs on the original and on all variations
window.dataLayer = window.dataLayer || [];

window.dataLayer.push({
event: 'experiment_loaded',
});

Partilhar estilos entre todas as variantes​

Com Experiment CSS, podes definir estilos que são necessários em todas as variantes, por exemplo para um elemento que adicionas através de JavaScript.

.promo-note {
font-size: 14px;
color: #333;
}

Usar funções auxiliares​

As funções auxiliares da Varify também funcionam no Experiment JavaScript. Podes usá-las, por exemplo, para esperar por elementos no DOM ou para impedir que o código seja executado no editor. Podes encontrar todas as funções disponíveis e exemplos no artigo Code Helpers.

window.varify.helpers.waitFor('.product', (element) => {
// Runs as soon as the element is available in the DOM
});

Adicionar JavaScript Reset​

No mesmo menu, também encontras Add Reset JavaScript. Remove código que adicionaste, o que é especialmente útil para Single Page Applications. Podes encontrar mais informações no artigo Add JavaScript Reset.