Às vezes, você pode querer personalizar um tema do Discourse, mas descobre que não há uma seção “Código personalizado” com um botão “Editar código” disponível. Isso geralmente acontece com temas remotos (temas instalados de uma fonte externa) e os temas pré-instalados (Horizon e Foundation). Veja como você ainda pode adicionar suas personalizações:
Entendendo a limitação
Para temas pré-instalados, você verá um aviso informando:
Este tema é pré-instalado e não pode ser excluído ou personalizado
Para temas remotos, você geralmente verá uma mensagem como:
Se você deseja editar este tema, você deve enviar uma alteração em seu repositório
Hospedado pelo Discourse? Então você pode ver: “A edição de temas remotos está desabilitada no Discourse. Por favor, entre em contato conosco se precisar de assistência para transicionar temas remotos personalizados para um tema local.”
Hospedado pelo Discourse? Então você pode ver: “A edição de temas remotos está desabilitada no Discourse. Por favor, Opções de personalização
- Enviar alterações para o repositório principal: Se suas alterações puderem beneficiar outros, considere propô-las aos criadores originais do tema. Isso requer familiaridade com git e GitHub.
- Criar uma cópia (fork) do repositório: Crie sua própria versão do repositório de código do tema, adicione suas personalizações e use sua versão copiada. Este método requer conhecimento técnico e significa que você precisará manter as atualizações por conta própria.
- Criar um componente personalizado: Este método permite que você adicione personalizações sem modificar o tema original. Esta é a abordagem recomendada para a maioria dos administradores e será o foco deste guia.
Criando um componente personalizado
Siga estas etapas para criar um componente personalizado para suas personalizações de tema:
-
Vá para o painel de administração do seu site e navegue até
/admin/config/customize/components -
Clique no botão “Instalar” no canto superior direito
-
Selecione “+ Criar novo”, insira um nome para seu componente (por exemplo, “Meu componente personalizado”), escolha “Componente” como tipo e clique em “Criar”
-
Você é redirecionado automaticamente para o novo componente que criou.
-
Adicione o componente ao(s) tema(s) que deseja personalizar
Não se esqueça de salvar clicando no visto verde -
Clique em “Editar código”
-
Adicione suas personalizações nas seções apropriadas (CSS,
<head>, etc.)
-
Clique em “Salvar” para aplicar suas alterações
Observações importantes
- Suas personalizações serão aplicadas sobre o tema existente.
- Se o tema base for atualizado, seu componente personalizado ainda aplicará suas alterações, o que às vezes pode levar a resultados inesperados.
- Sempre teste suas personalizações minuciosamente após as atualizações do tema.
Ao seguir estas etapas, você pode adicionar CSS personalizado, HTML ou outras modificações ao seu tema Discourse sem editar diretamente os arquivos do tema remoto. Este método é adequado para a maioria dos administradores que procuram fazer pequenas personalizações na aparência ou funcionalidade de seu site.