Como adicionar texto animado usando o Elementor para manter os visitantes focados em sua mensagem

Publicados: 2022-06-13

Se você precisa que seu site chame a atenção de seus visitantes, ter texto animado pode ser exatamente o que você precisa.

Por exemplo, olhe para minha página inicial, notou alguma coisa? Isso mesmo, texto animado. Uso texto animado desde 2016, mas até agora tem sido difícil de fazer.

E um dos complementos Elementor tornará incrivelmente fácil de fazer.

Índice
  1. O que é um título animado?
  2. Por que você deve adicionar texto animado a um site?
  3. Como adicionar texto animado usando Elementor
    • Etapa 1: instalar e ativar o plug-in dos Emirados Árabes Unidos
    • Etapa 2: adicione o widget de título sofisticado ao local desejado
    • Etapa 3: estilize seu título animado
  4. Adicionando texto animado com o Elementor Pro

O que é um título animado?

Um título animado em uma seção de heróis é uma ótima maneira de chamar a atenção do seu leitor e atraí-lo para o restante do conteúdo. Os títulos animados apresentam um título parcialmente estático com uma palavra ou frase que continua a mudar.

Embora a criação de tais títulos exigisse muito conhecimento técnico no passado, agora é super fácil de fazer usando uma combinação da versão gratuita Elementor e Ultimate Addons for Elementor, ou apenas Elementor Pro.

Agora, criar títulos atraentes como esses é um simples arrastar e soltar!

Por que você deve adicionar texto animado a um site?

O texto animado pode ajudar a dar vida ao seu site, chamando a atenção dos visitantes e tornando seu conteúdo mais atraente.

Adicionar texto animado ao seu site é uma ótima maneira de adicionar interesse visual. Também pode ajudar a destacar informações importantes ou explicar conceitos complexos de maneira fácil de entender.

O texto animado também pode ser usado de forma eficaz como parte de um apelo à ação ou para chamar a atenção para ofertas e promoções especiais.

Se você deseja que seu site se destaque da multidão, adicionar texto animado é uma ótima maneira de fazer isso!

Como adicionar texto animado usando Elementor

Adicionar texto animado ao seu site Elementor é uma ótima maneira de adicionar um toque especial e personalidade.

Existem algumas maneiras diferentes de fazer isso, mas usaremos o Ultimate Addons for Elementor (UAE) aqui.

O UAE é um dos complementos avançados do Elementor que oferece muitos novos blocos interativos para projetar suas páginas. Sua assinatura dos Emirados Árabes Unidos é válida em sites ilimitados e também há um plano vitalício disponível!

Juntamente com as manchetes animadas avançadas, os Emirados Árabes Unidos oferecem:

  • Texto de parágrafo animado
  • Temporizador de contagem regressiva dinâmico
  • Vídeos de fundo animados
  • Google Maps responsivo
  • Ícones animados
  • Carrosséis de imagens
  • Tabelas de preços
  • Carrosséis de produtos WooCommerce

Você pode encontrar uma lista completa de todos os blocos Ultimate Addons for Elementor clicando em Widgets no menu da página inicial.

Vamos agora pular para a criação de texto animado com Elementor e Ultimate Addons para Elementor!

Etapa 1: instalar e ativar o plug-in dos Emirados Árabes Unidos

O primeiro passo é instalar o Ultimate Addons for Elementor. Este plugin adiciona muito mais funcionalidades ao Elementor, tornando-o ainda mais poderoso do que antes!

  • Instale-o no site Ultimate Addons for Elementor. Se você ainda não criou sua conta, precisará fazê-lo.
  • Depois de fazer login na sua conta, você pode baixar o arquivo zip para Ultimate Addons.
  • Agora vá para o Painel do WordPress > Plugins > Adicionar Novo.
  • Aqui, clique no botão Upload Plugin na parte superior da sua página.
  • Escolha o arquivo zip que você acabou de baixar e clique em Instalar .

É isso! O Ultimate Addons for Elementor agora será instalado em seu site. Vá em frente e ative o plugin para começar a usá-lo.

Etapa 2: adicione o widget de título sofisticado ao local desejado

Veja como é um título chique!

O texto em amarelo com o cursor no final tem uma animação de digitação atraente que atrai instantaneamente a atenção do usuário.

Vamos ver como podemos adicionar este widget às nossas páginas.

Imagem de exemplo de título animado
  • Comece editando qualquer uma de suas páginas com o Elementor
  • Na caixa de pesquisa de elementos Elementor, procure o título Fancy
Elemento de título extravagante
  • Depois de encontrá-lo, arraste e solte-o na página
  • Em seguida, edite o texto que precisa ser estático e a parte que precisa ser dinâmica.
Configurações de título extravagantes para Elementor
  • Uma vez feito, você pode começar a personalizá-lo.

Etapa 3: estilize seu título animado

Existem vários tipos de animações que você pode adicionar aos seus títulos e configurações.

Basta clicar na seção Efeito na seção de cabeçalho animado e começar a personalizar as animações.

Configurações de animação de título extravagantes

Você pode ajustar como o texto alterna entre diferentes partes selecionando o efeito. Você também pode ajustar a velocidade e o tempo de pausa entre cada alteração.

Essas opções lhe darão o efeito perfeito para o seu site e o ajudarão a torná-lo exatamente do jeito que você deseja!

Adicionando texto animado com o Elementor Pro

Como alternativa, você também pode criar manchetes animadas com o novo widget Animated Headline do Elementor Pro.

Se você é mais um aprendiz visual, criamos um vídeo para você que você pode assistir aqui.

O widget de título animado é bastante simples, então aqui estão os passos rápidos para você começar.

Etapa 1: instale e ative sua licença Elementor Pro

Etapa 2: no painel de administração do WordPress, vá para Páginas > Adicionar novo

Etapa 3: clique em Editar com Elementor

Etapa 4: Procure o widget Título animado na lista de widgets disponíveis. Agora arraste e solte na sua página

Encontre o widget de título animado e arraste-o para a página

Etapa 5: insira o texto do título dividindo-o em Antes do texto, Texto realçado e Depois do texto . O texto destacado é aquele em que sua animação está ativada

Etapa 6: personalize o tipo de animação nas opções suspensas

Estilo de animação no Elementor

Etapa 7: visualize e publique suas alterações!

Isso é tudo o que há para isso!

Agora você pode adicionar facilmente um título animado ao seu site usando o Elementor Pro.

Se você deseja chamar a atenção de seus visitantes ou tornar seu conteúdo mais atraente, este poderoso widget torna isso rápido e fácil.

Então por que esperar?

Comece a adicionar títulos animados ao seu site hoje mesmo e veja como eles ajudam a aumentar o engajamento e gerar conversões!