Skip To Content

Definir a marca de um site com opções de cabeçalho e tema

Cada site possui um cabeçalho que aparece na parte superior do seu site (abaixo da barra de navegação global) e em todas as páginas e visualizações anexadas ao seu site. O cabeçalho contém o título do seu site, logotipo e links de menu. Você não pode remover um cabeçalho, mas pode escolher seu design.

Cabeçalho

Para escolher um design para seu cabeçalho, siga estas etapas:

  1. Abra um site no modo de edição.
  2. Abra o painel lateral clicando no botão de alternância botão de alternância. Se necessário, clique na seta de voltar ao lado de Personalizar na parte superior do painel para retornar ao menu raiz até visualizar a opção de clicar no Cabeçalho.
  3. Clique no menu Aparência para escolher um dos seguintes estilos de Cabeçalho:
    • Padrão—O padrão para cada novo site, este design apresenta uma barra fina, compacta que tem espaço para um logo (60 pixels), rede social e links de menu.
    • Proeminente—Este design fornece mais espaço para logos maiores (120 pixels) e links de menu extras.
    • CSS/HTML Personalizado—Utilize um editor de código habilitado por sintaxe para configurar uma cabeçalho com código personalizado.
      Anotação:

      Os cabeçalhos personalizados persistem nas páginas do site, mas não são exibidos nas visualizações de conteúdo. Para obter mais informações, consulte Por que a marca da visualização Explorar conteúdo é diferente?

  4. Clique no menu Marca para aplicar as seguintes opções:
    • Nome—Insira um nome para aparecer no cabeçalho do seu site. O nome que você fornece neste campo é somente visível no cabeçalho e não será refletido na URL do seu site ou em sua lista de sites.
    • Nome Curto—Insere uma versão abreviada do título que você adicionou ao cabeçalho. O nome abreviado só se aplica ao cabeçalho se for muito longo para ser exibido em uma tela menor, como um telefone celular.
      Dica:

      As pessoas utilizam dispositivos móveis para acessar internet. Adicione um nome curto para garantir a qualidade do seu site em qualquer dispositivo.

  5. Escolha uma opção para Layout: Caixa ou Amplo.
  6. Se você deseja marcar o cabeçalho do seu site com HTML ou CSS personalizado, escolha HTML/CSS personalizado e forneça o código nas caixas HTML e CSS.

    Anotação:

    HTML de cabeçalho não suporta JavaScript embutido. Tags de script serão ignoradas.

  7. Clique em Salvar.

Adicionar um logo a um cabeçalho

O tamanho e posicionamento do logo do seu site depende do estilo de cabeçalho que você escolhe.

  1. Clique para expandir o menu Marca em Cabeçalho no painel lateral.
  2. Clique no botão Logo para ativá-lo.
  3. Adicione uma imagem escolhendo URL da Imagem ou transferindo uma imagem de um arquivo.

    Dica:
    Se você estiver transferindo uma imagem do arquivo um , uma imagem salva como um arquivo PNG funciona melhor. Você pode recortar e ampliar a imagem na seção Configurações da Imagem do cartão no painel Personalizar.

  4. Se você estiver utilizando o cabeçalho Proeminente , você poderá escolher uma configuração para Alinhamento da Imagem.
  5. Para Logo Texto Alt, forneça o texto para atender os padrões de acessibilidade.

    Dica:
    Se um logo tiver texto nele, o texto alt pode ser o nome da companhia. Se o logo for um design de logomarca , você poderá considerá-lo decorativo e digitar “” para o texto alt.

  6. Clique em Salvar.

Adicionar ícones de rede social

Adicione ícones de rede social a um cabeçalho.

  1. Abra um site no modo de edição.
  2. Clique para expandir o menu Marca em Cabeçalho no painel lateral.
  3. Clique no menu Ícones de Rede Social.
  4. Clique no botão para adicionar um ícone de rede social para Facebook, Twitter, Instagram ou YouTube.
  5. Forneça a URL para sua conta da plataforma.
  6. Clique em Salvar.

Criar um tema

