Parfois, vous souhaiterez peut-être personnaliser un thème Discourse mais constaterez qu’il n’y a pas de section « Code personnalisé » avec un bouton « Modifier le code » disponible. Cela se produit souvent avec les thèmes distants (thèmes installés à partir d’une source externe) et les thèmes préinstallés (Horizon et Foundation). Voici comment vous pouvez toujours ajouter vos personnalisations :
Comprendre la limitation
Pour les thèmes préinstallés, vous verrez une bannière indiquant :
Ce thème est préinstallé et ne peut être supprimé ou personnalisé.
Pour les thèmes distants, vous verrez généralement un message tel que :
Si vous souhaitez modifier ce thème, vous devez soumettre une modification sur son dépôt
Hébergé par Discourse ? Vous pourriez alors voir : « La modification des thèmes distants est désactivée dans Discourse. Veuillez nous contacter si vous avez besoin d’aide pour faire migrer les thèmes distants personnalisés vers un thème local. »
Hébergé par Discourse ? Vous pourriez alors voir : « La modification des thèmes distants est désactivée dans Discourse. Veuillez Options de personnalisation
- Soumettre des modifications au dépôt principal : Si vos modifications peuvent bénéficier à d’autres, envisagez de les proposer aux créateurs d’origine du thème. Cela nécessite une familiarité avec git et GitHub.
- Créer une copie (fork) du dépôt : Créez votre propre version du dépôt de code du thème, ajoutez vos personnalisations et utilisez votre version copiée. Cette méthode nécessite des connaissances techniques et signifie que vous devrez gérer les mises à jour vous-même.
- Créer un composant personnalisé : Cette méthode vous permet d’ajouter des personnalisations sans modifier le thème d’origine. C’est l’approche recommandée pour la plupart des administrateurs et sera l’objectif de ce guide.
Créer un composant personnalisé
Suivez ces étapes pour créer un composant personnalisé pour vos personnalisations de thème :
-
Accédez au panneau d’administration de votre site et accédez à
/admin/config/customize/components -
Cliquez sur le bouton « Installer » en haut à droite
-
Sélectionnez « + Créer nouveau », entrez un nom pour votre composant (par exemple, « Mon composant personnalisé »), choisissez « Composant » comme type et cliquez sur « Créer »
-
Trouvez le composant nouvellement créé dans la liste des composants et cliquez sur le bouton « Modifier »
-
Ajoutez le composant au(x) thème(s) que vous souhaitez personnaliser
N’oubliez pas d’enregistrer en cliquant sur la coche verte -
Cliquez sur « Modifier le code »
-
Ajoutez vos personnalisations dans les sections appropriées (CSS,
<head>, etc.)
-
Cliquez sur « Enregistrer » pour appliquer vos modifications
Notes importantes
- Vos personnalisations seront appliquées par-dessus le thème existant.
- Si le thème de base est mis à jour, votre composant personnalisé continuera d’appliquer ses modifications, ce qui pourrait parfois entraîner des résultats inattendus.
- Testez toujours minutieusement vos personnalisations après les mises à jour du thème.
En suivant ces étapes, vous pouvez ajouter du CSS personnalisé, du HTML ou d’autres modifications à votre thème Discourse sans modifier directement les fichiers de thème distants. Cette méthode convient à la plupart des administrateurs cherchant à apporter de petites personnalisations à l’apparence ou aux fonctionnalités de leur site.