Isenção de responsabilidade: Este artigo foi gerado usando tradução automática.

Páginas principais

  • Atualizado em Mar 28, 2025
  • Publicado em Jan 16, 2025
  • 11 minuto(s) lido(s)
  • Charulatha Ravichandran
  • Manoharan Soundarraj
 Prev Next

Planos que suportam a personalização do site da base de conhecimento

Profissional
Negócio
Empresa






A página inicial (anteriormente "Construtor de página inicial") é a primeira página que um usuário final verá quando visitar sua base de conhecimento. Você pode personalizar sua página inicial adicionando links, alterando cores, incluindo categorias de sua base de conhecimento e muito mais.

Página inicial

1_Screenshot-Document360_landing_page

NOTA

O cabeçalho, a navegação primária, a navegação secundária e o rodapé são exibidos na home page do site da base de conhecimento. Eles podem ser configurados em Configurações () > Personalizar site > Cabeçalho e rodapé do site.

Acessando as configurações de design da página inicial

Para acessar as configurações de design da página inicial,

  1. Navegue até Configurações () > Site da base de conhecimento> Personalizar site no portal da base de conhecimento.

    A página Personalizar site será exibida, com todas as configurações básicas de design do site.

  2. Clique no botão Personalizar site .

  3. Selecione Início em Páginas principais no menu suspenso à esquerda.

    Um design de página inicial padrão está disponível para você personalizar. As diferentes seções da página inicial são listadas à esquerda e uma visualização ao vivo está disponível à direita.

  4. Você pode personalizar os elementos Hero section .

  5. Se necessário, clique em Adicionar seção e escolha entre as opções de bloco Corpo disponíveis, cada uma com necessidades específicas de conteúdo:

    • Rich text: Adicione e formate conteúdo textual usando Markdown para melhorar a legibilidade e a estrutura.

    • Multicolumn card section: Exiba o conteúdo em colunas organizadas, perfeitas para mostrar vários tópicos ou recursos lado a lado.

    • Image with text: Combine recursos visuais com descrições textuais para criar um layout mais dinâmico e visualmente atraente.

    • Custom code section: Incorpore código HTML e CSS personalizado para personalização avançada de conteúdo.

    • Knowledge base categories: Destaque as principais categorias da sua base de conhecimento para melhorar a navegação.

    • Widgets: Adicione elementos interativos, como pesquisas ou formulários de contato, para aumentar o envolvimento do usuário.

    Blocos de carroceria permitem que os administradores da base de conhecimento criem páginas iniciais visualmente atraentes e intuitivas que orientam os usuários de maneira eficaz. Cada bloco fornece uma maneira única de exibir conteúdo, oferecendo flexibilidade na criação de um Página inicialenvolvente e fácil de usar.

    Por exemplo, uma empresa de software pode usar o bloco Categorias da base de conhecimento para exibir guias de produtos. Por outro lado, o bloco de Imagem com texto pode destacar os principais recursos ou anúncios, aprimorando a experiência e o engajamento do usuário.

  6. Você pode reordenar a seção no painel esquerdo usando arrastar e soltar () e clicar no ícone de olho () para ocultar o elemento desejado.

    NOTA

    A seção principal do Herói na parte superior não pode ser arrastada e movida.

  7. CliqueVisualizar para ver como suas alterações serão exibidas no site da base de dados de conhecimento.

  8. Clique em Salvar para salvar suas alterações sem aplicá-las imediatamente.

  9. Clique Publicar para tornar suas alterações recentes visíveis para os leitores.

  10. Clique no íconeMais () e selecione Redefinir para a versão publicada para descartar todas as personalizações salvas e não salvas e reverter para a última versão publicada.

    NOTA

    • O botão Publicar fica ativo somente depois que você salva suas alterações.

    • O recurso Redefinir para a versão publicada está disponível apenas para novos projetos do site da base de dados de conhecimento 2.0 criados após 29 de março de 2025.

Document360 interface showing options to add sections and manage content effectively.

Temas da página inicial

