O Slider é geralmente a primeira sessão com a qual o usuário se depara ao entrar num site. Desta maneira, ele funciona como a vitrine de uma loja, ou a capa de um livro, portanto é de extrema importância que o slider contenha informações atrativas e publicitárias para quem está acessando seu site.
O Slider funciona de maneira similar a uma apresentação em powerpoint. Cada apresentação é composta por um número específico de slides que vão se alternando em sequência.
Neste tutorial iremos aprender como criar e editar um Slider.
1)
Na barra do menu lateral (à esquerda) localize a opção “Slider Revolution”.
2)
Na área “Revolution Sliders” estão as apresentações disponíveis no seu site. É possível criar diferentes apresentações clicando no botão “+Novo slider”, porém no exemplo deste tutorial iremos editar um Slider já pronto.
Como podemos ver na imagem, o nome da apresentação que iremos editar é “Alex Sacchi Design” e ela possui “2” slides. Para começar, vamos clicar sobre o nome da apresentação que queremos editar.
3)
Na área “Configurações do slide” podemos definir um nome e o tamanho do slide. No tutorial não iremos entrar nesses detalhes.
Na aba seguinte encontra-se o “Editor de Slides” / “Slide editor“
Esta é a página do editor de slides. Na parte superior estão os 2 tempos do slide conforme pudemos ver no item anterior. Os slides ativos estão indicados por indicados por #1 e #2.
Ao passar o cursor do mouse sobre cada slide é possível determinar se aquele slide específico irá aparecer na apresentação ou não. Para deixar o slide ativo clique no ícone verde e para desativá-lo selecione o ícone vermelho.
É possível ativar ou desativar um slide a qualquer momento. Isso pode ser útil no caso de uma promoção ou chamada que ocorre de tempos em tempos, como dia das mães ou Natal. Podemos também selecionar a ordem de aparição de cada slide segurando o clique sobre um slide e arrastando ele para a posição desejada.
4)
O próximo passo é escolher qual slide iremos editar. Neste tutorial selecionaremos o segundo slide da sequência.
5)
No menu abaixo, na aba “Main Background” podemos escolher a imagem que aparecerá no fundo do slide. Para adicionar uma imagem basta selecionar a opção “Main/Backgorund Image” e clicar no botão “Media Library”.
Aqui podemos selecionar uma imagem da biblioteca do site ou adicionar uma nova imagem clicando em “Enviar Arquivos”. Após selecionar a imagem clique em “Insert“.
Selecionando um dos outros itens abaixo é possível escolher outras opções de fundo do slide, como por exemplo um fundo transparente, uma cor sólida ou um vídeo de fundo.
6)
Rolando a página um pouco abaixo podemos ver a pré-visualização do Slide. Agora precisamos adicionar alguns elementos como os textos e imagens que aparecerão por cima do fundo selecionado. Para isso, iremos para o menu abaixo.
Para adicionar um novo elemento clique em “Adicionar Camada”.
Text: Insere um texto ou título. É possível alterar a fonte, tamanho e cor do texto no menu “Estilo”. Para alterar a posição do texto basta arrastá-lo para o local desejado do slide.
Image: Insere uma imagem. Como estamos trabalhando com camadas, é recomendado que a imagem inserida esteja em formato PNG, com fundo recortado.
*Neste exemplo, a palavra Google que inserimos aqui é uma imagem recortada!
Button: Insere um botão. É possível selecionar um dos modelos já definidos ou criar um botão personalizado utilizando o menu à direita. Com o botão posicionado no slide é possível alterar o texto clicando duas vezes sobre ele.
Após adicionar o botão é preciso definir o que acontecerá ao clicar nele.
Com o botão selecionado, clique no menu “Ações” e selecione “+”. Procure as opções “click” e “simple link”. Na área “Link Url” digite ou cole o endereço para o qual o botão irá direcionar.
7)
Para confirmar as alterações realizadas, basta localizar no menu superior o ícone com o disquete e clicar em “Save Slide”.
8)
Com um pouco mais de prática você pode selecionar diferentes transições e até mesmo criar animações para os elementos do seu slide.
Um Slider bonito e bem resolvido faz toda a diferença, porém não podemos deixar de lado a usabilidade. Evite utilizar vídeos e imagens grandes que podem afetar o tempo de carregamento do seu site. Lembre-se que hoje em dia muitos usuários utilizam plataformas mobile com planos de dados limitados.
This website uses cookies to improve your experience while you navigate through the website. Out of these, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of basic functionalities of the website. We also use third-party cookies that help us analyze and understand how you use this website. These cookies will be stored in your browser only with your consent. You also have the option to opt-out of these cookies. But opting out of some of these cookies may affect your browsing experience.
Necessary cookies are absolutely essential for the website to function properly. These cookies ensure basic functionalities and security features of the website, anonymously.
Cookie
Duração
Descrição
cookielawinfo-checkbox-advertisement
1 year
Set by the GDPR Cookie Consent plugin, this cookie is used to record the user consent for the cookies in the "Advertisement" category .
cookielawinfo-checkbox-advertisement
1 year
Set by the GDPR Cookie Consent plugin, this cookie is used to record the user consent for the cookies in the "Advertisement" category .
cookielawinfo-checkbox-analytics
11 months
This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Analytics".
cookielawinfo-checkbox-analytics
1 year
Set by the GDPR Cookie Consent plugin, this cookie is used to record the user consent for the cookies in the "Analytics" category .
cookielawinfo-checkbox-functional
11 months
The cookie is set by GDPR cookie consent to record the user consent for the cookies in the category "Functional".
cookielawinfo-checkbox-necessary
11 months
This cookie is set by GDPR Cookie Consent plugin. The cookies is used to store the user consent for the cookies in the category "Necessary".
cookielawinfo-checkbox-necessary
1 year
Set by the GDPR Cookie Consent plugin, this cookie is used to record the user consent for the cookies in the "Necessary" category .
cookielawinfo-checkbox-others
11 months
This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Other.
cookielawinfo-checkbox-others
1 year
Set by the GDPR Cookie Consent plugin, this cookie is used to store the user consent for cookies in the category "Others".
cookielawinfo-checkbox-performance
11 months
This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Performance".
cookielawinfo-checkbox-performance
1 year
Set by the GDPR Cookie Consent plugin, this cookie is used to store the user consent for cookies in the category "Performance".
elementor
never
This cookie is used by the website's WordPress theme. It allows the website owner to implement or change the website's content in real-time.
elementor
never
This cookie is used by the website's WordPress theme. It allows the website owner to implement or change the website's content in real-time.
viewed_cookie_policy
11 months
The cookie is set by the GDPR Cookie Consent plugin and is used to store whether or not user has consented to the use of cookies. It does not store any personal data.
Functional cookies help to perform certain functionalities like sharing the content of the website on social media platforms, collect feedbacks, and other third-party features.
Performance cookies are used to understand and analyze the key performance indexes of the website which helps in delivering a better user experience for the visitors.
Analytical cookies are used to understand how visitors interact with the website. These cookies help provide information on metrics the number of visitors, bounce rate, traffic source, etc.
Cookie
Duração
Descrição
_ga
2 years
The _ga cookie, installed by Google Analytics, calculates visitor, session and campaign data and also keeps track of site usage for the site's analytics report. The cookie stores information anonymously and assigns a randomly generated number to recognize unique visitors.
_ga
2 years
The _ga cookie, installed by Google Analytics, calculates visitor, session and campaign data and also keeps track of site usage for the site's analytics report. The cookie stores information anonymously and assigns a randomly generated number to recognize unique visitors.
_ga_VFPSS1J8BL
2 years
This cookie is installed by Google Analytics.
_ga_VFPSS1J8BL
2 years
This cookie is installed by Google Analytics.
_gat_gtag_UA_27849698_1
1 minute
Set by Google to distinguish users.
_gat_gtag_UA_27849698_1
1 minute
Set by Google to distinguish users.
_gid
1 day
Installed by Google Analytics, _gid cookie stores information on how visitors use a website, while also creating an analytics report of the website's performance. Some of the data that are collected include the number of visitors, their source, and the pages they visit anonymously.
_gid
1 day
Installed by Google Analytics, _gid cookie stores information on how visitors use a website, while also creating an analytics report of the website's performance. Some of the data that are collected include the number of visitors, their source, and the pages they visit anonymously.
CONSENT
2 years
YouTube sets this cookie via embedded youtube-videos and registers anonymous statistical data.
CONSENT
2 years
YouTube sets this cookie via embedded youtube-videos and registers anonymous statistical data.
Advertisement cookies are used to provide visitors with relevant ads and marketing campaigns. These cookies track visitors across websites and collect information to provide customized ads.