Fala Incuber beleza? Aqui é o Paulo Felipe com mais um tutorial pra você.
Se você está interessado em envolver os visitantes do seu site WordPress com apresentações de slides que contenham imagens, textos e vídeos. Então este Tutorial é para você!
A partir de agora você irá aprender como criar um slide com o Revolution Slider no WordPress e cativar os visitantes do seu site de uma maneira simples, prática e funcional.
Essa série será um projeto prático com o Revolution Slider composto por 4 vídeos nos quais aprenderemos a:
- Criar um slider e sua principais configurações;
- Criar um slide com imagens, textos, animações, timeline da animação e movimentos parallax;
- Criar um slide com vídeo de background, textos e botão de ação;
- Utilizar o recurso de transições de slides;
- Como configurar e ajustar o slide em notebooks, tablets e celulares.
Para agilizar o seu aprendizado e proporcionar mais proveito no que interessa, eu preparei um pacote com algumas imagens entre backgrounds e elementos em png para você treinar e seguir esse tutorial com mais facilidade. Clique no botão abaixo e receba o seu material exclusivo.
Agora que você já baixou as suas imagens, abra o seu painel do WordPress, instale o seu Revolution Slider e vamos começar!!
Parte 01 – Configurações gerais de um slider – Revolution Slider
Nesse primeiro vídeo nós iremos passar pelas principais configurações de um slider deixando-o estruturado e pronto para receber os slides com imagens, textos, animações e vídeos.
Principais pontos abordados nesse vídeo:
- Conhecendo os tipos de sliders;
- Aprendendo a definir o tamanho do slider em todos os dispositivos;
- Como fazer as configurações padrões dos slides como por exemplo: Duração, transição, background e progress bar;
- Como configurar os controles de navegações do slider;
- Como ativar o parallax para criar efeitos de movimentos nos elementos,
- Inserindo o slider em páginas do site.
Parte 02 – Como criar um slide com o Revolution Slider que tenha elementos animados, transições e parallax
Agora que já definimos as configurações gerais do Slider é hora de criarmos o nosso primeiro slide. Essa parte é muito legal, pois aqui você aprenderá a dar vida para o seu slide e fazer as coisas acontecerem.
Ao final dessa segunda parte você aprenderá:
- Como criar um slide;
- Como inserir elementos no slide (imagens e textos);
- Como animar entrada e saída dos elementos no slide;
- Como criar um parallax em um elemento que se move de acordo com o mouse,
- Como trabalhar com a timeline do Revolution Slider.
Maravilha, espero que você esteja gostando e entendendo os vídeos até aqui. Lembre-se, caso você esteja com alguma dúvida deixe nos comentários que eu responderei o mais rápido possível! Te desejo foco para continuar e vamos nessa, estou com você!
Parte 03 – Como criar um slide com vídeo background, textos animados e botões – Revolution Slider
Depois de aprender a trabalhar com elementos e criar um slide bem legal é hora de subir um nível, vamos aprender a como inserir um vídeo de background em seu slide e colocar texto e botão com link sob o vídeo para assim causar um impacto visual enorme no visitante do seu site.
Nessa terceira parte você aprenderá:
- Como inserir um vídeo de background no slide;
- Como criar um botão,
- Como inserir links.
Muito bem, agora vamos para a última parte do nosso projeto.
Parte 4 – Como configurar os slides em notebooks, tablets e celulares (mobile) – Revolution Slider
Nos dias de hoje, de nada adianta você ter um slide muito legal com animações vídeos e tudo mais se ele não for responsivo. Nessa última parte do nosso projeto vamos aprender como configurar os elementos dos slides no mobile.
É isso ai querido Incuber, chegamos ao fim de mais um projeto prático, e como você pode notar projetos assim mesmo que simples demandam planejamento e tempo para serem criados, e para saber se estamos no caminho certo, o seu feedback é muito importante para nós. Deixe o seu comentário sobre o que você achou do projeto, suas dúvidas e sugestões, somente assim conseguiremos melhorar cada vez mais a qualidade dos artigos aqui no blog.
- Se você ficou com alguma dúvida ou deseja acrescentar algum ponto no tutorial deixe nos comentários;
- Se esse post foi útil para você, compartilhe com a comunidade para que possa ajudar outras pessoas também,
- Quer me fazer chorar de alegria? Se inscreva no nosso canal no Youtube ????
Um abraço e até o próximo post!