JavaScript personalizado

O JavaScript personalizado no Document360 permite que você adicione seu próprio código JavaScript para expandir a funcionalidade do seu site de base de conhecimento além do que as configurações integradas fornecem. Você cola o código diretamente no portal e ele roda em todas as páginas do seu site de base de conhecimento. Essa é a ferramenta certa quando você precisa adicionar comportamento dinâmico, interagir com elementos de página, integrar scripts de terceiros ou automatizar interações que não podem ser configuradas pelas configurações padrão.

Quando usar JavaScript personalizado

Use JavaScript personalizado quando precisar de comportamentos ou funcionalidades que o CSS e as configurações embutidas não possam oferecer:

• Modificar a estrutura da página dinamicamente – reordenar, mostrar ou esconder elementos na página com base nas condições. Por exemplo, mova a seção de artigos relacionados acima da seção de feedback, ou oculte a barra de navegação da esquerda para leitores específicos.
• Adicione interatividade com cabeçalhos - adicione ícones de redes sociais, links de feedback dinâmico ou botões personalizados ao cabeçalho de navegação usando JavaScript.
• Integre ferramentas de terceiros - incorpore scripts de análise, widgets de chat, ferramentas de feedback ou rastreamento personalizado que precisam rodar em todas as páginas.
• Mostre apenas a categoria ativa na barra lateral esquerda - filtre a árvore de categorias para que apenas a categoria ativa atualmente e suas subcategorias fiquem visíveis, reduzindo a confusão de navegação para os leitores.

Antes de começar

• Você deve ter uma conta de equipe com acesso administrativo ao portal da Knowledge Base.
• O JavaScript personalizado se aplica globalmente a todo o site da base de conhecimento – ele roda em todas as páginas e afeta todos os leitores.
• O Document360 não valida nem manipula seu código JavaScript.
• Erros não serão sinalizados automaticamente e scripts quebrados podem atrapalhar a experiência do site. Teste suas mudanças cuidadosamente antes de salvar.

panel.addEventListener('articleload', function() {
  // Your custom JavaScript code here
});

Como adicionar JavaScript personalizado

1. Navegue até Configurações () > Site da base de conhecimento na barra de navegação esquerda do portal da Base de Conhecimento.
2. No painel de navegação à esquerda, navegue até Personalização do Site.

3. Clique em CSS & JavaScript Personalizados.
4. Selecione a aba JavaScript . O editor de código JavaScript aparece.
5. Cole seu código JavaScript na área de texto.
6. Clique em Salvar para aplicar suas alterações.

O JavaScript agora está ativo no seu site de base de conhecimento. Visite o site para verificar o comportamento.

Exemplos de casos de uso

Os exemplos a seguir mostram personalizações comuns que você pode alcançar com JavaScript personalizado.

Mova artigos relacionados acima da seção de feedback

panel.onload = function () {
  $(".content_block_text").append("<div class=\"sperator\"><hr></div>");
  $('.related-articles-container').appendTo('.content_block_text')
}

Mostrar apenas a categoria ativa na barra lateral esquerda

/* Left sidebar category start */
let parent_data = null;
function client_tree_data(data) {
  parent_data = data;
  window.clientData = data;
  const slug = window.location.pathname.split('/').filter(Boolean).pop();
  if (slug === "docs") {
    return [data[0]];
  }
  return data.filter(item => markIfContainsSlug(item, slug));
}
function markIfContainsSlug(node, slug) {
  if (node.slug === slug) {
    node.found = true;
    return true;
  }
  return node.children?.some(child => markIfContainsSlug(child, slug)) || false;
}
/* Left sidebar category end */

Melhores práticas

• Use o articleload evento para compatibilidade com SPA - envolva todo o JavaScript que interage com o conteúdo do artigo para panel.addEventListener('articleload', function() { ... }) garantir que ele dispare de forma confiável em toda navegação de artigo, não apenas no carregamento inicial da página.
• Mantenha scripts focados e mínimos – JavaScript personalizado roda em cada página. Roteiros inchados ou lentos aumentam o tempo de carregamento da página para todos os leitores. Inclua apenas o que for necessário.
• Teste tanto no modo claro quanto no escuro – scripts que manipulam elementos ou estilos DOM podem se comportar de forma diferente entre os temas. Sempre faça uma prévia de ambos antes de salvar.
• Comente seu código - adicione comentários inline explicando o que cada bloco faz, especialmente se vários membros da equipe gerenciam o JavaScript. Exemplo: /* Moves related articles above feedback — added June 2026 */
• Remover scripts não utilizados - scripts que não são mais necessários devem ser excluídos do editor. O código remanescente aumenta a complexidade e pode causar conflitos inesperados com mudanças futuras.
• JavaScript personalizado não aparece em links de pré-visualização compartilháveis – para verificar o comportamento final, publique suas alterações e visualize diretamente o site da base de conhecimento ao vivo.

FAQ