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

Opções de estilo e design da versão 7.1

Use as opções de estilo globais da versão 7.1 do Squarespace para fazer alterações de estilo em grande escala em seu site. Isso cria uma aparência consistente para ajudar você a manter uma identidade de marca unificada. Você também pode estilizar seções individuais e usar páginas de portfólio para criar páginas de destino vinculadas ao seu conteúdo.

Este guia mostra as opções de design e estilo na versão 7.1. Para adicionar conteúdo a um site, acesse Seções de páginas.

Dica: para encontrar a versão do seu site, faça login no site e clique em Ajuda no painel esquerdo. Para obter ajuda adicional, visite Qual é o template e a versão do meu site?

Assistir a um vídeo

Fonts

Para alterar as fontes do seu site:

  1. No Menu Inicial, clique em Design e depois em Fontes.
  2. Escolha um pacote de fontes.
  3. Defina o tamanho da base. Todo o restante do texto é dimensionável em relação a este tamanho.
  4. Clique em o-icone-de-engrenagem para estilizar textos específicos.

Use uma fonte específica

Para usar uma fonte específica da Adobe ou do Google, use a opção Procurar todas as fontes.

  1. No Menu Inicial, clique em Design e depois em Fontes
  2. Clique em um pacote de fontes e depois no o-icone-de-engrenagem correspondente.
  3. Clique no tipo de texto a ser alterado: Cabeçalhos, Parágrafos, Botões ou Meta.
  4. Clique em Família.
  5. Clique em Procurar em todas as fontes.
  6. Role para procurar as fontes disponíveis ou digite o nome da fonte no campo Buscar fontes na parte superior do painel.
  7. Clique em Salvar para aplicar as alterações.  

Formatar texto

Destaque qualquer texto e use os ícones da barra de ferramentas para aplicar a formatação.

Criamos tags HTML automaticamente no código do seu site para cada tamanho de texto:

  • <h1> - cabeçalhos extra grandes
  • <h2> - cabeçalhos grandes
  • <h3> - cabeçalho médio
  • <h4> - cabeçalhos pequenos
  • <p> - texto de parágrafo grande, médio e pequeno

Links

  • Os links são sempre sublinhados.
  • Quando o visitante clica em um link, uma linha pontilhada aparece ao redor do link, para deixar o site mais acessível a todos os visitantes.

Colors

As opções selecionadas ajudam você a fazer alterações em todas as cores do seu site ao mesmo tempo. Para alterar as cores do site:

  1. No Menu Inicial, clique em Design e depois em Cores.
  2. Use as opções Paleta e Tema para escolher um conjunto de cores e como elas serão exibidas.
  3. Passe o cursor sobre o tema e clique no ícone de lápis para editar o estilo de elementos específicos dentro desse tema; ou selecione uma cor personalizada.

Resolução de problemas

Se os estilos gerais não afetarem uma parte específica do seu site, esta seção provavelmente terá estilos de seção, que substituem os estilos gerais.

Para retornar aos estilos gerais de uma seção:

  1. Clique em Editar e, em seguida, clique no ícone de lápis da seção.
  2. Na aba Cores, ative a opção Usar tema original. A seção voltará para os estilos gerais.

Para alterar as cores específicas da seção:

  1. Clique em Editar e, em seguida, clique no ícone de lápis da seção.
  2. Desative a opção Usar tema original e selecione um tema.
  3. Passe o cursor sobre Concluído e clique em Salvar.
  4. No Menu Inicial, clique em Design e depois em Cores.
  5. Aparecerá uma etiqueta com o seu tema na seção. Passe o cursor sobre esse tema no painel Cores e clique no ícone de lápis para fazer as alterações.
  6. Volte para o menu principal de Cores e clique em Salvar.

Botões

Para estilizar os botões do seu site, no Menu Inicial, clique em Design e, em seguida, em Botões.

Os botões seguem as cores e fontes globais do seu site.

O Bloco de Botão tem opções extras de estilo:

  1. Clique em Editar na página.
  2. Passe o mouse sobre o bloco e clique no ícone do lápis para alterar o tamanho e o alinhamento.

Espaçamento