Personalize sua página inicial com os temas do Document360. Você pode configurar um tema exclusivo para cada espaço de trabalho ou idioma.

  1. Clique no ícone Temas () na página de design da página inicial

  2. Selecione um dos temas: Engajar, Inovar, Aprender ou Padrão.

  3. Clique no ícone Olho () para visualizar uma visualização estática.  

  4. Clique em Ativar para implementar o tema selecionado.

Document360 interface showing theme options for customizing a knowledge base homepage.

NOTA

A resolução recomendada para a imagem da página inicial é de 1920x415 pixels (largura x altura). Você pode personalizar a resolução conforme necessário.

SEO da página inicial

Você pode usar um meta título, meta descrição e uma imagem em destaque para sua página inicial.

Para personalizar as configurações de SEO da página inicial:

  1. Clique no ícone Configurações () na página de design da página inicial.

    O painel Configurações será exibido.

  2. Defina as seguintes configurações:

    1. Título: insira o título que aparecerá na guia do navegador para a página inicial da base de conhecimento.

    2. Meta descrição: forneça uma breve meta descrição para sua página inicial. Essas configurações de SEO serão aplicadas apenas à página inicial.

    3. Configurações de visibilidade: ative essa opção para manter a home page visível no site da base de conhecimento. Se desativado, a página inicial ficará oculta e os usuários serão direcionados para a página de documentação.

    4. Imagem em destaque: clique em Escolher imagem para fazer upload de uma imagem em destaque do Drive.

  3. Clique em Salvar para aplicar suas alterações.

Settings menu for Document360 with SEO options and visibility settings displayed.

Documentação

A página Documentação permite personalizar a navegação da categoria ajustando a posição da barra de pesquisa e aplicando cores de fundo.

Acessando as configurações de design da página Documentação

