O estilo e recursos da família de templates Montauk.
A família de templates Montauk (Julia, Kent, Montauk, Om) apresenta banners de página e um índice de navegação em miniatura versátil, colocando suas informações, produtos ou história de amor no centro das atenções.
Este guia aborda os recursos e as opções de design da família Montauk. Os ajustes de estilos do site e a seção em que aparecem no painel Estilos do site estão em negrito.
Páginas aceitas
Os templates Montauk aceitam os seguintes tipos de página:
- Páginas de Álbum
- Páginas de Blog — lista
- Páginas de Entrada
- Páginas de Eventos
- Páginas de Galeria - Empilhadas
- Páginas Índice - Grade
- Páginas de Layout
- Páginas da loja – Clássica
Cabeçalho
Para navegar no site, os visitantes usam o cabeçalho no topo. No Montauk, o cabeçalho tem o título ou logotipo do site, links de navegação superior e uma área personalizável chamada legenda do cabeçalho.
- Defina o layout com o ajuste de estilo de tela de trabalho em Opções.
- Para layouts esquerdo e direito, use o ajuste de navegação de pilha em Opções para empilhar os links de navegação.
- Use os ajustes Tamanhos e valores para alterar o espaçamento no cabeçalho e entre links de navegação.
Escolha o que é exibido na legenda do cabeçalho com o ajuste de legenda do cabeçalho em Opções.
- O Endereço mostra o endereço e o número de telefone dos campos Localização física em Informações comerciais.
- Slogan exibe o slogan do seu site.
- Escolha Personalizado para adicionar texto ou outro conteúdo. Saia dos estilos do site e clique duas vezes no texto do marcador "Seu texto personalizado aqui" para substituí-lo por blocos.
Borda
Adicione uma borda em torno de todo o seu site e na parte superior e inferior do conteúdo principal.
- Defina a cor com o ajuste de cor da borda da página em Cores.
- Defina a espessura com o ajuste de bordas da página em Opções.
- Oculte a borda escolhendo o ajuste bordas da página: nenhum em Opções.
- Se o Estilo de tela de trabalho estiver definido como logotipo Masthead à esquerda ou à direita, a borda externa não será exibida.
Plano de fundo
Na seção Cores dos estilos do site:
- Defina a cor de fundo do site com Fundo do site ou adicione uma imagem de fundo com Imagem de fundo do site.
- Defina o fundo da sua área de conteúdo principal e do cabeçalho do site com o Fundo da tela de trabalho.
- A cor de fundo do site pode ser exibida brevemente antes que a imagem de fundo seja carregada.
- Use o controle deslizante de opacidade do Fundo da tela de trabalho para permitir o fundo apareça, como mostrado abaixo.
Dica: a borda é exibida ao redor da tela.
Rodapé
Os templates Montauk têm três rodapés, que você pode personalizar com blocos.
Os rodapés da página são exclusivos para páginas individuais.
- Os itens da coleção (como publicações de blog) têm o próprio rodapé.
- Os rodapés de página não aparecem na Página de Galeria e de Layout abertas num Índice.
Existem dois rodapés em todo o site:
- Rodapé de informações - Escolha se isso será exibido com o ajuste Ocultar rodapé das informações em Opções. Oculte seus ícones de redes sociais integrados com Ocultar ícones de redes sociais.
- Rodapé inferior
Banners de página
Você pode criar um banner com uma sobreposição de texto no topo da Página do Blog, de Eventos, Índice e de Layout. Adicione um banner nas configurações da página com imagens destacadas ou URLs de vídeo.
- Use a seção Opções dos estilos do site para escolher se os banners, os títulos das páginas e as linhas divisórias serão exibidos.
- Quando Páginas de Layout são abertas a partir de um Índice, os banners não são exibidos.
- Os banners de vídeo exigem uma imagem contingência para dispositivos móveis para serem exibidos.
Largura e altura
A largura e a altura são fixas:
- Largura — os banners de página sempre são exibidos na largura da área da tela de trabalho.
- Altura — a altura é definida pela imagem (ou imagem de contingência para dispositivos móveis, no caso do banner de vídeo). Você pode alterar isso com o editor de imagens integrado. Para criar um visual uniforme, todas as imagens do banner devem ter a mesma proporção.
Texto do banner
O título e a descrição das páginas podem aparecer sobre o banner.
- Para que o texto apareça, a página deve ter uma imagem de banner ou vídeo.
- As descrições não são exibidas em navegadores com menos de 767 pixels de largura.
- A cor do texto corresponde ao plano de fundo da tela de trabalho (Fundo da tela de trabalho em Cores).
- Estilize as fontes com os ajustes Título da página e Descrição da página em Tipografia.
- Os títulos das páginas têm um tamanho fixo em navegadores mais estreitos.
- Para usar um texto diferente nos resultados da busca, adicione um título e uma descrição de SEO.
Para ocultar o texto em todas as páginas, marque o ajuste Ocultar banners de página. Também é possível excluir descrições de páginas individuais das configurações da página.
Páginas do Blog
As páginas do blog Montauk são exibidas como uma lista de publicações empilhadas verticalmente.
Na página de destino:
- A imagem em destaque da página cria uma imagem de banner.
- A data e o nome dos autores aparecem acima de cada publicação. Outros metadados aparecem embaixo.
- Blocos de imagens, vídeos e galeria promovidos são exibidos abaixo do título da publicação para publicações com trechos.
- Os trechos exibem links "Mais informações".
- O conteúdo completo de postagens individuais é exibido sob o título para postagens sem trechos.
- As páginas do blog aceitam barra lateral, banner e rodapé de página.
Em mensagens individuais:
- A imagem em destaque da página do blog cria uma imagem de banner.
- A data e o nome dos autores aparecem acima de cada publicação. Outros metadados aparecem embaixo.
- A navegação para publicações anteriores e seguintes é exibida abaixo dos comentários.
Páginas de blog de estilo
Altere as cores do título, do texto e dos metadados da publicação com os ajustes de cor do cabeçalho 1, cor do texto e meta cor do blog em Cores.
Na seção Estilos de blog dos estilos do site:
- Escolha se o autor é exibido com Ocultar autor do artigo.
- Altere o espaço entre as publicações com o espaçamento de publicações do blog.
- Altere a fonte do título com o título da publicação do blog.
Barra lateral do blog
Uma barra lateral é exibida em páginas de destino e publicações. Personalize-a com blocos. Se você tiver vários blogs em seu site, a mesma barra lateral será exibida em todos eles. A barra lateral rola para cima com a página.
Na seção Estilos de blog dos estilos do site:
- Use Layout do blog para ativar a barra lateral e escolher onde ela aparece.
- Para ocultar a barra lateral, escolha Layout do blog: centro.
- Defina o tamanho da barra lateral com a Largura da barra lateral do blog.
Dica: se a barra lateral estiver em branco quando você ativá-la pela primeira vez, saia de Estilos do Site, passe o mouse sobre o canto superior da Página do Blog e clique na anotação Edição de Conteúdo da Barra Lateral.
Páginas de Galeria
As páginas da galeria Montauk empilham imagens e vídeos verticalmente. O título e a descrição da página são exibidos de um lado, com imagens do outro. Estilize páginas de galeria com os seguintes ajustes de Estilos de índice:
- Vire o layout com o Layout do projeto.
- Altere o tamanho da imagem ajustando a largura da barra lateral do Índice.
Texto da galeria
No título e na descrição das páginas:
- Defina a fonte do título com o ajuste Títulos em miniatura do Índice em Estilos de índice.
- Controle o tamanho do título com o ajuste Título 2 em Tipografia.
- O texto da descrição segue os ajustes de Corpo de texto.
- Para usar um texto diferente nos resultados da busca, adicione um título e uma descrição de SEO.
- Para ocultar o texto, apague o título ou a descrição nas configurações da página. Ao fazer isso, adicione um título e descrição de SEO. Eles não aparecem no site, mas são úteis para a SEO.
Os títulos e as descrições das imagens são exibidos abaixo de cada imagem.
- O texto segue os ajustes de Corpo de texto.
- Os títulos das imagens estarão sempre em negrito.
- Para ocultar o texto, remova o título ou a descrição no editor da imagem.
Mais ajuda com Páginas de Galeria
- Use rodapés na página para adicionar conteúdo personalizado na parte inferior.
- A navegação aparece na parte inferior quando a página é aberta a partir de um Índice.
- Os templates Montauk não aceitam URLs de clickthrough, URLs de link direto ou funcionalidade lightbox.
- O banner da página não aparece.
- Para criar um layout diferente, use uma Página de Layout com um Bloco de Galeria.
Páginas Índice
As Páginas Índice dos templates Montauk criam grades de miniaturas que os visitantes podem usar para explorar páginas diferentes.
- A grade de navegação mostra imagens em destaque na página. Mesmo que a página tenha banner de vídeo, a imagem em destaque aparece na grade.
- O título das páginas aparece abaixo das miniaturas.
- Você pode adicionar um banner de página e um rodapé por página.
- Em dispositivos móveis, as Páginas Índice exibem uma miniatura por linha.
Páginas aceitas
Você pode adicionar as seguintes páginas a um Índice:
- Páginas de Layout
- Páginas de Galeria
- Páginas do Blog
- Páginas de Eventos
- Páginas da loja
- Páginas de Álbum
Estilizar o Índice
Estilize Páginas Índice com os seguintes ajustes de Estilo de índice:
- Defina a cor do título da página com Cor do título do Índice de miniatura.
- Use Miniaturas por linha para escolher quantas miniaturas aparecerão na horizontal.
- Defina a altura das imagens em miniatura com a Proporção de miniaturas.
- Use Opacidade da miniatura para escolher o quanto da cor do fundo deve aparecer.
- Escolha o quanto a miniatura desaparece quando um visitante passa o mouse sobre ela com Opacidade da miniatura ao pairar o cursor.
Páginas de galeria e layout em índices
A Página de Galeria e de Layout abertas pelo Índice têm formatação especial:
- O topo da página aparece no topo do browser. Os visitantes podem rolar para cima para ver o cabeçalho do site.
- Miniaturas clicáveis para as outras páginas no Índice aparecem abaixo do conteúdo da página, junto com elementos de navegação.
- Os banners não aparecem na Página de Layout. Se a Página Índice tiver banner, ele aparecerá. Caso contrário, não haverá nenhum banner.
- A URL inclui uma hashtag (#). A formatação especial não será exibida se a URL não incluir o #.
Títulos e descrições das páginas
O título e a descrição das páginas podem aparecer:
- Sobre o banner da página para páginas de layout, blog, eventos e índice.
- Na página para Páginas de Galeria.
Ícones de Redes Sociais
O rodapé de informações tem ícones de redes sociais incorporados opcionais.
Dica: nos templates Montauk, o conteúdo demo inclui um Bloco de Links de Redes Sociais removível no rodapé inferior.
Fontes
Para texto no seu site:
- Estilize as fontes e os tamanhos com os ajustes de Tipografia.
- Estilize as cores com os ajustes de Cores.
Barra lateral
Os templates Montauk têm uma barra lateral nas Páginas e publicações do blog.
Dispositivo móvel
O design responsivo e integrado do Squarespace permite que seu site se ajuste a qualquer dispositivo e tenha aparência e navegabilidade aprimoradas.
- A navegação é exibida como um link de Menu no centro superior.
- O link de Menu sempre aparece na versão móvel, mesmo que a Navegação Superior esteja vazia.
- O plano de fundo do menu segue o ajuste de fundo da tela de trabalho em Cores.
- As imagens da galeria são empilhadas abaixo do texto de descrição da página.
- Você pode desativar os estilos móveis, mas não recomendamos.
Os banners podem parecer diferentes em dispositivos móveis:
- As descrições das páginas não são exibidas em smartphones e navegadores com menos de 767 pixels de largura.
- Banners de vídeo às vezes não aparecem na versão móvel, dependendo da versão do browser e da velocidade da conexão do visitante. Nos dispositivos móveis, defina uma imagem de contingência para que ela apareça quando não for possível carregar o banner do vídeo.
- Veja as nossas dicas de soluções de problemas para questões de banners e recortes de imagens em dispositivos móveis.
Opções de idiomas
Dentro dessa família, os templates Julia, Kent e Om aceitam duas opções de idioma:
- Escolha o idioma do texto interno do seu site, como de formulários de envio e da mensagem de Confirmação do Pedido.
- Inicie um novo site com um template em francês, alemão, italiano, português ou espanhol.
Solução de problemas da Montauk
Confira a seguir alguns problemas comuns com esse template. São bugs ou problemas conhecidos. Oferecemos suporte para o Squarespace versão 7.0, mas corrigir bugs ou problemas não é prioridade para nós enquanto nos dedicamos à nossa atual plataforma, a versão 7.1.
As pessoas podem confirmar presença através do nosso site?
Você pode criar um botão RSVP em uma página de layout usando um bloco de formulário. Esse bloco coleta informações dos visitantes. Verifique se a opção Ativar modo lightbox está marcada na guia Avançado do editor de blocos de formulários. O modo Lightbox define o formulário para abrir quando um botão é clicado em vez de na própria página.
Para obter um exemplo de como isso fica na prática, veja o conteúdo de demonstração do template Naomi:
Como altero a fonte do cabeçalho na minha Página de Galeria?
A fonte e o tamanho do cabeçalho na Página de Galeria são controlados por dois ajustes diferentes:
- Use o ajuste Títulos em miniatura do Índice na seção Estilos de índice dos estilos do site para ajustar a fonte.
- Use o Título 2 na seção Tipografia para ajustar o tamanho.
Como recriar as páginas de aulas ou workshops a partir do conteúdo de demonstração do Om?
A página de aulas é uma Página de layout que foi personalizada com blocos de formulário. Para incorporar a reserva, acesse Adicionar reserva on-line ao seu site.
A página de workshops mostrada no conteúdo de demonstração é uma página de eventos. Visite as páginas de eventos para obter mais ajuda.
Como recriar a página de lista de casamento a partir do conteúdo demo do Julia?
Os links de lista de casamento no conteúdo demo são criados em uma página de layout com um Bloco de Galeria de grade, usando imagens com URLs de clickthrough.
Como atualizo minhas informações comerciais?
As informações da sua empresa podem ser exibidas como uma legenda no cabeçalho do site. Isso vem da seção Localização física do painel de informações da empresa.
Para editar isso:
- Abra o painel "Configurações" e clique em Informações da empresa.
- Role para baixo até Localização física e atualize as informações.
- Clique em Salvar.
Observe que as alterações nos campos de endereço comercial não aparecerão na legenda.
Meu menu no dispositivo móvel não abre
O menu no dispositivo móvel não abre se você adicionou um banner de vídeo à página inicial usando um URL ou código de incorporação inválido. Para editar o URL do vídeo:
- Abra o painel "Páginas".
- Passe o cursor do mouse sobre o título da página inicial no painel esquerdo e clique em
. - Clique na aba Mídia e depois em Vídeo.
- Confirme se o campo de URL do vídeo contém um URL válido.
.Minha imagem de fundo não está fixa no celular
Muitos navegadores móveis, incluindo iOS, não suportam imagens de fundo fixas. Para obter um efeito semelhante, experimente as opções de estilo de imagem de fundo Tamanho: capa e Tamanho: contêm. Observe que as configurações de estilo de imagem de fundo se aplicam tanto ao celular quanto ao computador.
Para obter mais ajuda, visite nossas dicas de solução de problemas de design responsivo.
Meu rodapé de informações desapareceu
Se a anotação Editar do rodapé de informações não aparecer:
- Abra o painel "Estilos do site".
- Role até a seção Opções.
- Desmarque Ocultar rodapé de informações.
- Clique em Salvar.
- Saia dos estilos do site e atualize a página. A anotação deverá aparecer.
Meu Bloco de Linhas não está sendo exibido
A cor do Bloco de Linhas é definida com o ajuste Cor da borda da página na seção Cores dos Estilos do site. Certifique-se de que a transparência seja opaca para manter todas as linhas e bordas visíveis.
Minha navegação está dividida em duas linhas
Se os links em sua navegação superior não couberem em apenas uma linha, a navegação superior será quebrada para uma segunda linha.
Se você selecionou o estilo de tela de trabalho: logotipo do mastro à direita ou logotipo do cabeçalho à esquerda, e a navegação superior for muito longa para ser exibida ao lado do título ou logotipo do site, a navegação superior se moverá abaixo dele.
Se você não gosta da aparência da sua navegação superior, há várias maneiras de ajustar a formatação:
- Reduza o número de páginas na navegação. Você pode usar uma lista suspensa.
- Renomeie as páginas para ficarem mais curtas.
- Na seção Valores e tamanhos dos estilos do site, reduza o espaçamento do link de navegação para aproximar os links ou aumente a Largura lateral para aumentar a largura de todo o site.
O título da minha página e o tamanho da descrição não estão mudando
Nos browsers mais estreitos do que 1.041 pixels, o título e a descrição das páginas têm um tamanho de fonte fixo. Dependendo do tamanho da tela, a janela da prévia não é suficientemente larga na seção Estilos do Site para você ver as mudanças que você está fazendo no tamanho.
Se for esse o caso, salve as alterações, saia dos estilos do site e abra a visualização completa para ver o título da página e a altura da descrição atualizados. Você também pode salvar as alterações e visualizar seu site em uma janela privada separada do navegador.
O título da minha página parece maior em navegadores mais estreitos
Os títulos das páginas são exibidos sobre banners. Para navegadores com menos de 1041 pixels, eles têm um tamanho fixo:
- 767 pixels ou mais estreito - o tamanho da fonte é 21px
- 768 - 1040 pixels - o tamanho da fonte é 52px
Em navegadores de 1041 pixels ou mais, defina o tamanho com o ajuste Título da página na seção Tipografia dos estilos do site.
O título da minha página não é exibido
O título de uma página em Montauk deve aparecer sobre um banner de página. Se o título da página não estiver sendo exibido:
- Certifique-se de ter uma imagem em destaque ou URL de vídeo definidos para essa página.
- Na seção Opções dos estilos do site, certifique-se de que Ocultar rodapé das informações e o banner Ocultar página estejam ambos desmarcados.
Meu banner de vídeo não é exibido
Se o banner do vídeo não estiver sendo exibido, adicione uma imagem de contingência para dispositivos móveis:
- Abra as configurações da página.
- Na guia Mídia, clique em Vídeo.
- Role para baixo e adicione uma imagem ao carregador de imagens.
- Clique em Salvar.
Lembre-se:
- A altura da imagem de contingência para dispositivos móveis define a altura do banner.
- Para Páginas Índice, o vídeo cria um banner na página de destino do índice; as miniaturas da grade de índice não exibem vídeos.
Há uma linha horizontal através dos meus botões de navegação superior e curtir e compartilhar
Essa linha fica visível quando o ajuste do plano de fundo da tela de trabalho na seção Cores dos estilos do site é transparente ou parcialmente opaco. Você pode alterar o ajuste de fundo da tela de trabalho ou tornar a cor da borda da página transparente para ocultar a linha completamente.
Por que meu rodapé tem dois conjuntos de links de redes sociais?
O template Montauk tem duas opções integradas para exibir ícones de redes sociais: como parte do rodapé de informações e com um bloco de links de redes sociais no rodapé inferior (parte do conteúdo de demonstração).
Por padrão, o rodapé de informações e seus ícones de redes sociais ficam ocultos, e o bloco de links de redes sociais é exibido no rodapé inferior.
- Rodapé de informações: desmarque Ocultar rodapé de informações na seção Opções dos estilos do site para exibir os ícones. Em seguida, use o ajuste de estilo do ícone Social para alterar sua aparência ou use o ajuste Ocultar ícones de redes sociais para ocultá-los.
- Rodapé inferior: edite o bloco de links de redes sociais para alterar sua aparência ou exclua o bloco para removê-los.