Nota: Embora nossos guias mais populares tenham sido traduzidos para o português, alguns guias estão disponíveis apenas em inglês.
Usar o Editor de CSS

Se você souber programação e quiser fazer mais ajustes do que o painel Estilos do Site oferece, é possível adicionar um código CSS usando o Editor de CSS.

O CSS deve ser utilizado somente para alterar fontes, cores e planos de fundo. Outras alterações em CSS podem danificar seu site.

Atenção: o CSS Personalizado não é transferido quando você alterna templates. Se você voltar para o template anterior, o CSS adicionado ainda estará lá.

Assistir a um vídeo

Antes de começar

Obs.: códigos personalizados, incluindo CSS, estão fora do escopo de nosso suporte. Isso significa que não podemos ajudar em sua configuração ou resolução de problemas. Além disso, não podemos garantir a funcionalidade ou compatibilidade integral de soluções baseadas em código com o Squarespace. Isso inclui como ele funciona com nosso design responsivo – especialmente sua aparência em dispositivos móveis – e seu funcionamento em todos os templates. Personalizações de CSS também pode causar problemas de exibição nas futuras versões da nossa plataforma. Embora não ofereçamos suporte, existem muitos recursos que podem auxiliar você:

Adicione o código CSS

Para adicionar o código CSS: 

  1. No Home Menu (Menu Inicial), clique em Designe em seguida em Custom CSS (CSS Personalizado).
  2. Para abrir o editor em uma janela expansível, clique em Abrir na Janela. A janela se fechará se você sair do painel CSS Personalizado.
  3. Adicione o seu código.
  4. Quando tiver concluído, clique em Save (Salvar) para publicar suas alterações.

Números de linha são exibidos à esquerda para ajudá-lo a acessar pedaços de código. Os erros de sintaxe são exibidos em vermelho na parte inferior.

Obs.: o sistema de verificação de sintaxe do Editor de CSS do Squarespace é um analisador. Em vez de validar em comparação a um conjunto de regras, o analisador testa o que realmente irá funcionar em diferentes navegadores. Mesmo que seu código não acuse um erro em um validador de CSS, o analisador o acusará se acreditar que uma linha pode não funcionar da maneira pretendida. Se vir um erro de sintaxe, reveja o CSS para garantir que o código está escrito e formatado corretamente e que não há nada faltando.

Faça upload de arquivos (opcional)

Use a área de upload de arquivos para carregar ativos voltados para imagens personalizadas ou arquivos de fonte:

  1. Clique em Gerenciar arquivos personalizados no Editor de CSS.
  2. Clique em Adicionar imagens ou fontes ou arraste arquivos para essa área para carregar o arquivo.
Dica: se a área de upload de arquivos não abrir, permita pop-ups no navegador.

Tipos de arquivos aceitos

A área Arquivos Personalizados aceita arquivos de imagem e fonte válidos:

  • .jpg
  • .png
  • .gif
  • .ttf
  • .otf
  • .woff

O campo não aceita arquivos .svg.

Usando arquivos personalizados

Para usar os arquivos:

  1. Escreva o código até o ponto em que a URL do arquivo seja necessária para fazer referência.
  2. Deixe o cursor onde a URL deve ficar no código.
  3. Clique no arquivo.

O Editor de CSS colará automaticamente a URL direta no arquivo para que você faça referência a ela no código.

Arquivos personalizados e SSL

O URL do arquivo será formatado como seguro ou inseguro de acordo com as configurações de ativação do SSL. Se você alterar a preferência de SSL do seu site, recomendamos que você atualize o URL do arquivo para corresponder. Por exemplo, se você ativar o SSL:

  1. Abra o Editor de CSS.
  2. Clique em Gerenciar Arquivos Personalizados.
  3. Clique no arquivo.
  4. Altere o URL para que ele comece com https.
  5. Clique em Save (Salvar).

add-the-s.png

Esse artigo foi útil?
Usuários que acharam isso útil: 54 de 133