Para acessar as configurações de design da página Documentação:

  1. Navegue até Configurações () > Site da base de conhecimento > Personalizar site no portal da base de conhecimento.

    A página Personalizar site é exibida, exibindo todas as configurações básicas de design do site.

  2. Clique Personalizar site.

  3. No menu suspenso à esquerda, selecione Documentação em Páginas principais.

    Um design de página de documentação padrão estará disponível para você personalizar. As opções de personalização estão listadas à esquerda e uma visualização ao vivo está disponível à direita.

  4. Escolha a posição da barra de pesquisa:

    • Cabeçalho secundário: Posicione a barra de pesquisa no cabeçalho secundário no canto superior direito. Por padrão, essa opção será selecionada.

    • Painel esquerdo: Coloque a barra de pesquisa na parte superior do painel de navegação esquerdo.

  5. Escolha o estilo de barra de pesquisa desejado: Caixa de entrada ou botão.

  6. Marque a caixa de seleção Cor de fundo personalizada para aplicar uma cor personalizada à barra de pesquisa.

    NOTA

    Quando você seleciona uma cor de fundo personalizada, a cor primária dos temas Escuro e Claro é preenchida automaticamente. Você pode personalizar essas cores conforme necessário.

  7. A caixa de seleção Mostrar atalho de teclado está marcada por padrão.

    • Se ativado, Ctrl + K aparece na barra de pesquisa.

    • Isso se aplica tanto à barra de pesquisa de navegação esquerda (dentro dos artigos) quanto à barra de pesquisa da página inicial principal.

  8. Na seção Navegação por Categoria , selecione Adicionar cor de plano de fundo para aplicar uma cor de plano de fundo à seção de categoria no site da Base de Dados de Conhecimento. Por padrão, uma cor de cinza claro (#F4F4F5) é aplicada, o que não pode ser personalizado.

  9. CliqueVisualizar para ver como suas alterações serão exibidas no site da base de conhecimento.

  10. Clique em Salvar para salvar suas alterações sem aplicá-las imediatamente.

  11. Clique em Publicar para tornar suas alterações recentes visíveis para os leitores.

  12. Clique no íconeMais () e selecione Redefinir para a versão publicada para descartar todas as personalizações salvas e não salvas e reverter para a última versão publicada.

NOTA

O recurso Redefinir para a versão publicada está disponível apenas para novos projetos do site da base de dados de conhecimento 2.0 criados após 29 de março de 2025.

Document360 interface showing documentation options and search functionality for users.

Página de login

Se sua base de conhecimento for privada ou de acesso misto, o leitor deverá fazer login com suas credenciais para visualizar o conteúdo. Você pode personalizar essa página de logon usando a opção Personalizar site disponível no Document360.

Acessando as configurações de design da página de login

Para acessar as configurações de design da página de login:

  1. Navegue até Configurações () > Site da base de conhecimento > Personalizar site no portal da base de conhecimento.

    A página contém todas as configurações básicas de design do site.

  2. Clique no botão Personalizar site .

  3. No menu suspenso à esquerda, selecione Login em Páginas principais.

    Você verá um design de página de login padrão pronto para personalização.

  4. Escolha uma das seguintes opções:

    • Estilo básico: personalize apenas a imagem padrão. Expanda o menu suspenso Imagem com texto e selecione Imagem. O painel Imagem será aberto. Clique em Alterar e escolha a imagem desejada nas imagens do sistema. Na seção Alinhamento, selecione Esquerda, Centro ou Direita para ajustar o alinhamento da imagem.

    • Estilo personalizado: adicione HTML e CSS personalizados. Você pode ativar/desativar a alternância Visualização à direita para alternar entre a exibição renderizada e a exibição de código.

  5. CliqueVisualizar para ver como suas alterações serão exibidas no site da base de conhecimento.

  6. CliqueSalvar para salvar suas alterações sem aplicá-las imediatamente.

  7. Clique em Publicar para tornar suas alterações recentes visíveis para os leitores.

  8. Clique no íconeMais () e selecione Redefinir para a versão publicada para descartar todas as personalizações salvas e não salvas e reverter para a última versão publicada.

NOTA

O recurso Redefinir para a versão publicada está disponível apenas para novos projetos do site da base de dados de conhecimento 2.0 criados após 29 de março de 2025.

Login interface displaying fields for email and password with a login button.

Perguntas frequentes

Como adiciono imagens à página inicial?

Para adicionar imagens à página inicial, cole o seguinte código no Custom HTML:

<img src="paris.jpg" alt="Paris" class="center">

Para personalizar o alinhamento, adicione o seguinte código CSS na seção Custom CSS & JavaScript :

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

Como altero a posição da barra de pesquisa para refletir no site da base de conhecimento?

Para ajustar a posição da barra de pesquisa no site da base de conhecimento, siga estas etapas:

  1. Navegue até Configurações () > Site da base de conhecimento > Personalizar site no portal da base de conhecimento.

  2. Clique em Personalizar site. Selecione a lista suspensa e clique em Documentação.

  3. No painel esquerdo, você tem duas opções para alternar a posição da barra de pesquisa.

    Painel esquerdo: Coloque a barra de pesquisa na árvore de categorias do lado esquerdo.

    Cabeçalho secundário: coloque a barra de pesquisa no lado direito do cabeçalho secundário.

  4. Se necessário, marque a caixa Adicionar cor de fundo para aplicar a cor de fundo à barra de pesquisa.

  5. Uma vez feito isso, clique em Salvar e publicar.

Como altero o título da guia do navegador para a página inicial da minha base de conhecimento?

O título de SEO da página inicial aparece como o nome da guia do navegador. Para alterar o título de SEO da página inicial:

  1. Navegue até Configurações () > Site da base de conhecimento> Personalizar site no portal da base de conhecimento.

    A página Personalizar site será exibida, contendo todas as configurações básicas de design do site.

  2. Clique no botão Personalizar site .

  3. No menu suspenso à esquerda, selecione Página inicial.

  4. Clique no ícone Configurações () na página inicial.

    O painel Configurações aparecerá.

  5. Insira o título desejado para sua página inicial.

  6. Uma vez feito isso, clique em Salvar e publicar.

Como integrar um carregador de vídeo em sua página inicial?

Adicionar um carregador de vídeo visualmente atraente à sua página inicial pode criar uma sensação de curiosidade e interatividade para seus visitantes. Siga estas etapas simples para integrar perfeitamente um carregador de vídeo:

  1. Navegue até Configurações () > Site da base de conhecimento > Personalizar site no portal da base de conhecimento.

    A página Personalizar site será exibida, contendo todas as configurações básicas de design do site.

  2. Clique no botão Personalizar site .

  3. No menu suspenso à esquerda, selecione Página inicial.

  4. Crie uma nova seção de código personalizado e insira o seguinte código HTML, substituindo o src link pelo link de vídeo da sua unidade:

    htmlCopy code<div class="video__loader">
    <video muted autoplay loop>
        <source src="https://cdn.document360.io/560b3c6e-18a1-4ad6-babc-d0257662eab2/Images/Documentation/Revolving_Video.mp4" />
    </video>
</div>

    Este código integrará perfeitamente o carregador de vídeo em sua página inicial, aprimorando seu apelo visual e cativando seu público desde o momento em que eles chegam.

  5. No menu suspenso à esquerda, selecione CSS/JavaScript personalizado e navegue até a guia CSS .

  6. Substitua "Innovate" o seguinte snippet de código pelo nome do tema configurado (por exemplo, Engage, Learn, Innovate ou Default):

    cssCopy codebody.innovate {
    position: relative;
    overflow: hidden !important;
}

body.innovate.custom--loaded {
    overflow: auto !important;
}

/* Loader */
.video__loader {
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 0;
    left: 0;
    background: var(--color-dark);
    opacity: 1;
    visibility: visible;
    z-index: 9999999999;
    transition: all 1s ease;
}

.video__loader.remove--loader {
    opacity: 0;
    visibility: hidden;
}

.video__loader video {
    width: 100%;
}

    Isso garante que o estilo CSS esteja alinhado com o tema escolhido, otimizando a apresentação visual para melhorar a experiência do usuário.

  7. Navegue até a guia JavaScript .

  8. Substitua "innovate" o seguinte trecho de código pelo nome do seu tema:

    javascriptCopy code/* Loader */
var elBody = document.querySelector("body.innovate");
var customLoaderVideo = document.querySelector(".video__loader");

document.addEventListener("DOMContentLoaded", function() {
    setTimeout(function() {
        elBody?.classList.add("custom--loaded");
        customLoaderVideo?.classList.add("remove--loader");
    }, 5000);
});

    Essa personalização garante que a funcionalidade JavaScript se integre perfeitamente ao seu tema, aprimorando o desempenho geral do seu site.

NOTA

A função de carregador de vídeo funcionará exclusivamente na página inicial e não se aplicará às páginas de documentação.

Como desativar a página inicial no site da base de conhecimento?

  1. Navegue até Configurações () > Site da base de conhecimento> Personalizar site no portal da base de conhecimento.

  2. Clique no ícone Configurações () na página de design da página inicial.

  3. Desative a alternância Configurações de visibilidade e clique em Salvar.

Como adicionar um botão de contato/registro à sua página de login?

Adicionar um botão de suporte à sua página de login pode simplificar o processo de obtenção de assistência. Siga estas etapas fáceis para integrar perfeitamente um botão de suporte à sua página de login:

  1. Navegue até Configurações () > Site da base de conhecimento > Personalizar site no portal da base de conhecimento.

  2. Selecione o botão Personalizar site .

  3. Selecione Login no menu suspenso à esquerda no grupo Páginas principais.

  4. Em seguida, escolha o botão de opção Estilo personalizado para ativar as modificações especificamente para sua página de login.

  5. Na guia Personalização de HTML, adicione o seguinte código para criar seu botão de suporte:

    htmlCopy code<div class="login-form--support">
    <button class="support-button">
        <a href="Support portal button or registration button link">Contact Support</a>
    </button>
    <p>Click here to Contact Support</p>
</div>

  6. Ao lado da guia HTML, localize a guia Personalização de CSS. Cole o seguinte código para garantir que o botão de suporte esteja centralizado na página:

    cssCopy code.login-form--support {
    text-align: center; /* Centers the content inside the element */
}

Seguindo estas etapas, você adicionará com sucesso um botão de suporte à sua página de login. Esse aprimoramento permite que os usuários que enfrentam desafios acessem facilmente os recursos de suporte sem sair da interface de login, melhorando significativamente sua experiência. Fornecer assistência rápida exatamente onde é necessário pode levar a uma maior satisfação do usuário.

Artigos relacionados