O bloco de Galeria permite que você adicione e estilize sem esforço belas galerias de imagens em suas páginas da web, aprimorando o apelo visual do seu conteúdo.
Basta fazer o upload de suas imagens, escolher quantas colunas exibir e configurar opções de link e tamanho — tudo sem escrever nenhum código. É a maneira mais rápida de adicionar uma galeria de imagens limpa e baseada em grade a qualquer página do SeedProd.
Adicionando o Bloco de Galeria às Suas Páginas
Siga estas etapas para adicionar um bloco de Galeria à sua página do SeedProd:
Etapa 1: Adicionar o Bloco
Em Design > Blocos, arraste e solte o bloco Galeria na seção desejada da sua página.
Arraste o bloco Galeria do painel Blocos e solte-o no layout da sua página.
Etapa 2: Configurar as Definições de Conteúdo
Uma vez adicionado, clique no bloco Galeria para abrir suas configurações. Na aba Conteúdo, faça o upload de suas imagens e configure como a galeria é exibida.
Imagens da Galeria:
- Imagens: Faça o upload das fotos que você deseja exibir em sua galeria. Você pode selecionar várias imagens de uma vez de sua biblioteca de mídia do WordPress.
Configurações:
- Coluna: Defina o número de colunas usadas para organizar as imagens da sua galeria na grade, de 1 a 10.
- Espaçamento: Ajuste o espaço entre as imagens da galeria para controlar o quão juntas ou separadas as imagens ficam umas das outras.
- Link: Escolha o que acontece quando um visitante clica em uma imagem da galeria — Nenhum (sem ação), Arquivo de Mídia (abre a imagem em tamanho real) ou Anexo (link para a página de anexo da imagem no WordPress).
- Tamanho da Imagem: Selecione o tamanho da imagem do WordPress a ser carregado — Miniatura, Médio ou Grande. Escolher um tamanho menor pode ajudar a melhorar o desempenho de carregamento da página.
- Ordenar por: Escolha como as imagens são classificadas — Padrão (a ordem em que você as carregou) ou Aleatório (embaralhado a cada carregamento da página).
- Lightbox: Quando o Link estiver definido como Arquivo de Mídia, ative esta opção para abrir as imagens clicadas em uma sobreposição de lightbox em tela cheia em vez de sair da página.
A aba Conteúdo permite que você faça o upload de imagens e configure colunas, espaçamento, comportamento do link, tamanho da imagem e ordem de exibição.
Etapa 3: Personalizar o Design
Na aba Avançado, você pode personalizar a aparência visual do seu bloco de Galeria.
Estilos:
- Sombra: Aplique uma sombra projetada às suas imagens de galeria. Escolha entre Nenhuma, Fina, Pequena, Média, Grande, X Grande, 2X Grande ou Sombra Projetada Inferior para adicionar profundidade e dimensão às suas fotos.
- Cor do Texto: Defina a cor de qualquer texto exibido dentro da galeria, como legendas sobrepostas.
- Borda da Imagem: Adicione uma borda ao redor de cada imagem da galeria. Configure o Estilo da Borda (Sólida, Pontilhada ou Tracejada), Largura da Borda, Cor da Borda, Raio da Borda (para arredondar os cantos da imagem) e Preenchimento de Espaço em Branco da Imagem para controlar o espaço entre a imagem e sua borda.
Espaçamento:
- Margem: Controle o espaçamento externo ao redor do seu bloco de Galeria (Superior, Direita, Inferior, Esquerda). Isso determina quanto espaço aparece entre a galeria e os elementos ao redor na página.
- Preenchimento: Ajuste o espaçamento interno dentro do seu bloco de Galeria (Superior, Direita, Inferior, Esquerda). Isso cria espaço entre a galeria e as bordas do bloco.
Atributos:
- ID CSS: Exibe o identificador exclusivo gerado automaticamente para o seu bloco de Galeria. Este ID é criado automaticamente pelo SeedProd para estilização personalizada ou segmentação por JavaScript.
- Classe Personalizada: Adicione classes CSS personalizadas para aplicar estilos específicos do seu tema ou CSS personalizado.
- Atributos Personalizados: Adicione quaisquer atributos HTML ao elemento wrapper da galeria. Insira cada atributo em uma nova linha usando o formato: nome-do-atributo|valor (por exemplo, data-galeria|portfólio).
Visibilidade do Dispositivo:
- Ocultar no Desktop: Oculte o bloco de Galeria em telas de desktop.
- Ocultar no Tablet: Oculte o bloco de Galeria em dispositivos tablet.
- Ocultar no Celular: Oculte o bloco de Galeria em dispositivos móveis.
Efeitos de Animação:
- Animação de Entrada: Escolha entre vários efeitos de animação que são reproduzidos quando o bloco de Galeria entra na tela. As opções incluem Bounce, Fade In, Zoom In, Rotate In e muitas outras, adicionando um toque polido enquanto os visitantes rolam a página.
A aba Avançado oferece predefinições de sombra, cor do texto, estilo de borda da imagem, controles de espaçamento e opções de visibilidade do dispositivo.
Etapa 4: Salve Suas Alterações
Depois de terminar de configurar o bloco de Galeria e personalizar sua aparência, certifique-se de salvar seu trabalho.
Você adicionou com sucesso um bloco de Galeria à sua página! O bloco de Galeria facilita a exibição de fotos, portfólios ou qualquer conteúdo visual em um layout de grade limpo. Experimente diferentes contagens de colunas, espaçamento, estilos de sombra e opções de borda para criar uma galeria que complemente perfeitamente o design da sua página.