Como criar imagens deslizantes no Elementor

Publicados: 2021-08-05

Quando você visita qualquer site da Web, uma das primeiras coisas que você notará é um controle deslizante na parte superior ou no meio da página. O principal motivo de eles serem tão comuns é que os visitantes do site os adoram e os proprietários de sites os consideram extremamente úteis. Os slides são uma ótima maneira de exibir uma variedade de informações de uma forma que mantém os visitantes do seu site engajados.

Elementor é uma ferramenta útil que permite criar controles deslizantes atraentes e carrosséis de imagens com apenas alguns passos. Nosso guia irá guiá-lo através da criação de controles deslizantes e carrosséis Elementor modernos para o seu site.

Projeto 1 dos carrosséis de imagens

Sliders Elementor populares

Elementor tem alguns controles deslizantes diferentes para escolher, alguns dos mais populares são; o widget Elementor Slider , o Smart Slider, o Layer Slider e o Revolution Slider. Há um widget de carrossel disponível para usuários básicos e vários disponíveis para usuários profissionais. Todos os widgets, independentemente da classe da conta, são totalmente integrados, o que os torna fáceis de configurar e, ao mesmo tempo, criam uma experiência de usuário perfeita.

O mais fácil de usar é o widget Elementor Slider, que abordaremos neste artigo. Embora alguns usuários possam achar fácil desenvolver seus sites, outras pessoas podem achar mais difícil. Em qualquer caso, recomendamos consultar uma empresa de design de sites dedicada em Manchester, como a Blue Whale Media, para ajudá-lo com seu design e desenvolvimento web.

Criação de controles deslizantes no Elementor

Fazer slides no Elementor não é tão complicado quanto você pode pensar. No painel de sua conta, se você estiver usando a versão básica do Elementor, selecione o widget Carrossel. Este widget permitirá que você crie galerias de imagens cheias de imagens básicas que parecem atraentes no seu site e na versão mobile do seu site. Você pode carregar novas imagens de seu laptop ou pode selecionar imagens existentes da biblioteca de mídia.

Você pode acessar o console do Elementor clicando em sua galeria de imagens e, em seguida, no menu suspenso do lado esquerdo, clique em criar uma galeria. Selecione todas as imagens que deseja exibir, clique na imagem. Uma marca de seleção aparecerá no canto superior direito da imagem e uma cópia também será exibida na parte inferior da tela. Depois de selecionar as imagens para o controle deslizante, você pode fazer personalizações adicionais nas imagens e no próprio controle deslizante.

No painel do widget, escolha o tamanho das imagens que deseja exibir e quantas imagens deseja que apareçam no painel, uma ao lado da outra. Você também pode escolher a velocidade de rolagem no menu suspenso no painel de widgets. Selecione o número de imagens que deseja rolar de uma vez.

Por exemplo, você pode definir a rolagem para uma imagem por vez ou pode fazer com que um conjunto de imagens role para o próximo painel ao mesmo tempo. Para controles deslizantes com um grande número de imagens, 2-3 por rolagem é o ideal.

Projeto 2 dos carrosséis de imagens

Elementor Pro Slider

No painel de sua conta, se você estiver usando a versão profissional do Elementor, poderá escolher entre vários widgets de controle deslizante. Isso permite que você faça todas as mesmas coisas que o controle deslizante básico, mas com um conjunto expandido de opções. A opção de adicionar um título e uma descrição para cada imagem está disponível, e você também pode escrever uma legenda que será exibida na parte inferior de cada imagem no slide. Essa é uma ótima maneira de incorporar palavras-chave ou colocar uma frase de chamariz em seus slides.

Acesse o painel de configurações do Elementor e abra sua galeria. Adicione imagens clicando nelas. Haverá um conjunto expandido de opções no lado esquerdo da tela. Você pode selecionar cores ou imagens para colocar no fundo de cada slide ou pode aplicar uma sobreposição colorida. Se você estiver se sentindo muito criativo, também pode ajustar o modo de mesclagem de fundo.

Personalizando seus controles deslizantes de imagem

Uma ampla variedade de opções de personalização está disponível para seus controles deslizantes de imagem Elementor. Para acessar esses recursos, basta clicar na guia de estilo no lado superior esquerdo da tela. A partir daqui, você pode ajustar o tamanho e as configurações da borda, o espaçamento da imagem e até mesmo o filtro e as sombras de cada imagem. Enfeite seu controle deslizante adicionando pontos ou setas na parte inferior. Você também pode alterar a cor, o tamanho e a forma deles na guia de estilo. Isso dará aos visitantes do site uma dica visual de quantas imagens estão no slide, além de fornecer uma maneira de rolar manualmente pelas imagens em seu controle deslizante.

Um atalho para a criação de slides de imagens no Elementor

Se você está apenas procurando uma maneira rápida de adicionar um controle deslizante de imagem ao seu site ou WordPress com Elementor, este atalho pode ajudar. Clique na página de edição ou adicione uma nova página no lado esquerdo da tela. Então, com o botão Elementor, clique em editar. Um painel será aberto à sua esquerda, a partir do painel, procure e selecione a opção do widget de controle deslizante. Arraste o widget do painel e solte o elemento em sua página. Isso posicionará o controle deslizante e acionará um novo painel para as configurações do controle deslizante abrir. Selecione as configurações desejadas após enviar as imagens desejadas do seu computador ou galeria de mídia. Uma vez que suas seleções de final, clique em atualizar. Seu novo slide de imagem Elementor está pronto para ir!

Projeto 3 dos carrosséis de imagens

Criação de carrosséis de imagens alternativas no Elementor Pro

Criar um carrossel de mídia no Elementor é fácil. O widget permitirá que você gere um controle deslizante de miniatura com imagens maiores opcionais em uma caixa de luz. Semelhante a um controle deslizante normal, o controle deslizante de mídia permite que você selecione e exiba o conteúdo diretamente de sua galeria e configure-o para rolar. A diferença com este widget é que você pode usar vídeos de sua galeria de mídia ou fazer uso de URLs de vídeo do Vimeo e YouTube na área de lightbox. As instruções para configurar este controle deslizante são iguais às instruções básicas e profissionais do controle deslizante de imagem, mas usando vídeos em vez de imagens estáticas.

Você também pode usar o Widget de Críticas para criar um controle deslizante que apresenta imagens e texto. Esta é uma ótima maneira de mostrar o feedback do cliente com palavras reais e uma imagem que eles forneceram de seu produto ou serviço. Este controle deslizante pode ser definido na parte superior ou inferior da sua página da web e definido para rolar da mesma forma que os controles deslizantes normais. Com tantas opções de controle deslizante disponíveis, criar um site responsivo e esteticamente agradável está a apenas alguns cliques de distância.