Quem contratou um plano de hospedagem na Hostbits tem acesso ao construtor de sites da plataforma, que é uma ferramenta completa, pensada para possibilitar a construção de sites de um modo fácil e com layouts profissionais, mesmo que o design do site não entenda muito de programação Web.
Entre as ferramentas disponíveis no construtor, encontra-se a de inserção de galerias de imagens. Se você começou a construir o seu site e deseja inserir uma galeria de imagens interativa e que traga imagens importantes para o conteúdo da página, este tutorial vai te ajudar a tirar todas as dúvidas sobre a inserção de galerias, confira!
1 – Inserindo a galeria
Para inserir uma galeria em seu site é muito simples, basta acessar o seu Layout e escolher o espaço em que você quer inserir a galeria.
Em seguida, procure o ícone de Galeria no menu superior. Arraste o ícone até o local onde você quer que a galeria esteja localizada.
Uma janela de escola de galeria vai aparecer. Veja todas as opções e selecione a que mais gostar. Existem muitas opções, neste tutorial escolhemos a galeria em formato de Lista.
Depois de escolher, basta posicionar a galeria no espaço em que você escolheu.
2 – Editando a galeria
Existem 3 botões na parte superior da galeria. O primeiro é o cursor de mover a galeria pela tela. O do meio serve para aumentar ou diminuir o espaço de fundo da galeria e o terceiro é um lápis de edição, por onde você acessa um menu com várias opções de edição e formatação da galeria.
3 – Alterando e inserindo imagens à galeria
Todas as galerias já vem com imagens modelo, para alterar as imagens da galeria e inserir as de sua preferência, clique no ícone de lápis para acessar o menu e selecione a opção Alterar Imagens.
Uma janela de configuração da galeria vai aparecer, na qual você poderá visualizar as imagens existentes e editá-las, de acordo com o mapa da imagem a seguir:
1 – Ao selecionar uma imagem, clicando sobre ela, um ícone de X aparece. Através dele você pode excluir uma imagem.
2 – Você pode adicionar um título de sua preferência na imagem, esse título vai aparecer quando a imagem estiver na galeria.
3 – Se você quiser que a imagem direcione o visitante do seu site para uma outra página, âncora, ou outro site, você pode adicionar um link à imagem.
4 – A Descrição nada mais é do que a legenda da imagem, que ficará visível também para o visitante.
5 – Você pode adicionar mais imagens selecionando Adicionar imagens (botão verde) ou Adicionar novo.
Existe a possibilidade de adicionar imagens relacionadas ao tema ou layout que você escolheu na hora de criar o site (1) ou de carregar uma imagem do seu computador. Você também pode ir em Biblioteca de mídia (3) e acessar imagens que você tenha carregado anteriormente.
Existe ainda uma galeria gratuita (4) onde você pode encontrar bastante variedade de imagens, que podem ser procuradas a partir de um tema de sua preferência (5)
Depois que fizer todas as alterações nesta janela, não esqueça de clicar em Aplicar, para que as alterações sejam salvas.
4 – Mudando o layout da galeria
É possível alterar o tipo de layout mesmo depois de ter feito a escolha inicial, basta ir em Editar > Alterar tipo e escolher a melhor opção para o seu site.
5 – Alterando a cor da galeria
Para alterar a cor de fundo do layout, basta ir no ícone de Editar e selecionar a opção Alterar Cor.
A seguinte janela irá aparecer:
É possível escolher uma cor movimentando o cursor (1) e alterar a transparência da galeria (2). Você também pode inserir um código hexadecimal de cor (3) para definir uma cor exata. Quando decidir a cor, clique em aplicar e pronto, sua galeria terá uma nova cor.
6 – Ajustes para edição da galeria no layout
Na janela de exibição também existe uma seção com 4 opções para facilitar a edição da galeria no Layout, são elas:
1 – Bloquear: permite que você trave a galeria em um ponto específico da tela, evitando mudá-la de posição por acidente enquanto edita alguma outra parte do site.
2 – Ordem: permite que você altere a ordem da galeria do Layout, se algo vai ficar na frente dela, ou se ela ficará à frente de todos os outros objetos de layout.
3 – Excluir: como o próprio nome já diz, permite que você exclua a galeria inteira.
4 – Ocultar: oculta a galeria do layout, deixando-a invisível.
7 – Configurando propriedades mais avançadas
Por último, existem algumas outras configurações mais avançadas que podem ser efetuadas em Propriedades, conforme o mapa das próximas imagens:
1 – A primeira Aba das propriedades traz as configurações gerais da Galeria, é possível acessar o atalho para editar imagens (2), alterar a cor do plano de fundo (3) e inserir uma borda (4), também é possível alterar o tipo de galeria (5) e realizar configurações avançadas (6), como alterar o tamanho da miniatura de fotos ou definir se a imagem vai ficar maior quando o visitante clicar sobre uma foto.
7 – A segunda Aba oferece opções de configuração das legendas. Nela é possível definir se a legenda da foto aparecerá sempre ou apenas quando o mouse estiver encostado (8) e se haverá um fundo de outra cor na legenda (9).
10 – Ainda na aba de legendas, é possível alterar o tipo da fonte do título da imagem, bem como o tamanho, espaçamento entre letras, estilo, alinhamento e cor.
11 – É possível alterar também a fonte da legenda (descrição) da foto, também mudando o tipo e o tamanho da fonte, o espaçamento entre letras, estilo, alinhamento e cor.
12 – Na aba de opções, é possível escolher se a galeria vai ocupar a tela inteira ou não, se será exibida apenas em uma página, em todas ou em algumas páginas específicas e também é possível regular o tamanho e a posição da galeria de maneira mais precisa do que arrastando, através da definição de quantidade de pixels.
13 – Ainda na aba de opções, é possível também vincular a galeria a uma âncora, através da inserção do nome da âncora.
14 – Por fim, depois de fazer qualquer alteração na janela de propriedades, lembre sempre de clicar em aplicar, para que a configuração seja salva.