Quer adicionar animação ao WordPress?
Há algumas ótimas razões para fazer isso — a animação ajuda você a criar uma história de marca envolvente, se destacar entre os concorrentes e diminuir as taxas de rejeição. E a melhor parte? Você não precisa saber como codificar ou criar. O WordPress tem vários plug-ins que você pode usar para facilmente adicionar movimento aos seus sites.
Aqui estão os dez melhores plug-ins de animação que você pode baixar agora:
1. LottieFiles – Lottie block for Gutenberg
Sem querer nos gabar, mas o plug-in LottieFiles for WordPress é uma das formas mais fáceis de adicionar elementos de design de movimento ao seu site.
Esse plug-in permite pesquisar milhares de animações em Lottie gratuitas, que são formatos de arquivo superleves. Isso significa tempos de carregamento mais rápidos para o seu site. Em seguida, insira os Lotties no WordPress com apenas alguns cliques. Defina facilmente eventos personalizados — como passar o mouse, clicar ou rolar — para acionar sua reprodução. Você pode até adicionar suas próprias classes CSS para personalizar o visual de um Lottie. Para saber mais, leia nosso guia sobre como adicionar e personalizar animações em Lottie no WordPress.
Tipos de animações: milhares de animações gratuitas para qualquer caso de uso e setor — esteja você procurando por ícones animados, ilustrações, animações de carregamento e muito mais.
Casos de uso: se você precisa adicionar animações leves ou animações que respondam a clicar, passar o mouse ou rolar. Também pode ser usado para adicionar animações como fundo.
Preço: grátis
2. SVG Support
As animações SVG (Scalable Vector Graphics) podem ser complicadas no WordPress, mas o plug-in SVG Support visa eliminar isso. Ele permite que você carregue arquivos SVG como imagens em sua biblioteca de mídia e, em seguida, permite estilizá-los ou animá-los com CSS e JavaScript.
Se você está se perguntando quando usar um SVG ou uma animação em Lottie, confira nosso guia para esses tipos de arquivo aqui.
Tipos de animações: quaisquer animações SVG que você gostaria de carregar e nas quais gostaria de trabalhar.
Casos de uso: se você precisa uma forma simples de incorporar arquivos SVG.
Preço: grátis
3. Slider Hero
O plug-in Slider Hero adiciona um visual "cinematográfico" ao seu site, oferecendo mais de 80 efeitos de animação de fundo e áudio que podem adicionar uma nova dimensão ao texto ou páginas estáticas.
Tipos de animações: controles deslizantes, carrosséis de texto, fundos de vídeo e animações de texto.
Casos de uso: se você deseja criar cabeçalhos animados para o seu site ou anúncios em banner envolventes.
Preço: versão grátis e três upgrades de US$ 29, US$ 59 e US$ 79
4. Superfly
O Superfly permite que você crie facilmente menus de navegação animados, oferecendo vários estilos diferentes. Convencionalmente, os menus animados requerem conhecimento de CSS e JavaScript para serem criados, portanto esse plug-in pode economizar muito tempo e esforço.
Tipos de animações: menus de navegação animados em diferentes estilos — tela cheia, minimalista, sempre visível e muito mais.
Casos de uso: se você deseja que um menu animado substitua ou complemente seu menu estático.
Preço: US$ 29
5. Transition Slider
Tem um controle deslizante de imagem ou vídeo em seu site? O plug-in Transition Slider oferece 47 modelos com efeitos de transição personalizáveis para esses controles deslizantes. Os controles deslizantes geralmente ficam à mercê de boas imagens ou vídeos, mas esses efeitos podem adicionar uma nova dimensão envolvente ao que você já tem.
Tipos de animações: os efeitos incluem deformação, zoom, esmaecimento, alongamento, crossfading e desfoque.
Casos de uso: se você deseja adicionar transições animadas a um controle deslizante de imagem ou vídeo.
Preço: versão grátis e um upgrade por US$ 35
6. Animate It!
O plug-in Animate It! permite que mais de 50 animações CSS sejam usadas nas páginas, publicações e widgets do seu site.
Tipos de animações: são animações pequenas e nítidas que adicionam movimento dinâmico a elementos estáticos.
Casos de uso: se você deseja adicionar movimento a elementos estáticos, como ícones ou texto.
Preço: grátis
7. Image Hover Effects Ultimate
O plug-in Image Hover Effects Ultimate permite incluir animações envolventes quando um usuário passa o mouse sobre as imagens em seu site.
Tipos de animações: isso inclui oito efeitos de passagem de mouse, cada um com suas próprias variações, que permitem que as caixas sejam invertidas, façam espirais para dentro e para fora, que legendas apareçam, além de comparações de imagens deslizantes.
Casos de uso: esse é um ótimo plug-in se você deseja destacar as imagens em um portfólio ou galeria.
Preços: US$ 19,99, US$ 49,99, US$ 199,99
8. Blocks Animation: CSS For Gutenberg Blocks
Como você sabe, os blocos Gutenberg são usados para criar layouts de conteúdo para WordPress. O plug-in Blocks Animation permite adicionar animações CSS a qualquer um desses blocos em seu site. Mas você não precisa escrever nenhum CSS do zero, pois o plug-in oferece uma variedade de opções que você pode adicionar com apenas alguns cliques.
Tipos de animações: escolha entre diferentes estilos de animação, como quique, oscilação, flash, esmaecimento e elástico.
Casos de uso: se você deseja adicionar animações simples a qualquer bloco Gutenberg.
Preço: grátis
9. Advanced Typing
O plugin Advanced Typing faz uma coisa e faz muito bem — simula o visual de alguém digitando palavras em seu site. Você pode até "humanizá-lo" fazendo com que a animação cometa erros ou retroceda, e pode usar qualquer fonte que deseja e em qualquer tamanho.
Casos de uso: a animação é muito específica, mas perfeita para slogans na seção do tipo "hero" do seu site.
Preço: US$ 12
10. WebP Converter for Media
O plug-in WebP Converter for Media na verdade não adiciona animação ao seu site. Em vez disso, ele acelera seu site convertendo imagens em formatos AVIF e WebP. Esses formatos de arquivo são significativamente mais leves do que os formatos de animação padrões, como GIFs.
Claro que, se o seu site usa muita animação, considere mudar para Lottie. Uma animação em Lottie é superleve e, em média, 600% menor que um GIF!
Casos de uso: se o seu site usa JPEG, PNG e GIF e você deseja otimizá-los para velocidades de carregamento rápidas.
Preço: versão grátis e vários upgrades de US$ 5 a US$ 1.500
Adicione magia de movimento ao WordPress
Esperamos que essa lista tenha lhe dado algumas ideias sobre como você pode animar seus sites WordPress. Esses plug-ins facilitam a adição de movimento, mesmo que você não saiba codificar ou criar. E se você está procurando mais inspiração, aqui estão alguns sites WordPress impressionantes que usam animações em Lottie.
Então, o que você está esperando? Comece a criar com o WordPress!