Quando você tem imagens que deseja exibir no seu site WordPress, colocá-las em uma galeria de imagens no estilo Pinterest é uma das maneiras mais populares de fazer isso. Tão popular, na verdade, que você encontrará muitos temas premium do WordPress que o utilizam.

Criá-lo também pode ser uma brisa-fizemos dessa forma com nossos Complementos Qi para Plugin Elementor . Entre os sessenta complementos do Elementor que você obtém no plug-in- o máximo que você encontrará em um plug-in gratuito -você encontrará um widget da galeria de imagens do Pinterest .

Mostraremos como você pode usar o widget para criar uma galeria de imagens no estilo Pinterest no WordPress em apenas algumas etapas. Criamos um tutorial em vídeo para quem prefere vídeos e vamos incorporá-lo aqui se quiser assisti-lo.

Se quiser ler como criamos uma das galerias de amostra, pode ver na página do widget, você pode ficar com este artigo.

Complementos Qi gratuitos Ver mais

Adicionando uma galeria de imagens de estilo do Pinterest no WordPress

Para poder acompanhar esta demonstração e criar suas próprias galerias de imagens incríveis no estilo Pinterest, você precisará de dois componentes principais- Elementor e nosso Complementos Qi para Elementor . Você também pode verificar nosso tema Qi WordPress gratuito se ainda não decidiu por um para o seu site, e você quer algo que pareça premium sem a etiqueta de preço premium.

Portanto, sua primeira etapa seria instalar e ativar o Elementor e, em seguida, instalar e ativar o plugin Qi Addons para Elementor. Feito isso, você pode prosseguir com a criação de uma nova página ou post onde deseja adicionar a galeria de imagens ou abrir um post ou página que deseja editar. De qualquer forma, pesquisar na guia Elementos por “Pinterest” abrirá o widget Galeria de imagens do Pinterest e arrastá-lo para uma seção gratuita será o suficiente para você começar.

O fato que não criamos nenhuma coluna antes de adicionar o widget não deve preocupar você. Nem a aparência um tanto simples e vazia do widget antes de haver qualquer imagem adicionada à galeria.

Este seria um bom momento para apontar que você provavelmente terá que cavar em torno de algumas configurações se você quero ter sua galeria de imagens realmente de largura total, como a que estamos mostrando aqui. Por padrão, a galeria pode estar em uma caixa, deixando algum espaço entre as bordas da galeria e as bordas da página. Pode depender do tema que você está usando e do layout que você escolheu.

Mostraremos como configuramos nosso layout e seção para que a galeria ocupe todo o largura da tela. Primeiro, nas configurações da página, você pode encontrar as opções de layout que permitem escolher a mais larga. No nosso caso, com o tema Qi, era a opção de largura total Qi. Se você estiver usando um tema diferente, selecione o modelo Elemento ou largura total ou uma opção semelhante que vem com seu tema.

Enquanto a escolha deste layout tornava a seção de largura total, seu conteúdo permanecia em uma caixa. Esta é a aparência de quando estávamos fazendo nossa galeria.

Para corrigir isso, precisávamos acessar o menu Editar Seção pressionando o botão do meio no topo da seção, aquele que não é o“ + ” para adicionar uma nova seção nem o “x” para excluir a seção existente. Nas opções de Editar Seção, escolhemos Largura Total para a nossa Largura do Conteúdo em vez da opção padrão em Caixa e definimos a opção Espaço nas Colunas como Sem lacuna.

Isso funcionou e nos deu a galeria mais ampla possível, sem lacunas. Você pode deixar a configuração em caixa ou escolher opções diferentes para as lacunas, é claro- é exatamente assim que fizemos quando estávamos criando o exemplo.

Configurando a galeria de imagens

Agora, a parte divertida-adicionar imagens e configurar a galeria. Na guia Conteúdo da galeria de imagens do Pinterest, você verá que as opções gerais permitem que você selecione imagens. Pressionar o botão para criar uma galeria o levará a um menu onde você pode escolher imagens de sua biblioteca de mídia ou fazer upload de novas. Escolhemos dez imagens que já estavam em nossa biblioteca de mídia.

Depois de criar a nova galeria e inseri-la no widget, você verá a aparência de uma galeria padrão. Como definimos as configurações de largura de antemão, o nosso era de largura total e vinha em três colunas com algum espaço entre os itens.

O próximo lote de configurações é onde você pode fazer algumas mudanças muito importantes para a galeria. A primeira opção nas Configurações da Galeria, por exemplo, permite que você escolha se deseja habilitar links personalizados para as imagens. Fazer isso, no entanto, desabilitará a opção de pop-up lightbox por padrão. As outras opções que você pode escolher incluem o número de colunas-que você pode definir para serem diferentes para telas de tamanhos diferentes, o espaço entre os itens, o efeito de foco da imagem e as cores de sobreposição para visualização regular e ao pairar.

Ativamos o pop-up Lightbox porque é uma opção muito útil. Escolhemos cinco colunas para nossa galeria, mas fizemos alguns ajustes nas opções de Colunas responsivas. Para os dois maiores tamanhos de tela, escolhemos cinco colunas. Para a próxima, definimos três e seguimos com dois antes de terminar com duas colunas únicas. Queríamos usar o espaço extra proporcionado pelas telas maiores para exibir mais colunas para um efeito estético agradável, mantendo as imagens grandes o suficiente. Tentar fazer o mesmo com uma tela menor e mais estreita tornaria as imagens muito pequenas. É por isso que quanto mais estreita a tela, menos colunas usamos. Eles ainda estarão lá, no entanto, apenas um abaixo do outro, em vez de um ao lado do outro.

Definimos o espaço entre os itens como zero e escolhemos a imagem para diminuir o zoom passe o mouse com o centro sendo a origem do zoom de foco da imagem. Optamos por não adicionar uma cor de sobreposição, tanto regular quanto flutuante , mas sinta-se à vontade para adicioná-la se quiser apimentar um pouco sua galeria. Apenas lembre-se de adicionar um grau de transparência a qualquer cor que você escolher, a menos que você queira bloquear completamente as imagens em sua galeria.

O toque final que aplicamos foi reordenar as imagens. Se você navegar de volta nas opções gerais, clicar na janela da Galeria permitirá que você edite a galeria. Basta mover as imagens para alterar a ordem em que aparecem na página. Depois de terminar e reinserir a galeria, este foi o resultado.

Vamos encerrar!

Dependendo da sua profissão e do propósito do seu site, as imagens podem ser as o tipo de conteúdo mais importante que você pode hospedar. É por isso que você deve ter uma maneira rápida e fácil de criar galerias e mostrá-las. Neste artigo, demonstramos como nosso plugin Qi Addons para Elementor pode fornecer essa opção graças ao widget Galeria de imagens do Pinterest.

Categories: Wordpress