WordPress Revolution Slider ou Slider Revolution (como também é muito conhecido) é um dos melhores plugins para exibição de sliders no WP. O CanalWP já recomendou esse plugin em outro post, mas hoje nós vamos te ensinar como utilizá-lo para exibir posts de uma categoria específica. No caso, aquela definida como “destaque”.
WordPress Revolution Slider
O WordPress Revolution Slider é excelente para a montagem de qualquer estilo de slider e para qualquer tipo de dispositivo. Muito utilizado para exibir imagens pré-definidas, o Revolution Slider também é uma ótima solução para exibir um ou mais sliders de posts destacados.
Instalação do plugin
Como o Revolution Slider é um plugin pago, você precisa baixá-lo pelo site dos desenvolvedores. Após isto, você pode instalá-lo por FTP ou Dashboard (Plugins > Adicionar Novo). Para ser redirecionado até a página de download, basta clicar no botão abaixo.
Após instalar e ativar o plugin, acesse a página de configuração do mesmo (Revolution Slider na lateral da Dashboard) para criarmos o nosso slider com posts destacados.
Defina a categoria de “destaque”
Você pode criar uma categoria que queira utilizar como destaque para o slider. Ponha o nome que desejar – neste tutorial estarei assumindo a categoria com nome “destaque”, mas você pode utilizar o nome “slider” para a montagem do seu site. Acessando Posts > Categorias você pode criar uma nova categoria ou alterar alguma existente, bem como excluir categorias.
Dessa forma, sempre que quiser exibir uma ou mais postagens como destaque no slider, você precisará marcar a categoria “destaque” que acabamos de criar. Será por meio dessa categoria que iremos montar e exibir o nosso slider de posts destacados.
Criação de template
Com o plugin instalado e ativado, bem como uma categoria definida e organizada para receber os posts “destacados”, podemos dar início aos trabalhos.
Já na página de configuração do plugin, acesse Revolution Slider na lateral da Dashboard, e clique no botão Create New Template Slider na seção Revolution Slider Templates.
Na página New Slider Template iremos definir apenas os campos obrigatórios. São eles:
- Slider Title – O nome que você quer atribuir ao slider – no tutorial estamos utilizando “Slider Posts Destacados”
- Slider Alias – Neste tutorial vamos utilizar “slider-posts-destacados”
- Slider Layout – Escolha o que melhor se encaixa com o seu layout (Fixed, Custom, Auto Responsive ou Full Screen). Neste tutorial vamos utilizar o Auto Responsive.
Com estas configurações já temos o básico para continuar a montagem do nosso slider de posts destacados. Sinta-se livre para personalizar do jeito que achar melhor, OK?
Depois de definir estas configurações, siga até o final da página e clique em Create Template.
Configuração de slide
Agora que já criamos o TEMPLATE para o nosso slider, precisamos configurar um slide padrão. O que vamos fazer é criar um slide e configurar seu comportamento e posição de elementos. Dessa forma, sempre que você adicionar um novo post, a imagem destacada irá aparecer no slider e seu título também.
Novamente na página de configuração principal do Revolution Slide, na área de Revolution Slider Templates clique em Edit Slides. Na nova página, clique em New Transparent Slide > Edit Slide.
Já na edição de slides, vamos configurar aparência da imagem de fundo. Role a página para baixo até encontrar a seção Slider Main Image / Background, marque a opção Image BG.
Agora você deve configurar como a imagem de destaque do post irá se comportar dentro do slider. Como exemplo, recomendo definir que a mesma se encaixe ma largura e altura do slider e com alinhamento total ao centro. Olha como ficaram as minhas configurações na imagem abaixo:
Com as configurações para o comportamento das imagens dos slides definidas, vamos configurar a posição do título do post dentro do slider. Siga até a seção Slide e clique no botão Add Layer, um layer será adicionado. Agora, role a página para baixo e abra a seção Layer General Parameters.
Você pode escolher o estilo para o título na listagem de estilos – estou utilizando o large_bg_black. Para conseguir exibir o título do seu post no slider, clique em Insert Meta e escolha Post Title. Suas configurações devem ficar como mostro na imagem abaixo:
Depois de alinhar o título do post no slide – você pode arrastar para o local que preferir, clique em Update Slide no fim da página para salvar todas as alterações.
Criação do slider
Voltando para a página de configuração principal do Revolution Slide, vamos iniciar a criação do slider em si. Calma que estamos quase acabando!
Logo no início da página principal de configuração do plugin você verá a opção Create New Slider, você deve clicar nela.
Escolha um nome para o Slider e também um Slider Alias (diferente daquele definindo em Slider Template).
A opção mais importante nesta página é escolher Source Type como Posts. Assim que fizer esta escolha, você verá os tipos de post e suas categorias – deixe Post selecionado e escolha a categoria que criamos para definir quando os artigos forem de destaque.
Aqui você também precisa escolher o Slide Template que criamos no tópico anterior. Essa opção fica no final da página, escolha o template e clique em Create Slider.
Inserção do slider numa página
Se você chegou até aqui é porque passou por todos os passos anteriores. Isso que dizer, que o template foi criado e configurado, bem como o slider para exibição de posts destacados também. O que falta agora é apenas inserir seu slider numa das páginas de seu site WordPress.
Na página principal do WordPress Revolution Slider você verá na listagem o slider que acabamos de criar e sua respectiva shortcode. Selecione e copie tal shortcode, colando em seguida na página em que deseja exibir seu slider.
Ufa! Agora sim terminamos todos os passos para a exibição do seu slider com posts destacados. Explore todas as configurações e possibilidade do plugin. Caso você queira exibir mais alguma informação, além do título do post no slide, é só configurar e salvar. Teste e experimente seu WordPress Revolution Slider até encontrar aquilo que você deseja.
Ferramentas WordPress Veja Mais Ferramentas
OptinMonster
WP Discuz
Hostinger
Tem como deixar um post fixo no Slider Revolution? Eu queria que aparecesse os posts mais recente mais um post fixo
Olá Carlos,
Desculpe o atraso. Se não me engano tem como deixar um post fixo.
Só não me lembro mais onde se encontra essa opção, vou ficar te devendo essa.
Abraço.
Boa noite. onde encontro essa opção —> Layer General Parameters.
Olá Gustavo,
Desde que escrevemos este artigo é possível que o nome das opções tenham sido modificadas. Tente procurar uma opção que seja semelhante a da imagem relacionada ao “Layer General Paramenters”. Que é o mesmo local onde você pode adicionar texto usando o Revolution Slider.
Vou agendar uma atualização para esse post, mas pode demorar um pouco.
Abraço.
Sabe me infirmar se é possível fazer com que ao clicar na imagem do slide a pessoa va para o post em questão ?
Olá Winchester,
É possível sim. Nessa parte do tutoria => https://www.canalwp.com/tutorial/exibir-posts-destacados-no-wordpress-com-revolution-slider/#Configuracao_de_slide na segunda imagem, onde tem %title% troque por %link%.
Desculpe o atraso na resposta.
Abraço!
obrigado Gabriel, só mais uma duvida, sabe como falo pro meu slide quando chegar na ultima imagem, voltar no inicio tipo um loop ?
Oi. qual foi o plugin que você utilizou para os slides de posts do seu site? Gostei muito do formato dele, mas já tentei usar todos esses que você indicou e não consegui o mesmo resultado.
Ola Bruno,
O slider de posts da pagina inicial não é um plugin, foi desenvolvido especialmente para o nosso site.
Abraço.
Nossa que legal… e você disponibilizaria o código para eu inserir também no meu site wordpress?
Bruno,
Não é questão de disponibilizar o código, ele foi desenvolvido utilizando codigos unicos em nosso site. Significa que você não pode utilizar o mesmo código sem ser em nosso tema.
Você precisaria contratar um desenvolvedor para fazer o mesmo trabalho no seu tema ou modificar algum plugin para que funcione dessa forma.
Abraço.
Sabe me infirmar se é possível fazer com que ao clicar na imagem do slide a pessoa va para o post em questão ?
Olá Winchester,
É possível sim. Nessa parte do tutoria => https://www.canalwp.com/tutorial/exibir-posts-destacados-no-wordpress-com-revolution-slider/#Configuracao_de_slide na segunda imagem, onde tem %title% troque por %link%.
Desculpe o atraso na resposta.
Abraço!
obrigado Gabriel, só mais uma duvida, sabe como falo pro meu slide quando chegar na ultima imagem, voltar no inicio tipo um loop ?
Winchester,
Nas configurações do slide geral no lado direito procure algo como “Stop Slide” e tenha certeza de desmarcar ou desligar essa opção.
Isso deve fazer com que o slide volte para o primeiro quando chegar ao fim.
Abraço!
Oi. qual foi o plugin que você utilizou para os slides de posts do seu site? Gostei muito do formato dele, mas já tentei usar todos esses que você indicou e não consegui o mesmo resultado.
Ola Bruno,
O slider de posts da pagina inicial não é um plugin, foi desenvolvido especialmente para o nosso site.
Abraço.
Nossa que legal… e você disponibilizaria o código para eu inserir também no meu site wordpress?
Bruno,
Não é questão de disponibilizar o código, ele foi desenvolvido utilizando codigos unicos em nosso site. Significa que você não pode utilizar o mesmo código sem ser em nosso tema.
Você precisaria contratar um desenvolvedor para fazer o mesmo trabalho no seu tema ou modificar algum plugin para que funcione dessa forma.
Abraço.