Estabeleça um tema para o seu site escolhendo cores para o cabeçalho, texto e botões do seu site. As cores que você escolhe no menu Tema do seu site são aplicadas em todo o seu site. Você pode substituir essas seleções configurando cores para linhas específicas. Para mais informações, consulteCores e fontes.

Dica:

Ao escolher uma cor, revise as diretrizes de marcas para sua organização. Muitas diretrizes de marcas fornece códigos de cor exatos para conteúdo tais como sites da web e logos. Se você não tiver diretrizes de marcas, consulte com sua equipe ou partes interessadas para assegurar que o tema do seu site reflita corretamente sua organização.

  1. Abra um site no modo de edição.
  2. Abra o painel lateral clicando no botão de alternância botão de alternância. Se necessário, clique na seta de voltar ao lado de Personalizar na parte superior do painel para retornar ao menu raiz até visualizar a opção de clicar no Tema.
  3. Para selecionar uma cor de qualquer uma das opções seguintes, insira um código de cor de valor hexadecimal ou escolha uma cor a partir do seletor de cores próximo ao campo de código de cor.
    • Cor do Plano de Fundo da Navegação Global aplica cor na barra de navegação global do seu site.
    • Cor de Texto da Navegação Global aplica cor ao texto na barra de navegação global.
      Anotação:

      Para mais informações sobre navegação global, consulte O que é navegação global?

    • Cor do Plano de Fundo do Cabeçalho aplica a cor no cabeçalho do seu site.
    • Cor de Texto do Cabeçalho aplica a cor em todos os textos no cabeçalho.
    • Cor do Plano de Fundo do Corpo aplica a cor nas linhas do seu site. Cor de linha e cor de texto também podem ser configuradas para cada linha seguindo as etapas fornecidas em Cor e fontes.
    • Cor de Corpo do Texto aplica ao texto em todo o seu site.
    • Cor do Link do Corpo aplica a cor a todos os links fornecidos em seu site e botões usando o Estilo de Botão definido para Destacado.
      Anotação:

      As guias verticais, incluindo o botão de compartilhamento, usam a Cor do Link do Corpo para o preenchimento do plano de fundo e a Cor do Plano de Fundo do Corpo para ícones ou texto.

    • A Cor do Plano de Fundo do Botão aplica a cor aos botões fornecidos em seu site usando o Estilo do Botão definido como Plano de Fundo Sólido, bem como os ícones localizados nas guias do painel lateral.
    • A Cor do Texto do Botão aplica cor ao texto em qualquer botão fornecido em seu site.
  4. Após configurar as cores, clique em Aplicar as Alterações.
  5. Você também pode aplicar as fontes do texto no cabeçalho e no corpo de seu site.
    • Para escolher uma fonte para o corpo do seu site, clique no botão de configurações Fonte Básica.
    • Para alterar a fonte do cabeçalho do seu site, clique no botão de configuração Fonte do Cabeçalho.
Anotação:

Para reiniciar de ou retornar para cores padrões, escolha Redefinir para o Padrão na parte inferior da do menu Tema .

Criar um rodapé

Você pode usar HTML personalizada para adicionar um rodapé ao seu site que seja persistente em quaisquer páginas anexadas ao seu site.

  1. Abra um site no modo de edição.
  2. Expanda o menu Rodapé no painel lateral.
  3. Clique no botão próximo à Personalizar.
  4. Modifique a caixa CSS e HTML no painel lateral e clique em Aplicar Alterações para visualizar os efeitos em sua HTML.
    Anotação:

    A HTML do rodapé não suporta JavaScript embutido. Tags de script serão ignoradas.

Conteúdo relacionado

Para configurar seu site com mais marcas, você pode fazer o seguinte:

  • Adicionar links de menu e assegurar que a navegação global esteja habilitada. Para mais informações, consulte Configurar links de menu e navegação global.
  • Cada site inclui uma URL (endereço da web). Se sua organização tiver um domínio personalizado, você pode configurar esta URL para definir a marca do seu site. Para mais informações, consulte FAQs de Domínio.