Você já viu essas belas animações CSS em sites populares? Efeitos de animação, como conteúdo que desliza, que se dissipa, suas imagens saltando, etc…. ? Você também deseja adicionar animações CSS ao WordPress?

Neste artigo, vamos mostrar como adicionar facilmente animações CSS ao WordPress sem escrever nenhum código.

Quando e por que você deve usar animações CSS?

As animações CSS permitem que você chame a atenção do usuário para diferentes partes da página. Você pode usá-los para animar os recursos do produto ou um botão de call to action. Muitos sites usam animações CSS quando o usuário rola a página para baixo. Ele adiciona personalidade à página e enfatiza os elementos mais importantes.

As animações CSS também são mais rápidas do que usar flash ou vídeos. Eles carregam rapidamente e são suportados pela maioria dos navegadores modernos. Você pode adicionar animações CSS manualmente ao seu tema WordPress ou à sua folha de estilo. tema criança. No entanto, a maioria dos iniciantes não deseja editar seus arquivos de temas ou aprender CSS.

Dito isto, neste tutorial, veremos como você pode adicionar facilmente animações CSS ao seu site WordPress.

Mas antes, se você nunca instalou o WordPress, descubra Como instalar um blog WordPress passos 7 et Como encontrar, instalar e ativar um tema WordPress em seu blog 

Então, voltemos ao porquê de estarmos aqui.

Como configurar animações CSS

Vamos usar um plugin para este tutorial. Permite criar animações CSS usando Editor visual WYSIWYG. A primeira coisa que você precisa fazer é instalar e ativar o plugin Animá-lo!. O plugin funciona sem configuração e não há painel de controle.

Discover Como instalar um plugin no WordPress se você nunca fez isso.

Basta criar uma nova postagem e você verá um novo botão na barra de ferramentas do editor visual.

Ao clicar no botão, você verá uma nova janela aparecer na qual você pode criar suas animações CSS. O plugin suporta muitas animações CSS que podem ser escolhidas.

Primeiro você precisa selecionar o estilo de animação. Depois disso, você precisa escolher o tempo de espera antes da animação e a duração da animação. Finalmente, você pode especificar quando a animação começará.

Vá além, descobrindo Como adicionar animações impressionantes para o seu blog

O plugin oferece três opções. Você pode executar a animação ao clicar, ao passar o mouse ou ao rolar.

Quando estiver satisfeito com as configurações, você pode clicar no botão " Ela anima Para ver a prévia da animação.

Em seguida, clique no botão inserção para adicionar animação ao seu post ou página. Você notará que o plugin adicionará um shortcode com conteúdo fictício no editor visual.

Você precisa remover o conteúdo fictício dentro do shortcode e substituí-lo por seu próprio conteúdo, imagens ou qualquer outra coisa que você deseja animar.

Descubra também Como adicionar mapas interativos ao seu site WordPress

Tudo que você precisa fazer agora é publicar seu conteúdo e visualizá-lo.

Descubra também alguns plugins premium do WordPress  

Você pode usar outro WordPress plugins para dar uma aparência moderna e otimizar o manuseio do seu blog ou site.

Oferecemos a você aqui alguns plugins premium do WordPress que ajudarão você a fazer isso.

1. ChimpMate Pro

Chimpanzé é o WordPress Plugin O pop-up premium do MailChimp, que o ajudará a converter seus leitores em assinantes. Ele foi projetado para aumentar sua lista de e-mail sem irritar os visitantes com pop-ups irritantes.

É totalmente personalizável e você dominará quando e onde exibir pop-ups. Suas outras características são: suporte de vários navegadores e tem pvárias opções de agendamento, um layout totalmente personalizável, umapoio ao cliente responsivo, euperfeita integração com WooCommercee umxcellente gerenciamento de cache, integração perfeita com muitos Temas do WordPress, suporte multilíngue graças a para o plugin WPML, enão muito mais.

Descarregar | Demo | hospedagem na web

2. Gateway de Pagamento WooCommerce Cardstream

CardStream é o único provedor de gateway de pagamento independente. este WordPress Plugin premium permite que você aceite pagamentos diretamente em sua loja online WooCommerce através do Cardstream.

Também oferece a capacidade de aceitar pagamentos usando a solução hospedada da Cardstream.

Descarregar | Demo | hospedagem na web

3. Fonte de dados

DataSource é um WordPress Plugin premium focado na apresentação visual dos seus dados em qualquer página do seu site. Ele permite apresentar dados de arquivos CSV, XML, Excel, planilhas do Google, bancos de dados MySQL ou tipos de postagem personalizados como tabelas classificáveis ​​​​e filtráveis, diferentes gráficos, mapas e muito mais.

Entre suas características, você encontrará, entre outras:interface intuitiva, tableaux com base no modelo dos seus dados, tclassificáveis, filtráveis ​​e responsivas, oupport de Google Maps e do multilíngue, umsuporte ao cliente responsivo, um mmanual do usuário, um iinstalação rápida, et mais

Descarregar | Demo | hospedagem na web

Recursos Recomendados

Descubra outros recursos recomendados para ajudá-lo a criar e gerenciar seu site.

• Como comprimir e redimensionar imagens em WordPress
• Como adicionar um widget para o cabeçalho do seu blog WordPress
• Como adicionar mapas interativos ao seu site WordPress
• Como corrigir erro 413 no WordPress

Conclusão

Aqui ! Para este tutorial, esperamos que tenha ajudado você a aprender como integrar animações CSS no WordPress. Não hesite em compartilhe com seus amigos em suas redes sociais favoritas. 

No entanto, você também poderá consultar nossos Ressources, se você precisar de mais elementos para realizar seus projetos de criação de sites da Internet, consultando nosso guia no site Criação de blog WordPress.

Se você tiver sugestões ou comentários, deixe-os em nossa seção Comentários.

...