Suporte/Recursos avançados
Recursos avançados

Rastrear eventos de scroll

Registe automaticamente quando visitantes fazem scroll até secções específicas da sua página como features, testemunhos, preços, CTA, e mais.

Configuração simples

Adicione um atributo data-fs-scroll a qualquer elemento HTML para rastrear quando entra no viewport:

HTML
<section data-fs-scroll="scroll_to_pricing">
  <h2>Pricing</h2>
  <p>Choose the perfect plan for your needs</p>
</section>

Quando um visitante faz scroll e esta secção fica 50% visível, o Flowsery Analytics disparará automaticamente um objetivo scroll_to_pricing.

Como funciona

  • Limiar de visibilidade: Por padrão, o objetivo dispara quando 50% do elemento está visível no viewport
  • Rastreamento instantâneo: Os objetivos são enviados imediatamente assim que o limiar é atingido (sem atraso)
  • Rastreamento único: Cada elemento aciona apenas uma vez por visita de página para evitar objetivos duplicados

Casos de uso

Rastreie o engagement com secções-chave da página:

HTML
<!-- Track pricing section engagement -->
<section data-fs-scroll="viewed_pricing">
  <!-- Pricing content -->
</section>
 
<!-- Track if users read testimonials -->
<div data-fs-scroll="read_testimonials" data-fs-scroll-threshold="0.7">
  <!-- Testimonials content -->
</div>
 
<!-- Track CTA visibility with a delay to ensure user attention -->
<div data-fs-scroll="saw_signup_cta" data-fs-scroll-delay="2000">
  <button>Iniciar teste gratuito</button>
</div>

Regras de validação do nome do objetivo

O nome do objetivo em data-fs-scroll segue as mesmas regras que os objetivos personalizados:

  • Use apenas letras minúsculas, números, underscores (_) e hífens (-)
  • Máximo de 64 caracteres
  • Exemplos: scroll_to_pricing, viewed_hero, read_features

Análise

Depois de configurar, pode:

  • Ver objetivos de scroll na sua secção de objetivos personalizados
  • Incluir objetivos de scroll em funis de conversão para compreender o fluxo de engagement do utilizador
  • Filtrar os seus analytics por visitantes que atingiram secções específicas

Dica: Combine o rastreamento de scroll com funis de conversão para ver como a visibilidade de secções influencia as conversões.

Configuração avançada

Personalize o limiar de visibilidade e atraso usando atributos de dados adicionais:

HTML
<section data-fs-scroll="scroll_to_hero_cta" data-fs-scroll-threshold="0.8" data-fs-scroll-delay="1000">
  <h1>Pronto para começar?</h1>
  <button>Inscreva-se agora</button>
</section>

Opções de configuração

  • data-fs-scroll-threshold (opcional): Quanto do elemento deve estar visível antes de acionar (0.1 = 10%, 1 = 100%). Padrão: 0.5 (50%)
  • data-fs-scroll-delay (opcional): Quanto tempo esperar (em milissegundos) após o elemento ficar visível antes de enviar o evento. Padrão: 0 (sem atraso)

Para uma referência completa de todas as opções de configuração do script de rastreamento, veja a documentação de configuração do script.