Como personalizar o seu portal Docsie através da inserção do código Docsie no Visual Studio Code.
O Docsie oferece muitas possibilidades de personalização. Neste artigo, vou orientá-lo sobre os passos necessários para começar a personalizar o seu portal Docsie. Tenha em mente que não sou um programador ou designer profissional, e que a sua equipa técnica pode utilizar estas ferramentas para criar portais Docsie muito mais elegantes do que eu. Este é apenas um guia passo a passo para ajudá-los a começar!
PASSO 1¶
O primeiro passo é obter a sua linha de código. Encontre a sua conta no canto superior direito onde estão os três pontos e clique neles. Isto levá-lo-á ao painel de definições do Docsie.
PASSO 2¶
A seguir, clique no botão 'Deployment' no lado esquerdo.
Uma vez nas definições de implementação, terá a possibilidade de criar um portal de conhecimento através da nuvem Docsie, ou criar um portal de conhecimento no website da sua empresa utilizando uma linha de código que pode adicionar ao seu HTML para iniciar o processo de estilização. Isto é feito simplesmente clicando em 'Configure a new deployment +'.
PASSO 3¶
A seguir, clique no separador que diz 'Custom deployment', escreva o seu website em 'Deployment URL' e depois clique em 'Create web portal'.
Depois de concluído, certifique-se de descer e encontrar o seu portal no final da lista de portais e depois clique em 'Get deployment script'.
PASSO 4¶
Agora copie o seu script e vamos passar para o Visual Studio Code!
Se precisar de mais informações sobre como obter o código incorporado do seu Docsie, consulte o meu artigo sobre publicação de documentação com código incorporado aqui.
Agora, no Visual Studio Code, crie um ficheiro (a menos que já tenha um ficheiro pronto) para index.html, index.css e index.js. Depois, abra o seu HTML e cole o seu código no corpo do HTML (abaixo da tag </head>).
PASSO 5¶
Agora para o passo 5, precisamos criar um 'Estilo Básico'.
Pode encontrar mais informações sobre como aplicar estilos básicos aos seus portais Docsie através do nosso link https://help.docsie.io/?doc=/publish-documentation-portal/docsie-styling-guide/base-style/
No meu exemplo, adicionei isto ao meu HTML. Como pode ver, adicionei um link com o nome da empresa e fiz algumas alterações ligeiras no CSS.
Os meus resultados parecem muito básicos, mas queria mostrar-lhe o potencial que a sua equipa técnica tem para melhorar os portais de conhecimento Docsie e criar portais que correspondam à aparência e sensação da sua marca. Lembre-se que pode ter um estilo e cores diferentes; na maioria dos casos, os nossos utilizadores colocam o seu logótipo incorporado com links do seu site, adicionam barras de navegação no topo para que o seu portal de conhecimento Docsie se integre perfeitamente nos sites das suas empresas e corresponda ao ambiente e CSS dos seus sites atuais.
PASSO 6¶
O último passo foi adicionar algumas alterações de estilo através deste texto:
<style>
:root {
--docsie-font-family: garamond;
--docsie-font-family-head: inherit;
--docsie-font-family-mono: monospace;
--docsie-hue-primary: 200;
--docsie-hue-gray: var(--docsie-hue-primary);
--docsie-sat-primary: 100%;
--docsie-page-width: 1800px;
--docsie-notice-background: var(--docsie-color-primary-darker);
}
</style>
Colei-o abaixo da última tag div do 'estilo básico'.
E os resultados das minhas alterações de estilo muito básicas foram estes:
Agora que tem todas as ferramentas à sua disposição, experimente por si mesmo e veja como é alterar as coisas e criar belos portais de conhecimento dos quais pode orgulhar-se! Estou 100% certo de que os seus portais de conhecimento ficarão muito mais elegantes que o meu! :) Portanto, experimente e, acima de tudo, divirta-se!