Personalizar um tema de central de conhecimento

Você pode personalizar a aparência do seu central de conhecimento selecionando o layout e configurando o tema no editor de temas. Você também pode ver como o tema do central de conhecimento aparecerá nos modelos, em diferentes idiomas e em diferentes tamanhos de tela.

Antes de começar

Antes de começar a trabalhar com esse recurso, certifique-se de compreender totalmente quais etapas devem ser executadas com antecedência, bem como as limitações do recurso e as possíveis consequências de usá-lo.

Compreender os requisitos

• Permissões de Superadministrador .
• a permissão de configurações de Central de conhecimento , a permissão de configurações de conteúdo e tema globais e uma permissão atribuída Saiba mais sobre os preços baseados em estações do HubSpot.

Compreender limitações e considerações

• Essas ferramentas só estão disponíveis para bases de conhecimento migradas. Saiba mais sobre a migração do central de conhecimento .
• Para bases de conhecimento que não foram migradas, saiba mais sobre como criar e personalizar um central de conhecimento herdado.
• Você não pode personalizar seu central de conhecimento no Gerenciador de design ou usar temas personalizados.

Exibir um tema de central de conhecimento

Depois de criar o central de conhecimento, você pode ver a aparência do tema no editor de temas. Você pode ver a aparência do tema em diferentes modelos, idiomas e tamanhos de tela. 

1. No seu portal da HubSpot, acesse Atendimento > Central de Conhecimento.
2. No canto superior direito, clique no menu suspenso Configurar e selecione Tema.
3.  Para exibir um modelo com conteúdo de amostra, clique no menu suspenso Exibir na parte superior esquerda e selecione um modelo. As alterações no tema serão aplicadas a todos os modelos da base de conhecimento.

4. Para exibir um modelo em diferentes idiomas, clique no segundo menu suspenso no canto superior esquerdo e selecione um idioma.

5. Para ver como um modelo será exibido em diferentes dispositivos, clique nos ícones de dispositivo na parte superior do editor ou insira uma largura de tela em pixels. 

Editar as cores, a tipografia e o layout de um tema de central de conhecimento 

1. No seu portal da HubSpot, acesse Atendimento > Central de Conhecimento.
2. No canto superior direito, clique no menu suspenso Configurar e selecione Tema.
3. Para alterar as cores de um tema, clique para expandir a seção Cores . Em seguida, insira um valor hexadecimal ou selecione uma cor no seletor de cores para Primário, Secundário, Descendente, e Seu cores da marca será exibido para cada opção.
4. Para alterar a tipografia de um tema, clique em Tipografia:
   • Nas seções Primário e Secundário , clique no menu suspenso Para alterar a cor da fonte, clique no seletor de cores e selecione uma cor de fonte. As opções adicionais de estilo de fonte (por exemplo, espessura da fonte, tamanho da fonte ou maiúsculas/minúsculas de transformação) dependerão da fonte selecionada.
   • Para editar o cabeçalho, corpo ou tipografia de link, clique para expandir o Cabeçalho (H1-H6), Corpo ou o link seções:
     • Clique no menu suspenso de fontes e selecione uma fonte. As opções adicionais de estilo de fonte (por exemplo, espessura da fonte, tamanho da fonte ou maiúsculas/minúsculas de transformação) dependerão da fonte selecionada.
     • Para alterar a cor da fonte, clique no seletor de cores e selecione uma cor de fonte.
5. Para alterar o layout de um tema, clique para expandir a seção Layout e selecione uma opção (por exemplo, Tiles ou Mínimo ). Diferentes opções de layout suportarão diferentes opções de estilo.
6. Quando terminar, clique em Publicar tema na parte superior direita.

Editar estilos de cabeçalho de um tema de central de conhecimento

Você pode editar os estilos de cabeçalho do tema do central de conhecimento, incluindo a largura do cabeçalho, a barra superior, o alternador de idioma, o menu, o botão e a barra de pesquisa. Você também pode editar cores, fontes e estilos de focalização nesses elementos.

Largura do cabeçalho

1. No seu portal da HubSpot, acesse Atendimento > Central de Conhecimento.
2. No canto superior direito, clique no menu suspenso Configurar e selecione Tema.
3. Clique em Header (Cabeçalho) na barra lateral esquerda.
4. Na seção Cabeçalho , selecione Largura total ou Largura de conteúdo .

