Obs.: embora os nossos guias mais acessados tenham sido traduzidos para o português, outros guias estão disponíveis apenas em inglês.

Família de templates Bedford

A versátil família de templates Bedford (Anya, Bedford, Bryant, Hayden) enbloga todos os tipos de site, de organizações sem fins lucrativos até anúncios imobiliários. Banners e botões personalizáveis especiais, navegação na barra lateral e uma Página Índice de rolagem colocam o foco em seus produtos, missão ou detalhes do evento. 

Este guia aborda os recursos e opções de design da família de templates Bedford. Para você navegar pelo painel, os ajustes do Estilos do Site estão em negrito e têm um link para a lista de todos os ajustes de templates Bedford.

Tipos de página compatíveis

Os templates Bedford aceitam os seguintes tipos de página:

Cabeçalho

Para navegar no site, os visitantes usam o cabeçalho no topo. Nos templates Bedford, o cabeçalho tem o título do site ou logotipo e a navegação principal. Os slogans não aparecem. O cabeçalho é fixo nas Páginas Índice.

Estilize o título ou o logotipo do site na seção Cabeçalho do Site.

  • Use Transparente nas Imagens de Banner para escolher se a identidade visual e a navegação são exibidas como uma sobreposição sobre banners de página ou sobre a Cor de Fundo do Cabeçalho.
  • Ajuste o logotipo com a largura do contêiner do logotipo. A altura máxima é fixada em cerca de 100 pixels, e o logotipo não vai além disso.

Use os ajustes de Navegação do site para alterar as configurações de exibição da Navegação principal.

  • Quando a opção Ativar botão de nav estiver marcada, a última página na Navegação principal aparecerá como um botão. Mude o visual com os ajustes do Botão de nav. Pastas não se transformam em botões.
  • Se não houver espaço suficiente na janela do browser para que os links de navegação apareçãm no cabeçalho, aparecerá um ☰ no lugar.

cabeçalho de templates Bedford

Banners

Adicione imagens e vídeos de banner sem margens à parte superior das páginas e, em seguida, sobreponha-os com títulos, texto e botões personalizáveis. Você pode adicionar imagens de banner e vídeos a:

  • Páginas de Layout
  • Páginas de Álbum
  • Páginas e publicações do Blog
  • Páginas de Eventos e eventos individuais
  • Páginas de Armazenamento

Lembre-se:

  • Você pode marcar Transparente nas Imagens de Banner no Cabeçalho do Site para exibir o conteúdo do cabeçalho sobre o banner.
  • Você pode adicionar banners de slideshow às Páginas de layout e blog.
  • Você pode empilhar vários banners em Páginas Índice.
  • Para todos os banners, use os ajustes da Seção do Banner para ajustar fontes, cores e estilos para os botões e sobreposições de texto.

Banners de página

Para criar uma imagem ou um vídeo de banner no topo da Página de Layout, de Álbum, de Blog, de Evento ou de Armazenamento, adicione uma miniatura ou o URL de um vídeo nas configurações da página.

Adicione uma sobreposição de texto no campo de descrição da Página na guia Geral. Tenha em mente que somente usuários com permissões de Proprietário ou Administrador em um site podem adicionar uma descrição da Página. Você pode formatar o texto como cabeçalhos e botões. O texto do título da página não é exibido.

Banners de slideshow

Para criar um banner de slideshow no topo de uma Página de Layout, adicione um Bloco de Galeria em Slideshow como o primeiro bloco na página.

  • O Bloco de Galeria não aparecerá na página.
  • O banner de slideshow substitui o banner das páginas.
  • Os vídeos adicionados ao Bloco de Galeria aparecem no banner, mas não são reproduzidos automaticamente. Eles incluem som e texto do banner de exibição.
  • Para um melhor resultado, marque Cortar imagens automaticamente na aba Design do editor do bloco.
  • Se o banner tiver uma sobreposição de texto, marque Mostrar título e descrição na guia Design. O título não será exibido.
  • Os banners da apresentação de slides têm uma altura fixa:
    • Desktop — 600 pixels. Se o cabeçalho for transparente nas imagens do banner, a altura fixa da imagem aumenta para 700 pixels.
    • Dispositivo móvel — 300 pixels. Dispositivos com mais de 640 pixels exibem a altura do banner da área de trabalho.
  • As Páginas do Blog também criam um banner em slideshow com as publicações em destaque.

