Nota: Embora nossos guias mais populares tenham sido traduzidos para o português, alguns guias estão disponíveis apenas em inglês.
Estilizar uma Página de Galeria

You can adjust image size, change the design, and personalize your Gallery Page in the Site Styles panel.

Exibição de Página de Galeria

Cada Página de Galeria tem, como padrão, um dos seguintes estilos de exibição:

  • Slideshow - Exibe uma imagem ou vídeo por vez. Os visitantes podem clicar para avançar para o próximo slide ou a galeria pode ser configurada para reprodução automática. Passar o mouse sobre os slideshows pausa a reprodução automática. 
  • Grid - Displays content in a grid. Adjust the aspect ratio, padding, and number of thumbnails per row in Site Styles.
  • Stack (Pilha) - Exibe o conteúdo em uma única coluna com um pixel de margem entre cada imagem ou vídeo.
  • Carrossel - Exibe o conteúdo em uma linha horizontal. Os visitantes podem clicar para avançar ao próximo slide ou a galeria pode ser configurada para reprodução automática.

O formato de exibição da sua galeria depende do seu template.

Exibição da galeria por template

O estilo de sua Página de Galeria depende do template.

  • Padrão - A maioria dos templates usam a Página de Galeria padrão com grade/slideshow. Nesses templates, é possível configurar o formato com o ajuste Gallery Design (Design da Galeria) e usar os ajustes adicionais para estilizá-la ainda mais.
  • Exclusivo - Já outros templates têm Páginas de Galeria específicas, com recursos exclusivos, como ajustes de estilo e layout. Se seu template possui uma galeria exclusiva, acesse o guia do template para informações de estilização.

Veja como Páginas de Galeria são exibidas em cada template. Os templates são agrupados por família.

Template Tipo de Página de Galeria
Adirondack Slideshow/grade padrão
Avenue Somente slideshow

Família Aviator

Aubrey, Aviator

Slideshow/grade padrão

Família Bedford

Anya, Bryant, Bedford, Hayden

Slideshow/grade padrão

Família Brine

Aria, Basil, Blend, Brine, Burke, Cacao, Clay, Ethan, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Impact, Jaunt, Juke, Keene, Kin, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Pedro, Polaris, Pursuit, Rally, Rover, Royce, Sofia, Sonny, Sonora, Stella, Thorne, Vow, Wav, West

Slideshow/grade padrão

Família Farro

Farro, Haute

Slideshow/grade padrão
Five Slideshow/grade padrão
Flatiron Exclusivo: somente empilhado
Forte Exclusivo: carrossel por padrão. Clique no + em qualquer imagem para abrir um slideshow do lightbox.
Galapagos Slideshow/grade padrão
Ishimoto Exclusivo: somente carrossel
Momentum

Exclusivo: slideshow por padrão Clique no botão de grade para abrir uma exibição em grade.

Família Montauk

Julia, Kent, Montauk, Om

Exclusivo: somente empilhado
Native Slideshow/grade padrão

Família Pacific

Charlotte, Fulton, Horizon, Naomi, Pacific

Slideshow/grade padrão

Família Skye

Foundry, Indigo, Ready, Skye, Tudor

Slideshow/grade padrão
Supply Exclusivo: somente empilhado

Família Tremont

Camino, Carson, Henson, Tremont

Exclusivo: layouts empilhados, em tijolos ou em grade horizontal
Wells Unique: Slideshow or grid (Enable Gallery Thumbnails in Site Styles)
Wexley Exclusivo: grade por padrão. Clique em qualquer imagem para abrir um slideshow em lightbox.

Família York

Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori, York

Slideshow/grade padrão

Esses templates também suportam uma visualização de personalizada exclusiva chamada de Página de Projeto.

Páginas de Galeria dentro de uma Índice

Os templates a seguir são compatíveis com a adição de Páginas de Galeria a uma Índice. Os templates são agrupados por família.

Nota: Algumas Páginas de Galeria são exibidas de formas diferentes quando adicionadas a uma Página Índice. Por exemplo, uma Página de Galeria definida como slideshow pode aparecer empilhada quando aberta a partir de uma Página de Índice.
Template Notas
Avenue Empilhada quando aberta a partir do Índice

Família Brine

Família Brine - Aria, Basil, Blend, Brine, Burke, Cacao, Clay, Ethan, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Impact, Jaunt, Juke, Keene, Kin, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Pedro, Polaris, Pursuit, Rally, Rover, Royce, Sofia, Sonny, Sonora, Stella, Thorne, Vow, Wav, West

As seções da galeria são exibidas como uma grade ou slideshow

Flatiron

Exibe elementos de navegação quando aberto a partir do Índice

Forte

 

Momentum

 

Família Montauk

Montauk family Julia, Kent, Montauk, Om

Quando aberto a partir de um Índice, exibe elementos de navegação; os banners não são exibidos

Família Pacific

Charlotte, Fulton, Horizon, Naomi, Pacific