Barra superior do cabeçalho

1. No seu portal da HubSpot, acesse Atendimento > Central de Conhecimento.
2. No canto superior direito, clique no menu suspenso Configurar e selecione Tema.
3. Clique em Header (Cabeçalho) na barra lateral esquerda.
4. Na seção Cabeçalho , clique para expandir a seção Barra superior .
5. Para editar a cor do plano de fundo, insira um valor de código hexadecimal ou selecione uma cor de plano de fundo no seletor de cores do campo Cor de plano de fundo.
6. Clique no menu suspenso de fontes e selecione uma fonte. As opções adicionais de estilo de fonte (por exemplo, espessura da fonte, tamanho da fonte ou maiúsculas/minúsculas de transformação) dependerão da fonte selecionada.
7. Para alterar a cor da fonte, clique no seletor de cores e selecione uma cor de fonte.
8. Quando terminar, clique em Publicar tema na parte superior direita.

Alternador de idioma do cabeçalho

1. No seu portal da HubSpot, acesse Atendimento > Central de Conhecimento.
2. No canto superior direito, clique no menu suspenso Configurar e selecione Tema.
3. Clique em Header (Cabeçalho) na barra lateral esquerda.
4. Na seção Cabeçalho , clique no alternador Idioma.
5. Na seção Comutador de idiomas , clique em Drop-downs.
6. Clique para expandir a seção Plano de fundo .
7. Insira um valor de código hexadecimal ou selecione uma cor no seletor de cores para os campos de cores 
8. Para editar a transparência, insira um valor percentual no segundo campo. Por exemplo, uma transparência de 100% será opaca, enquanto uma transparência de 0% não será visível. 
9. Quando terminar, clique em Publicar tema na parte superior direita.

Menu Cabeçalho

1. No seu portal da HubSpot, acesse Atendimento > Central de Conhecimento.
2. No canto superior direito, clique no menu suspenso Configurar e selecione Tema.
3. Clique em Header (Cabeçalho) na barra lateral esquerda.
4. Na seção Cabeçalho, clique em Menu.
5. Para editar estilos para listas suspensas, clique em Listas suspensas:
   • Clique para expandir a seção Plano de fundo e insira um valor de código hexadecimal ou selecione uma cor no seletor de cores para os campos Cor e Hover11 . Para editar a transparência, insira um valor percentual no segundo campo. 
     
   • Clique para expandir a seção Texto . Em seguida, clique no menu suspenso de fontes e selecione uma fonte. As opções adicionais de estilo de fonte (por exemplo, espessura da fonte, tamanho da fonte ou maiúsculas/minúsculas de transformação) dependerão da fonte selecionada.
   • Para alterar a cor da fonte, clique no seletor de cores e selecione uma cor de fonte.
6. Para editar o estilo do texto da fonte, clique para expandir a seção Texto :
   • Clique no menu suspenso de fontes e selecione uma fonte. As opções adicionais de estilo de fonte (por exemplo, espessura da fonte, tamanho da fonte ou maiúsculas/minúsculas de transformação) dependerão da fonte selecionada. 
   • Para alterar a cor da fonte, clique no seletor de cores e selecione uma cor de fonte.
7. Para editar a cor do plano de fundo, clique para expandir a seção Plano de fundo e insira um valor de código hexadecimal ou selecione uma cor no seletor de cores.
8. Quando terminar, clique em Publicar tema na parte superior direita.

Botões de cabeçalho

1. No seu portal da HubSpot, acesse Atendimento > Central de Conhecimento.
2. No canto superior direito, clique no menu suspenso Configurar e selecione Tema.
3. Clique em Header (Cabeçalho) na barra lateral esquerda.
4. Na seção Cabeçalho , clique em Botão.
5. Para editar a fonte, clique para expandir a seção Texto :
   • Clique no menu suspenso de fontes e selecione uma fonte. As opções adicionais de estilo de fonte (por exemplo, espessura da fonte, tamanho da fonte ou maiúsculas/minúsculas de transformação) dependerão da fonte selecionada.
   • Para alterar a cor da fonte, clique no seletor de cores e selecione uma cor de fonte.