Para adicionar um texto sobreposto, passe o cursor sobre uma imagem e clique em e o ícone de engrenagem; em seguida, adicione o texto ao campo Descrição. Se você criou um link para uma galeria existente, atualize as descrições na Página Galeria.

  • Você pode formatar o texto como cabeçalhos e botões.
  • Se o texto em um banner de slideshow for muito longo para caber na altura fixa, o texto de descrição que não está em negrito não será exibido. O texto de descrição em negrito será recortado.

banner de slideshow

Para banners de página e slideshow:

  • Textos em negrito são formatados como cabeçalho.
  • Formatos de texto regulares como corpo de texto.
  • Links no formato de última linha como botões. O link não pode incluir nenhum texto em negrito ou quaisquer outras linhas abaixo do link.
  • Adicione altura extra ao banner da página adicionando espaços em branco.
Dica: depois de criar um link de botão, você pode editar o texto do botão diretamente do editor de páginas. Observe que, se você excluir todo o texto, o link também desaparecerá, e você precisará adicioná-lo novamente nas configurações da página.

sobreposição de texto nas configurações de página

texto do banner e buttons.jpg

Publicações de blog e banners de eventos

As miniaturas de itens de coleção são exibidas na parte superior das publicações de blog e eventos individuais. Estes banners têm uma altura fixa.

  • Eventos — nenhum texto é exibido no banner.
  • Publicações do blog - o título da publicação e um tipo de metadados (escolha com o ajuste Metaprioridade) aparecem sobre a imagem do banner.

Adicione um filtro de cores

Adicione um filtro de cores a todas as imagens de banner ou vídeos com Cor de sobreposição de banner na Seção de banner.

Mais informações sobre banners

Rodapé

O template Bedford inclui área de conteúdo no rodapé e pré-rodapé, que você pode personalizar com blocos.

  • O rodapé e o pré-rodapé podem incluir conteúdo automaticamente, como um Bloco de Links Sociais ou Bloco de Texto. Exclua ou edite esses blocos para substituí-los pelo seu próprio conteúdo.
  • Os links de texto no rodapé e no pré-rodapé são sublinhados.
  • As alterações feitas no rodapé aparecem em todo o site.

Use ajustes de rodapé para estilizar o conteúdo do rodapé:

  • Estilize a navegação de rodapé com ajustes da nav do rodapé.
  • Use o ajuste Centrar navegação/Informações para alinhar a Nav do Rodapé e as informações de contato.
  • Use os ajustes Informações do site para ajustar o estilo do número de telefone, do e-mail e do local físico nas suas configurações de Informações comerciais.
  • Marque Ocultar Informações do Site para remover todas as informações de contato.
Dica: se não aparecerem os ajustes Informações do site e Ocultar informações do site, veja a prévia de outro template no site e cancele a prévia.

Navegação na barra lateral

Bedford cria barras laterais de navegação em páginas e Páginas de Armazenamento em pastas, áreas de membros e Índices.

  • Use os ajustes da Barra Lateral para ajustar fontes e cores, ocultar títulos da barra lateral ou para ocultar a navegação por completo.
  • A navegação na barra lateral não é compatível com blocos.
  • Cada página adicionada a uma pasta ou área de membros aparece como um link na navegação da barra lateral. A barra lateral é exibida em qualquer Página de Layout na pasta ou na área de membros.
  • Ao acessar o URL direto da página, as páginas do Índice mostram apenas a navegação na barra lateral.
  • Nas Páginas de Armazenamento, a navegação da barra lateral mostra links para diferentes categorias de produtos. Clique num link para filtrar todos os produtos, exceto os da categoria.

Página de produtos barra lateral navegação.jpg

Plano de fundo

Use estes ajustes para definir as cores de fundo do site:

Fontes

Ajuste o estilo, o tamanho e a cor do texto com os ajustes Texto da Página e Título no Conteúdo Principal.

O cabeçalho do site, as navegações da barra lateral e os banners de página têm suas próprias opções de fonte e cor.

Páginas Índice