As seções da galeria são exibidas como uma grade ou slideshow

Supply

 

Família Tremont

Camino, Carson, Henson, Tremont

O slideshow da página inicial do Índice é exibido na parte inferior

Família York

Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori, York

 

Design responsivo e exibição móvel da Página da Galeria

Todos os templates do Squarespace têm design responsivo integrado para garantir que suas Páginas de Galeria sejam exibidas de forma adequada em qualquer dispositivo. Para visualizar a Página de Galeria em dispositivos móveis, use o Device View (Simulador de Dispositivos).

Para saber mais, acesse Como meu site será exibido em dispositivos móveis?

Reproduzir galerias automaticamente

Alguns templates permitem que você transite automaticamente entre imagens usando uma função de reprodução automática. Esta opção cria uma rolagem horizontal automática para que os visitantes não tenham que clicar para seguir à próxima imagem.

If your template offers an autoplay function for the Gallery Page, you’ll find this option in Site Styles. For example, in templates that use the standard slideshow/grid Gallery Page:

  1. Abra a Página de Galeria.
  2. Clique duas vezes em Pages (Páginas) na parte superior do painel para retornar ao Home Menu (Menu Inicial).
  3. Clique em Design.
  4. Click Site Styles.
  5. Desça até Gallery Styles (Estilos de Galeria).
  6. Marque Gallery Autoplay (Reprodução Automática de Galeria).
Nota: Se sua galeria incluir um vídeo, a reprodução automática impede que ele seja reproduzido completamente. Para evitar que seu vídeo seja cortado, adicione uma Imagem em Miniatura para permitir a sobreposição de imagens.

Galerias padrão com slideshow/grade

Muitos templates usam a galeria de grade/slideshow padrão. Em geral:

  • A visualização de grade é compatível com o lightbox.
  • Os links de URLs clicáveis funcionam tanto nas visualizações de grade quanto em slideshow.
  • URLs de Links Diretos funcionam tanto nas visualizações de grade quanto em slideshow.
  • Não há opções sem margem.
  • Exibição de legendas.
  • No lightbox, as legendas são exibidas ao passar o mouse.
Nota: o template Adirondack suporta somente URLs de links clicáveis e diretos na visualização em slideshow.

Para estilizar uma Página de Galeria padrão com slideshow/grade:

  1. Abra a Página de Galeria.
  2. From the Home Menu, click Design, then Site Styles
  3. Desça até Gallery Styles (Estilos de Galeria).
  4. Use o ajuste Gallery Design (Design da Galeria) para escolher Slideshow ou Grid (Grade).

Diferentes ajustes aparecerão dependendo do formato escolhido. 

Esses ajustes são disponibilizados quando o Gallery Design (Design da Galeria) está definido como Grid (Grade):

  • Aspect Ratio (Relação de Aspecto) - Controla a relação de aspecto (largura:altura) do slide ativo da galeria. Se a relação de aspecto estiver configurada como Auto, as imagens são reorganizadas para criar o melhor encaixe na página. Elas podem ser exibidas em uma ordem diferente da ordem em que foram carregadas.
  • Grid Spacing (Espaçamento da Grade) - Aumenta a margem entre as imagens individuais na grade.
  • Min Column Width (Largura Mínima da Coluna) - Configura a largura das colunas na grade.
  • Lightbox Style (Estilo do Lightbox): Dark (Escuro), Light (Claro)

Esses ajustes são disponibilizados quando o Gallery Design (Design da Galeria) está definido como Slideshow:

  • Gallery Navigation (Navegação da Galeria): Thumbnails (Miniaturas), Bullets (Lista de Pontos), Numbers (Números), Circles (Círculos), Simple (Simples), None (Nenhum) - Tipo de navegação fornecida na página.
  • Gallery Info Overlay (Sobreposição de Informações da Galeria): Always Show (Sempre Mostrar), Show on Hover (Mostrar ao passar sobre), Hide (Ocultar) - Tipo de exibição usada para títulos e legendas de imagens.
  • Gallery Aspect Ratio (Relação de Aspecto da Galeria) - Controle a relação de aspecto (largura:altura) do slide ativo da galeria. Use com o ajuste Gallery Auto Crop (Recorte Automático da Galeria).
  • Gallery Arrow Style (Estilo da Seta da Galeria): Round Corners (Cantos Arredondados), Rectangular (Retangular), Circular, No Background (Sem Plano de Fundo) - Estilize as setas usadas para alternar entre os slides.
  • Gallery Transitions (Transições da Galeria): Fade (Desaparecer), Scroll (Rolar)
  • Gallery Show Arrows (Setas de Exibição da Galeria) - Desmarque para ocultar as setas na exibição da galeria
  • Gallery Auto Crop (Recorte Automático da Galeria) - Recorte automaticamente as imagens para a relação de aspecto definida no ajuste Gallery Aspect Ratio (Relação de Aspecto da Galeria).
  • Gallery Autoplay (Reprodução Automática da Galeria) - Alterne automaticamente as imagens da galeria sem interação do usuário.
  • Gallery Loop (Ciclo da Galeria) - Habilite a galeria para alternar para o primeiro slide após o último slide.
  • Gallery Autoplay Speed (Velocidade de Reprodução Automática da Galeria) (seg)  
  • Gallery Thumbnail Size (Tamanho da Miniatura da Galeria) - Controle a altura das imagens de miniatura usadas para navegação da galeria.
  • Gallery Arrow Background (Plano de Fundo da Seta da Galeria)  
  • Gallery Arrow Color (Cor da Seta da Galeria)  
  • Gallery Circle Color (Cor do Círculo da Galeria)  
  • Gallery Info Background (Plano de Fundo das Informações da Galeria) - Cor usada de plano de fundo dos títulos e legendas da imagem.