Para estilizar o espaçamento do site, no Menu Inicial, clique em Design e, em seguida, clique em Espaçamento.

Você pode editar estes ajustes:

  • Largura da página (máx.) - altere a largura máxima possível das páginas do site. A largura real dependerá do browser e do aparelho. Este ajuste não afeta o espaçamento no cabeçalho do site.
  • Margem do site - altere a largura da margem em ambos os lados do site. Dependendo da configuração Largura da página, este ajuste pode não ter um efeito visível no conteúdo da página. Este ajuste afeta todo o site, incluindo o cabeçalho.

Você pode alterar o espaçamento de cada seção usando os estilos de seção.

Estilos de item de produto

Para editar o estilo de um item de produto:

  1. No Menu Inicial, clique em Design.
  2. Clique em Itens de produto.

Estilos de Blocos de Imagem

Para estilizar Blocos de Imagem:

  1. No Menu Inicial, clique em Design e depois em Blocos de Imagem.
  2. Clique no bloco que você deseja estilizar para localizar ajustes que se aplicam a esse bloco.

Background

Para alterar o plano de fundo:

  • Use o painel Cores para alterar o plano de fundo do site.
  • Use estilos de seções para alterar a cor de fundo de seções individuais ou adicionar imagens ou vídeos de fundo. Isso inclui seções de rodapé.
  • O cabeçalho tem a mesma cor de fundo que a seção superior quando transparente. Desative a transparência no editor de cabeçalho para definir outro tema de cor do cabeçalho.

Banners

Para criar um banner:

  1. No canto superior esquerdo, clique em Editar.
  2. Adicione uma seção de bloco e clique no ícone do lápis.
  3. Clique em Plano de fundo para adicionar uma imagem ou vídeo.
  4. Clique em Cores para editar o estilo de um texto de sobreposição e para adicionar uma cor de sobreposição.
  5. Inclua seções de bloco adicionais abaixo para o conteúdo da página.

Dicas:

  • Se você quiser apenas uma imagem de banner, comece com uma seção em branco.
  • Quaisquer blocos adicionados à seção sobrepõem o banner.
  • Para alterar a altura, clique no ícone de lápis e defina a altura da seção.
  • Ao escolher uma imagem de fundo, siga nossas dicas de formatação de imagens.

Cabeçalho

Visitantes usam o cabeçalho na parte superior para navegar no seu site. Na versão 7.1, o cabeçalho tem o título ou logotipo do site e links de navegação. Você pode adicionar um ícone de carrinho de compras e de ícones sociais e um botão de chamada para ação.

Saiba mais em Criação de cabeçalho de site na versão 7.1.

Rodapé

Para editar o rodapé:

  1. No canto superior esquerdo, clique em Editar.
  2. Paire o cursor sobre o rodapé e clique em Editar rodapé.
  3. Use seções para adicionar conteúdo ao rodapé.

Estilos de seções

Para editar o estilo de uma seção, edite a página, passe o cursor na seção e clique no ícone de lápis. 

icone-lapis.png

Aqui você também pode escolher diferentes layouts de seções de coleção e galeria.

Se você fizer alterações de estilo em uma seção de coleção, todos os layouts desse tipo serão afetados. Por exemplo, se você tiver duas seções de blog e ambas usarem um layout de tipo tijolos, qualquer alteração de estilo, como alinhamento de texto, afetará ambas as seções.

Os estilos da seção substituem os estilos gerais.

Templates na versão 7.1

Todos os sites da versão 7.1 compartilham o mesmo template. Isso significa que:

  • Todos têm as mesmas opções de estilo e características.
  • Todos usam seções para adicionar conteúdo a páginas.

Como não há necessidade de mudar de template, esta opção não está disponível na versão 7.1. Em vez disso, para testar diferentes visuais para o seu site:

  • Altere os estilos gerais.
  • Adicione páginas com um layout inicial diferente.
  • Crie novas seções para alterar o ambiente de uma página. Você pode, por exemplo, adicionar uma seção com imagem de fundo no topo para criar um banner de página.

Saiba mais em Squarespace versão 7.1 x Squarespace versão 7.0.

Este artigo foi útil?
Utilizadores que acharam útil: 64 de 303
Opções de estilo e design da versão 7.1