6.  Para editar o plano de fundo, clique para expandir a seção Plano de fundo e insira um valor de código hexadecimal ou selecione uma cor no seletor de cores. Para editar a transparência, insira um valor percentual.
7. Para editar o estilo da borda, clique para expandir a seção Borda , clique no menu suspenso Estilo e selecione um estilo de borda.
8. Para editar o estilo de canto, clique para expandir a seção Canto . Em seguida, insira um valor de pixel (por exemplo, 30px) no campo nº de pixel.
9. Para editar o estilo de focalização, clique em Focalizar:
   • Clique para expandir a seção Texto .
     • Para alterar a cor da fonte, clique no seletor de cores e selecione uma cor de fonte.
     • Para aplicar estilos de texto de fonte, selecione a italicizeIcon o ícone itálico ou underlineIcon ícone sublinhado.
   • Clique para expandir a seção Plano de fundo e insira um valor de código hexadecimal ou selecione um identificador de cores. Para editar a transparência, insira um valor percentual.
   • Clique para expandir a seção Borda e clique no menu suspenso Estilo para selecionar um estilo de borda.
10. Quando terminar, clique em Publicar tema na parte superior direita.

Barra de pesquisa de cabeçalho

1. No seu portal da HubSpot, acesse Atendimento > Central de Conhecimento.
2. No canto superior direito, clique no menu suspenso Configurar e selecione Tema.
3. Clique em Header (Cabeçalho) na barra lateral esquerda.
4. Na seção Cabeçalho , clique na barra Pesquisar.
5. Para editar o plano de fundo, clique para expandir a seção Plano de fundo: e, em seguida, clique no menu suspenso Tipo de plano de fundo para selecionar uma opção (por exemplo, Cor, Cor, ou As opções de estilo adicionais serão exibidas dependendo do tipo de plano de fundo selecionado.
6. Para editar os estilos de texto do rótulo, clique para expandir a seção Texto do rótulo: 
   • Clique no menu suspenso de fontes e selecione uma fonte. As opções adicionais de estilo de fonte (por exemplo, espessura da fonte, tamanho da fonte ou maiúsculas/minúsculas de transformação) dependerão da fonte selecionada.
   • Para alterar a cor da fonte, clique no seletor de cores e selecione uma cor de fonte.
7. Para editar o estilo da fonte de entrada, clique para expandir a seção Entrada e, em seguida, insira um valor de código hexadecimal ou clique no seletor de cores para selecionar a cor . Para editar a transparência, insira um valor percentual.
8. Quando terminar, clique em Publicar tema na parte superior direita.

Editar estilos de rodapé de um tema de central de conhecimento

Você pode editar os estilos de rodapé do tema do central de conhecimento, incluindo a largura do rodapé, o plano de fundo, o menu, o texto e os ícones sociais. Você também pode editar cores, fontes e estilos de focalização nesses elementos.

Largura e plano de fundo do rodapé

1. No seu portal da HubSpot, acesse Atendimento > Central de Conhecimento.
2. No canto superior direito, clique no menu suspenso Configurar e selecione Tema.
3. Clique em Rodapé na barra lateral esquerda.
4. Para alterar a largura do rodapé, selecione Largura total ou Largura do conteúdo no campo
5. Para alterar a cor do plano de fundo do rodapé, insira um valor de código hexadecimal ou clique no seletor de cores para selecionar uma cor .

Menu Rodapé

1. No seu portal da HubSpot, acesse Atendimento > Central de Conhecimento.
2. No canto superior direito, clique no menu suspenso Configurar e selecione Tema.
3. Clique em Rodapé na barra lateral esquerda.
4. Na seção Rodapé , clique para expandir a seção Menu .
5. Para editar os estilos de fonte do menu, clique no menu suspenso de fontes e selecione uma fonte. As opções adicionais de estilo de fonte (por exemplo, espessura da fonte, tamanho da fonte ou maiúsculas/minúsculas de transformação) dependerão da fonte selecionada.
6. Para alterar a cor da fonte, clique no seletor de cores e selecione uma cor de fonte.
7. Quando terminar, clique em Publicar tema na parte superior direita.

Texto do rodapé

1. No seu portal da HubSpot, acesse Atendimento > Central de Conhecimento.
2. No canto superior direito, clique no menu suspenso Configurar e selecione Tema.
3. Clique em Rodapé na barra lateral esquerda.
4. Na seção Rodapé , clique para expandir a seção Texto .
5. Para editar os estilos de fonte do menu, clique no menu suspenso de fontes e selecione uma fonte. As opções adicionais de estilo de fonte (por exemplo, espessura da fonte, tamanho da fonte ou maiúsculas/minúsculas de transformação) dependerão da fonte selecionada.
6. Para alterar a cor da fonte, clique no seletor de cores e selecione uma cor de fonte.
7. Quando terminar, clique em Publicar tema na parte superior direita.

Ícones sociais de rodapé

1. No seu portal da HubSpot, acesse Atendimento > Central de Conhecimento.
2. No canto superior direito, clique no menu suspenso Configurar e selecione Tema.
3. Clique em Rodapé na barra lateral esquerda.
4. Na seção Rodapé , clique para expandir a seção de ícones Sociais.
5. Para alterar o tamanho dos ícones sociais, clique no menu suspenso Tamanho do ícone e selecione uma opção (por exemplo, Pequeno, Pequeno,
6. Para alterar a forma de ícones sociais, clique no menu suspenso Forma de ícone e selecione uma opção (por exemplo, Círculo ou ícone).
7. Para alterar a cor dos ícones sociais, insira um valor de código hexadecimal ou clique no seletor de cores para selecionar uma cor no campo ícone de cor .
8. Para alterar a cor do plano de fundo dos ícones sociais, insira um valor de código hexadecimal ou clique no seletor de cores para selecionar uma cor no campo de fundo . Para editar a transparência, insira um valor percentual. 
9. Para alterar o alinhamento dos ícones sociais, clique em blockAlignmentLeftIcon Alinhar à esquerda, blockAlignmentCenterIcon Centralizar, ou blockAlignmentRightIcon Alinhar à direita os ícones no campo Alinhamento .
10. Quando terminar, clique em Publicar tema na parte superior direita. 

Editar o conteúdo de um tema de central de conhecimento

Você pode editar o conteúdo do cabeçalho e do rodapé do central de conhecimento. As alterações publicadas ficarão visíveis em todas as páginas de central de conhecimento.

Conteúdo do cabeçalho

1. No seu portal da HubSpot, acesse Atendimento > Central de Conhecimento.
2. No canto superior direito, clique no menu suspenso Configurar e selecione Cabeçalho.
3. No editor de conteúdo global, clique no botão siteTree ícone de conteúdo na barra lateral esquerda.
4. Na barra lateral esquerda, clique no módulo de cabeçalho do Website .
5. Para editar o conteúdo do logotipo do cabeçalho, clique para expandir a seção Logotipo :
   • Para substituir o logotipo padrão, ative a opção Substituir logotipo padrão ou clique em Editar logotipo padrão neste domínio para atualizar o logotipo padrão.
   • Se você optou por substituir o logotipo padrão, poderá clicar em Carregar ou Procurar imagens para adicionar um novo logotipo.
   • Para mostrar o nome da sua empresa quando um logotipo não estiver definido, ative a opção Mostrar nome da empresa quando o logotipo não estiver definido.
   • Para adicionar um link de URL ao seu logotipo, insira um URL no campo Link .
   • Clique em Aplicar opções para ver suas alterações.
6. Para editar o conteúdo do menu de cabeçalho, clique para expandir a seção Menu :
   
   • Para exibir um menu de cabeçalho, clique no menu suspenso Menu e selecione um menu.
   • Para editar um menu de cabeçalho existente, clique em Editar.
   • Para criar um novo menu de cabeçalho, clique em Criar novo.
   • Para editar o número de filhos da árvore de menus que podem ser exibidos no menu de cabeçalho, use o upIcon aumentar e downIcon diminuir ícones no campo Níveis máximos. 
   • Clique em Aplicar opções para ver suas alterações.
7. Para editar o conteúdo do botão do cabeçalho, clique em Botão:
   
   • Para adicionar um botão ao cabeçalho, marque a caixa de seleção Adicionar botão .
   • Para editar o texto do botão no cabeçalho, insira o texto no campo de texto Botão. 
   • Para editar o link do URL do botão, clique no menu suspenso Link para e selecione uma opção (por exemplo, Externo). Campos adicionais serão exibidos dependendo da opção selecionada.
   • Para que o link URL do botão seja aberto em uma nova janela, alterne o link Abrir em uma nova janela para ligado. 
   • Para editar o tipo de link do botão, marque a caixa de seleção ao lado de Sem acompanhamento.
   • Para adicionar um ícone ao botão, marque a caixa de seleção Adicionar ícone :
     • Clique em Substituir para alterar o ícone do botão. 
     • Clique no menu suspenso Posição e selecione a posição do ícone de botão.
   • Clique em Aplicar opções para ver suas alterações.
8. Para editar o conteúdo do seletor de idiomas, clique para expandir a seção Seletor de idiomas :
   
   • Para adicionar o seletor de idioma ao cabeçalho, marque a caixa de seleção Adicionar seletor de idioma.
   • Para editar o modo de exibição do alternador de idioma, clique no menu suspenso Modo de exibição e selecione uma opção (por exemplo, Localized, Localized ,
   • Clique em Aplicar opções para ver suas alterações.
9. Para editar o conteúdo das opções de suporte adicionais, clique para expandir a seção de opções de suporte adicionais :
   
   • Para mostrar um link de portal do cliente, ative a opção Mostrar link de portal do cliente . No campo de texto link de Portal do cliente , insira o texto que será exibido aos visitantes.
   • Para mostrar uma entrada para conteúdo restrito, ative a opção Mostrar entrada para conteúdo restrito . Nos campos de texto Link de entrada e Texto do link de saída , insira o texto de entrada que será exibido aos visitantes.
   • Para mostrar um formulário de suporte, ative a opção Formulário de suporte e selecione um formulário no menu suspenso. Nos campos de título do formulário Suporte e do formulário Suporte , insira o link de texto Suporte que será exibido aos visitantes.
   • Clique em Aplicar opções para ver suas alterações.
10. Quando terminar, clique em Publicar em [#] ativos na parte superior direita.

Conteúdo do rodapé

1. No seu portal da HubSpot, acesse Atendimento > Central de Conhecimento.
2. No canto superior direito, clique no menu suspenso Configurar e selecione Rodapé.
3. No editor de conteúdo global, clique no botão siteTree ícone de conteúdo na barra lateral esquerda.
4. Para exibir um menu de rodapé, clique no módulo de menu Rodapé : 
   
   • Clique no menu suspenso Menu e selecione um menu.
   • Para editar um menu de rodapé existente, clique em Editar.
   • Para criar um novo menu de rodapé, clique em Criar novo.
   • Para editar o número de filhos da árvore de menus que podem ser exibidos no menu de rodapé, use o upIcon aumentar e downIcon diminua os ícones no campo de profundidade de exibição Menu. 
   • Para mostrar o menu de rodapé, marque a caixa de seleção Mostrar menu.
   • Clique em Aplicar opções para ver suas alterações.
5. Para editar o conteúdo do logotipo do rodapé, clique no módulo Logotipo : 
   
   • Para substituir o logotipo padrão, ative a opção Substituir logotipo padrão ou clique em Editar logotipo padrão neste domínio para atualizar o logotipo padrão.
   • Se você optou por substituir o logotipo padrão, poderá clicar em Carregar ou Procurar imagens para adicionar um novo logotipo.
   • Para personalizar como o logotipo do rodapé é carregado, clique no menu suspenso Carregamento de imagens e selecione Navegador padrão,
   • Para adicionar um URL de link ao logotipo do rodapé, insira o texto do URL no campo URL do link .
   • Clique em Aplicar opções para ver suas alterações.
6. Para editar o conteúdo do endereço do rodapé, clique no módulo de endereço do rodapé :
   
   • Clique em Editar na exibição expandida.
   • No editor de conteúdo global, insira o texto para o endereço do rodapé.
   • Clique em exibição expandida na barra lateral esquerda.
7. Para editar o conteúdo de acompanhamento social do rodapé, clique no módulo de acompanhamento Social :
   
   • Na seção Sociais links , clique no editIcon editar ou deleteIcon ícone de deleção para editar ou deletar um vínculo social existente. Para adicionar um link social, clique no botão + Adicionar. 
   • Para mostrar ícones sociais seguidos, marque a caixa de seleção Mostrar ícones .
8. Para editar o conteúdo de direitos autorais do rodapé, clique no módulo de direitos autorais do rodapé :
   • Clique em Editar na exibição expandida.
   • No editor de conteúdo global, insira o texto para os direitos autorais do rodapé.
   • Clique em exibição expandida na barra lateral esquerda.
9. Quando terminar, clique em Publicar em [#] ativos na parte superior direita.