Nota: Se você possui múltiplas Páginas de Galeria em seu site, esses ajustes afetam todas elas. 

Links especiais

A Página de Galeria padrão com slideshow/grade suporta link direto e links de URL.

  • URL de links direto são URL individuais atribuídos a cada imagem para que você possa enviar o visitantes diretamente para qualquer imagem dentro da Página de Galeria. É possível personalizar o URL do link direto para cada imagem.
  • Os links de URL permitem transformar qualquer imagem em uma galeria em um link para páginas externas, páginas internas ou arquivos. No formato de grade, os links de URL desabilitam o recurso de lightbox.

Galerias exclusivas do template

Todas as famílias de templates que não usam o formato padrão de slideshow/grade possuem uma galeria exclusiva com suas próprias opções de estilo. Para informações sobre a galeria do seu template, acesse o guia do template.

Legendas

Para templates que possuem uma Página de Galeria padrão com slideshow/grade:

  • Slideshow - O texto pode ser ocultado, exibido ao passar sobre a imagem ou sempre ser exibido.
  • Grid (Grade) - O texto será exibido ao passar sobre a imagem na visualização do lightbox.
  • O texto nunca é exibido para vídeos.

É assim que os títulos e descrições da imagem aparecem em cada Página de Galeria exclusiva do template. Os templates são agrupados por família.

Dica: Para informações sobre a estilização das fontes da legenda, acesse Estilizar legendas das imagens.

Avenue

O texto só será exibido quando a Página de Galeria for parte de uma Índice.

Flatiron

O texto nunca será exibido.

Forte

O texto sempre será exibido.

Ishimoto

O texto pode ser ocultado ou sempre ser exibido.

Momentum

O texto sempre será exibido ao clicar no ícone "i".

Família Montauk

Julia, Kent, Montauk, Om

O texto sempre será exibido.

Supply

O texto é exibido para uma imagem em uma sobreposição ao clicar no ícone + que aparece ao passar sobre.

O texto nunca é exibido para vídeos.

Família Tremont

Camino, Carson, Henson, Tremont

Escolha em Captions Display (Exibição de Legendas): On Hover (Ao passar sobre) ou Always (Sempre). Ao passar sobre, as legendas aparecem ao passar sobre o ícone de círculo no canto direito inferior.

No layout empilhado, é possível exibir as Captions Below Image (Legendas Embaixo da Imagem). Escolha Captions Display (Exibição das Legendas): Always (Sempre) para habilitar esse ajuste.

Wells

O texto sempre será exibido.

Wexley

Os títulos da imagem são exibidos ao passar sobre. Use o ajuste Enable Thumbnail Hover (Habilitar passar sobre a miniatura) para exibir ou ocultar os títulos. 

Os títulos de imagem nunca são exibidos no lightbox ou no celular. As descrições das imagens nunca são exibidas.

Família York

Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori, York

O York possui a Página de Galeria padrão com slideshow/grade.

Para a Página de Projeto, o texto pode ser exibido na página ao lado ou embaixo das imagens, dependendo da orientação delas. Saiba mais.

Navegação pelo teclado

A maioria dos templates suporta o uso das setas do teclado para navegar pelas imagens.

Para a Página de Galeria padrão com slideshow/grade:

  • Visualização em slideshow - Suportado
  • Lightbox - Não suportado

Para todas as Páginas de Galeria exclusivas do template que possuem visualizações em slideshow, carrossel e lightbox, a navegação pelo teclado é suportada.

Dica: Pode ser necessário clicar na página antes da navegação pelo teclado funcionar.

Mais opções de estilo

Para criar um visual diferente do disponível na Página de Galeria de seu template, existem algumas alternativas possíveis:

Também é possível criar múltiplas galerias com diferentes estilos de exibição usando uma combinação de Páginas de Galeria e Páginas Simples com Blocos de Galeria

Próximo passo

Organize sua Página de Galeria ordenando o conteúdo e adicionando tags e categorias.

Esse artigo foi útil?
Usuários que acharam isso útil: 31 de 101
Estilizar uma Página de Galeria