Neste tutorial você aprenderá como aplicar efeitos de entrada em botões, fazendo com que eles apareçam automaticamente após alguns segundos ou quando o visitante rolar a página.
Esse recurso é muito útil para:
• Destacar botões de ação (CTA)
• Criar elementos que aparecem no momento certo
• Melhorar a experiência de navegação do visitante
Você pode assistir ao vídeo completo deste tutorial abaixo:
Tipos de Efeito Disponíveis #
No Builderall Website Builder, os botões podem aparecer na página de duas formas principais:
Por tempo
O botão aparece alguns segundos após o visitante entrar na página.
Quando visível
O botão aparece somente quando o visitante rola a página até a área onde ele está localizado.
Como Criar um Efeito de Entrada por Tempo #
Siga os passos abaixo:
- Abra sua página no Website Builder.
- Localize o botão que deseja animar.
- Clique com o botão direito do mouse sobre o botão.
- No menu lateral, role até encontrar a opção Animação.
- Em seguida, selecione a opção Por tempo.
- Defina o tempo em segundos para o botão aparecer.
Exemplo:
Se você inserir 3 segundos, o botão aparecerá três segundos após o visitante entrar na página.
Escolhendo o Tipo de Animação #
Após definir o tempo, escolha o tipo de efeito.
Os efeitos de entrada são aqueles que possuem “in” no nome, como por exemplo:
• Fade In
• Bounce In
• Left In
Esses efeitos fazem com que o elemento apareça gradualmente na página.
Após selecionar o efeito:
- Clique em Salvar.
- Publique ou visualize sua página.
O botão aparecerá automaticamente após o tempo definido.
Importante #
Os efeitos de animação não são exibidos dentro do construtor da página.
Para visualizar o efeito funcionando, você precisa:
• Abrir a página publicada
• Ou usar a opção de visualização do site
Como Criar um Efeito ao Rolar a Página #
Você também pode configurar um botão para aparecer apenas quando o visitante chegar até determinada área da página.
Isso cria uma experiência mais dinâmica durante a navegação.
Siga os passos:
- Clique com o botão direito no botão desejado.
- Acesse novamente a opção Animações.
- Selecione Quando visível.
- Escolha um efeito de entrada (exemplo: Fade In).
- Defina a velocidade da animação.
- Clique em Salvar.
Como Funciona o Efeito “Quando Visível” #
Quando essa opção está ativa:
• O botão não aparece imediatamente.
• Ele só será exibido quando o visitante rolar a página até aquela seção.
Isso é muito utilizado para:
• Botões de compra
• Chamadas para ação
• Seções de conversão
Testando o Efeito #
Após salvar a configuração:
- Abra a versão publicada do seu site.
- Atualize a página.
- Observe o comportamento do botão.
Se configurado por tempo, ele aparecerá após os segundos definidos.
Se configurado quando visível, ele aparecerá apenas quando a página for rolada até sua posição.
FAQ #
Posso usar esse efeito em outros elementos além de botões? #
Sim. O sistema de animações pode ser aplicado a outros elementos da página.
O efeito não aparece no construtor da página. Isso é normal? #
Sim. As animações só são exibidas na visualização ou na página publicada.
Posso combinar vários efeitos? #
Não é possível aplicar múltiplos efeitos no mesmo elemento.
Troubleshooting #
O botão não aparece #
Verifique:
• Se a página está publicada
• Se a animação foi salva corretamente
• Se o tempo configurado não é muito alto
O efeito não aparece no editor #
Isso é esperado.
Os efeitos só podem ser visualizados:
• Na página publicada
• Ou na visualização do site
O botão aparece imediatamente #
Verifique se a animação está configurada como:
• Por tempo
ou
• Quando visível
Se estiver em outro modo, o comportamento pode ser diferente.