Nos templates Bedford, as Páginas Índice transformam o conteúdo de várias páginas em seções empilhadas para você destacar diferentes imagens e informações em um único local. A seção de conteúdo é criada na Página de Layout e é uma boa opção para adicionar texto, botões e outros blocos.

  • Adicione miniaturas de página para criar imagens de banner ou vídeos ou para criar um slideshow de banner.
  • Para empilhar vários banners, crie seções com imagens de banner, mas sem conteúdo de página. Nas páginas novas, apague o Bloco de Texto padrão. Enquanto estiver logado, você ainda verá um marcador de posição vazio.
  • Estilize as cores e fontes da Página Índice com os mesmos ajustes que outras páginas. Não há ajustes específicos para a Página Índice.
  • O título do site e a Navegação Principal permanecem em uma posição fixa depois de percorrer a primeira página. Use o ajuste Cor de fundo do cabeçalho para ajustar a cor de fundo do cabeçalho fixo.
  • Páginas Índice são compatíveis com links âncora de índice. Quando os visitantes clicam nesses links, eles saltam para uma seção específica da Página Índice. Para ver isso em ação, clique no botão “Veja o nosso trabalho” no conteúdo demo de Hayden.
  • Quando você acessa o URL direto de uma página que faz parte de um Índice, todas as páginas nesse Índice aparecem numa barra lateral de navegação.

seções de página índice com navegação fixa

Páginas do Blog

No Bedford, as Páginas do Blog aparecem como uma lista de publicações empilhadas na vertical.

Na página de destino:

  • O link "Mais informações" aparece nas publicações com trechos. O texto e a seta do link seguem os ajustes da fonte do Texto da página e do estilo Cor do link da página.
  • O conteúdo completo de postagens individuais é exibido sob o título para postagens sem trechos.

Em mensagens individuais:

  • A imagem em miniatura é exibida como um banner quando você consulta uma publicação individual de blog com o URL direto.
  • Tags, URLs de origem, comentários, compartilhamentos e curtidas sempre são exibidos abaixo da publicação.
  • Categorias sempre são exibidas acima da publicação.
  • A navegação para publicações anteriores e seguintes é exibida abaixo dos comentários.

Estilize página do blog na seção Blog:

  • Use Metadados prioritários para selecionar quais metadados (data, categorias ou nome do autor) aparecerão acima do conteúdo da publicação na página de landing.
  • Desmarque Ocultar Rodapé de Entrada de Lista para exibir tags, a URL de origem, comentários, compartilhamentos e curtidas abaixo da publicação na página de destino.
  • Para centralizar títulos e metadados da publicação na página de destino, marque Centralizar o título de entrada & Meta.
  • Para mostrar ou ocultar os autores do blog na página de destino e de cada publicação, use Ocultar autor do texto. Esse ajuste não aparece com Meta prioridade: autor selecionado.

publicação do blog

Barra lateral

Cada página de blog tem uma barra lateral personalizável. Todas as publicações de blog nesse blog também exibem a barra lateral.

Para ativar a barra lateral, desmarque Ocultar barra lateral do blog na seção Barra Lateral e depois adicione conteúdo com blocos.

barra lateral da página do blog

Banners de slideshow

As cinco mais recentes publicações em destaque criam um banner de slideshow na página de destino.

  • Cada slide exibe o título da publicação do blog, um tipo de metadados (escolha com o ajuste Metaprioridade) e um link de Ver publicação.
  • A imagem em miniatura é exibida atrás do texto. Se a publicação não tiver uma imagem em miniatura, o texto será exibido sobre a Cor de Sobreposição do Banner.
  • Use o ajuste Controles do slideshow do banner para controlar os elementos de navegação no banner do slideshow do seu blog.
  • Se nenhuma de suas publicações estiver marcada como Destaque, o banner da página será exibido na Página 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.

  • Nas páginas e publicações do blog, o conteúdo da barra lateral do blog aparece abaixo do conteúdo principal.
  • Como padrão, a barra lateral de navegação fica oculta. Toque em + (canto superior direito) para mostrar a barra lateral de navegação da Página de Loja e das páginas de uma pasta, além das seções da Página Índice que o visitante acessa via link direto.
  • Os banners de apresentação de slides têm uma altura definida de 300 pixels. Se o texto não couber no banner em slideshow, o texto da descrição não aparecerá.
  • Você pode desativar os estilos móveis, mas não recomendamos.

Um link Voltar ao topo aparece no fim da página.

Em smartphones:

  • A navegação é recolhida para um ☰ no canto superior direito. O ☰ sempre é exibido em dispositivos móveis, mesmo que a Navegação Principal esteja vazia.
  • A cor de fundo da sobreposição do menu é a mesma da do cabeçalho.
  • Rodapés com informações comerciais têm um link de E-mail em vez de um endereço de e-mail completo.

visualização de smartphone e tablet

Opções de idiomas

O Bedford aceita duas opções de idioma:

Este artigo foi útil?
Utilizadores que acharam útil: 55 de 104
Família de templates Bedford