 |
Résumé | Custom Code vous permet de personnaliser la police et les couleurs pour le code partagé sur le site. |
 |
Aperçu | Aperçu sur Discourse Theme Creator |
 |
Lien vers le dépôt | https://github.com/discourse/discourse-custom-code |
 |
Nouveau sur les thèmes Discourse ? | Guide pour débutants sur l’utilisation des thèmes Discourse |
Installer ce composant de thème
Fonctionnalités
Généralement, les polices utilisées pour écrire du code font partie de la famille monospace. Les polices les plus connues sont :
(Cela dit, cela n’empêche personne d’expérimenter avec les polices les plus diverses !)
Pour changer la police, rendez-vous sur https://fonts.google.com
-
choisissez la police que vous souhaitez utiliser
-
et personnalisez-la
-
Sélectionnez EMBED et copiez la chaîne relative à la famille de polices (1) dans le paramètre du thème
Font
-
Copiez et collez la chaîne relative au CSS (2) dans le paramètre du thème
font-family(n’ajoutez pas le caractère;à la fin de la chaîne).
Tous les autres paramètres devraient être assez clairs.
Les paramètres de ce composant sont divisés entre les thèmes clair et sombre. Si vous utilisez les deux, n’oubliez pas d’ajouter le composant aux deux thèmes.
Paramètres
| Nom | Description |
|---|---|
| font | Sélectionnez une nouvelle police parmi Google Font. Selon celle choisie, vous pouvez la personnaliser davantage, par exemple Sarabun:300,400,500. Si non défini, la police par défaut sera appliquée. |
| font size | Spécifie la taille de la police à utiliser. Si non défini, la police par défaut sera appliquée. |
| font family | Spécifie la police à utiliser. Si non défini, la police par défaut sera appliquée. |
| border radius | Sélectionnez le rayon de bordure pour votre code. La valeur par défaut est 0px. |
| hljs light | Thème clair. Choisissez la couleur du texte. |
| code light | Thème clair. Choisissez la couleur du code. |
| code background light | Thème clair. Choisissez la couleur de fond du code. |
| comment light | Thème clair. Choisissez la couleur des commentaires et des balises de documentation. |
| title light | Thème clair. Choisissez la couleur du titre, du nom et des métadonnées. |
| string light | Thème clair. Choisissez la couleur des chaînes de caractères. |
| number light | Thème clair. Choisissez la couleur des nombres. |
| keyword light | Thème clair. Choisissez la couleur des mots-clés, des substitutions, des requêtes et des statuts. |
| class title light | Thème clair. Choisissez la couleur du titre à l’intérieur de l’élément de classe. |
| tag light | Thème clair. Choisissez la couleur des balises. |
| attribute light | Thème clair. Choisissez la couleur des attributs. |
| symbol light | Thème clair. Choisissez la couleur des symboles. |
| hljs dark | Thème sombre. Choisissez la couleur du texte. |
| code dark | Thème sombre. Choisissez la couleur du code. |
| code background dark | Thème sombre. Choisissez la couleur de fond du code. |
| comment dark | Thème sombre. Choisissez la couleur des commentaires. |
| title dark | Thème sombre. Choisissez la couleur du titre, du nom et des métadonnées. |
| string dark | Thème sombre. Choisissez la couleur des chaînes de caractères. |
| number dark | Thème sombre. Choisissez la couleur des nombres. |
| keyword dark | Thème sombre. Choisissez la couleur des mots-clés, des substitutions, des requêtes et des statuts. |
| class title dark | Thème sombre. Choisissez la couleur du titre à l’intérieur de l’élément de classe. |
| tag dark | Thème sombre. Choisissez la couleur des balises. |
| attribute dark | Thème sombre. Choisissez la couleur des attributs. |
| symbol dark | Thème sombre. Choisissez la couleur des symboles. |
Hébergé par nous ? Les composants de thème sont disponibles pour une utilisation sur nos offres Standard, Business et Enterprise.