# Composant de thème pour les en-têtes de catégories Discourse

**URL:** https://meta.discourse.org/t/discourse-category-headers-theme-component/148682
**Category:** Theme component
**Created:** [Avril 21, 2020, 1:02 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682 "2020-04-21T01:02:59Z")
**Posts on this page:** 20
**Page:** 7

<div class="post-metadata">

### Author: ![jackierenee](https://avatars.discourse-cdn.com/v4/letter/j/a3d4f5/32.png) [@jackierenee](https://meta.discourse.org/u/jackierenee)
#### Post date: [Juillet 3, 2025, 2:31 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/126 "2025-07-03T14:31:52Z")

</div>

@NateDhaliwal ok, merci d’avoir examiné la question ! C’est assez décevant car nous aimions vraiment ce TC, mais s’il n’est pas possible de le réparer et de l’avoir sur notre site, je vais simplement le laisser de côté pour le moment et chercher d’autres moyens de rendre les en-têtes de catégorie attrayants.

---

<div class="post-metadata">

### Author: ![RGJ](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rgj/32/523185_2.png) [@RGJ](https://meta.discourse.org/u/RGJ)
#### Post date: [Juillet 3, 2025, 3:20 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/128 "2025-07-03T15:20:55Z")

</div>

@jackierenee J’ai pris la liberté d’intervenir et de jeter un coup d’œil à votre site.  
Il semble que vous n’ayez fait que supprimer le composant de thème du thème parent, l’avoir mis à jour et l’avoir réintégré.

Le problème est que Discourse ne récupère pas lorsqu’un composant de thème est mis à jour au-delà de la compatibilité et qu’une épingle est ensuite ajoutée.

La bonne façon de récupérer d’une telle situation est :

- aller au composant de thème
- faire défiler tout en bas
- copier les paramètres de « l’éditeur de paramètres »
- les stocker dans un éditeur de texte
- supprimer complètement ( 🗑 **supprimer** ) le composant de thème
- le réintégrer à partir du dépôt Github
- copier les paramètres de l’éditeur de texte et les coller dans « l’éditeur de paramètres »
- apporter des corrections si nécessaire (parfois, des paramètres sont ajoutés dans la nouvelle version, vous devrez donc les supprimer à nouveau, l’éditeur vous indiquera quoi faire lorsque vous tenterez de les enregistrer)
- ajouter le composant de thème au thème parent.

Je l’ai fait sur votre site et les bannières s’affichent à nouveau.

Pour les auteurs de composants de thème : il est très utile d’utiliser le champ `version` dans `about.json` afin que l’administrateur sache quelle version d’un composant de thème est utilisée. Malheureusement, Discourse n’affiche pas les versions de commit pour les composants de thème comme il le fait pour les plugins.

---

<div class="post-metadata">

### Author: ![pfaffman](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pfaffman/32/120154_2.png) [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [Juillet 3, 2025, 4:21 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/129 "2025-07-03T16:21:28Z")

</div>

> [@RGJ](#):
>
> Pour les auteurs de composants de thème&nbsp;: cela aide beaucoup si vous utilisez le champ `version` dans `about.json` afin qu’il soit réellement visible par l’administrateur sur quelle version se trouve un composant de thème.

Cela semble poli. Je vais m’efforcer d’ajouter une action GitHub qui mettra automatiquement à jour une version à chaque nouveau commit sur la branche principale.

---

<div class="post-metadata">

### Author: ![nathank](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/nathank/32/290039_2.png) [@nathank](https://meta.discourse.org/u/nathank)
#### Post date: [Juillet 3, 2025, 7:57 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/130 "2025-07-03T19:57:49Z")

</div>

> [@Sebastien\_Caenen](#):
>
> Je voudrais obtenir un rendu comme celui-ci :
> 
> ![image](https://global.discourse-cdn.com/meta/original/4X/6/6/7/667963e4f20f9f560a31e5f4fad6264648924093.png)
> 
> Il y a un espace clair entre le titre (« COVID19… ») et le paragraphe en dessous.

Vous devriez pouvoir y parvenir facilement en utilisant le réglage `Afficher le nom de la catégorie` de ce composant de thème - il est conçu spécifiquement pour votre cas d’utilisation.

> [@pfaffman](#):
>
> Je vais m’efforcer d’ajouter une action GitHub qui mettra automatiquement à jour une version à chaque nouveau commit sur la branche principale.

Cela semble être une très bonne idée ! Veuillez documenter comment faire cela et l’ajouter au guide “Développement de composants de thème pour les nuls” (s’il en existe un).

> [@NateDhaliwal](#):
>
> J’ai fusionné une PR. Pourriez-vous essayer de mettre à jour et de voir si cela fonctionne ?

Je l’ai essayé - toutes mes préoccupations ont été résolues, et cela rend très bien. Beau travail !!!

Hé, serait-il difficile d’ajouter la possibilité de spécifier combien de paragraphes du sujet “À propos” utiliser pour la description ? Personnellement, je trouve que le paragraphe unique est assez restrictif et j’aimerais pouvoir spécifier (peut-être par catégorie) combien de paragraphes utiliser.

Enfin (tout en restant concentré sur ce TC), pensez-vous qu’il serait bon de déplacer le “Lire la suite…” à la fin du dernier paragraphe ? Cela permettrait d’économiser beaucoup d’espace perdu dans mon instance. Mais d’un autre côté, si nous pouvions utiliser plusieurs paragraphes, cela pourrait entrer en conflit avec le deuxième paragraphe s’il contenait des liens et autres. 🤔.

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [Juillet 3, 2025, 11:22 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/132 "2025-07-03T23:22:00Z")

</div>

> [@nathank](#):
>
> Hé, serait-il difficile d’ajouter la possibilité de spécifier combien de paragraphes du sujet « À propos » utiliser pour la description ? Personnellement, je trouve qu’un seul paragraphe est assez restrictif et j’aimerais pouvoir spécifier (peut-être par catégorie) combien de paragraphes utiliser.

Hmm… la façon dont le code accède à la description de la catégorie est d’utiliser `this.args.category.description`. Si je me souviens bien, elle arrive déjà sous forme d’un seul paragraphe. Je vais y jeter un œil. Peut-être que je pourrais faire un `fetch()` ou une requête ajax, mais cela pourrait être plus lent.

> [@nathank](#):
>
> Enfin (tout en restant concentré sur ce TC), pensez-vous qu’il serait bon de déplacer le « Lire la suite… » à la fin du dernier paragraphe ? Cela permettrait certainement d’économiser beaucoup d’espace perdu dans mon instance. Mais d’un autre côté, si nous pouvions utiliser plusieurs paragraphes, cela pourrait quelque peu entrer en conflit avec le deuxième paragraphe s’il s’agissait de liens et autres. 🤔.

Peut-être un paramètre pour sélectionner s’il est en ligne ou non ? Laissez-moi jeter un œil.

---

<div class="post-metadata">

### Author: ![patrickemin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/patrickemin/32/520162_2.png) [@patrickemin](https://meta.discourse.org/u/patrickemin)
#### Post date: [Juillet 4, 2025, 12:14 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/133 "2025-07-04T00:14:17Z")

</div>

Salut, j’ai remarqué que la taille de la police du texte de la catégorie, lorsqu’elle est définie sur “plus petit”, n’est pas prise en compte, elle est toujours grande (c’est arrivé il y a un jour ou deux je pense).

---

<div class="post-metadata">

### Author: ![nathank](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/nathank/32/290039_2.png) [@nathank](https://meta.discourse.org/u/nathank)
#### Post date: [Juillet 4, 2025, 4:19 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/134 "2025-07-04T04:19:43Z")

</div>

Nous l’avons modifié, de sorte que la description de la catégorie soit plus petite ou plus grande que la valeur par défaut dans le cœur (qui semble avoir augmenté récemment).

Je vais vérifier qu’il n’y a pas de conflit de thème qui était un faux problème ici.

---

<div class="post-metadata">

### Author: ![jackierenee](https://avatars.discourse-cdn.com/v4/letter/j/a3d4f5/32.png) [@jackierenee](https://meta.discourse.org/u/jackierenee)
#### Post date: [Juillet 4, 2025, 6:51 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/135 "2025-07-04T06:51:30Z")

</div>

Salut @RGJ, merci beaucoup pour ça ! Je ne savais pas que les composants de thème fonctionnaient de cette façon. Je garderai certainement cela à l’esprit si nous rencontrons à nouveau cette situation. J’apprécie vraiment votre aide ! 🙏

---

<div class="post-metadata">

### Author: ![RGJ](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rgj/32/523185_2.png) [@RGJ](https://meta.discourse.org/u/RGJ)
#### Post date: [Juillet 4, 2025, 7:28 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/136 "2025-07-04T07:28:55Z")

</div>

> [@jackierenee](#):
>
> Je n’avais aucune idée que les composants de thème fonctionnaient de cette façon

C’est une situation très rare et spécifique, avec un comportement étrange, et j’espère que nous ne rencontrerons plus cela pendant un certain temps !

---

<div class="post-metadata">

### Author: ![patrickemin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/patrickemin/32/520162_2.png) [@patrickemin](https://meta.discourse.org/u/patrickemin)
#### Post date: [Juillet 10, 2025, 3:11 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/137 "2025-07-10T15:11:10Z")

</div>

Salut, j’ai résolu le problème avec ce CSS :

```plaintext
.category-title-description .cooked {
  font-size: small;
}

```

---

<div class="post-metadata">

### Author: ![HTW](https://avatars.discourse-cdn.com/v4/letter/h/7bcc69/32.png) [@HTW](https://meta.discourse.org/u/HTW)
#### Post date: [Juillet 13, 2025, 5:33 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/138 "2025-07-13T17:33:32Z")

</div>

Je rencontre également des pages de catégories vides sur les navigateurs de bureau et mobiles dans la version 3.5.0.beta8-dev de Discourse lorsque ce composant a le paramètre suivant :

```
	"setting": "show_mobile",
	"value": false

```

Lorsque je le réinitialise à la valeur par défaut (true), les pages s’affichent correctement.

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [Juillet 13, 2025, 10:58 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/139 "2025-07-13T22:58:16Z")

</div>

Cela devrait techniquement fonctionner… cette ligne était là avant même la mise à jour. Je vais jeter un œil.

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [Juillet 14, 2025, 4:36 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/140 "2025-07-14T04:36:12Z")

</div>

@HTW J’ai poussé un correctif. Dites-moi si cela fonctionne maintenant !

---

<div class="post-metadata">

### Author: ![HTW](https://avatars.discourse-cdn.com/v4/letter/h/7bcc69/32.png) [@HTW](https://meta.discourse.org/u/HTW)
#### Post date: [Juillet 14, 2025, 5:41 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/141 "2025-07-14T05:41:23Z")

</div>

Corrigé. Merci beaucoup.

---

<div class="post-metadata">

### Author: ![nathank](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/nathank/32/290039_2.png) [@nathank](https://meta.discourse.org/u/nathank)
#### Post date: [Août 8, 2025, 4:46 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/142 "2025-08-08T04:46:30Z")

</div>

Il semble y avoir eu des changements récents dans les en-têtes de catégorie, ce qui signifie que les en-têtes principaux ne sont plus masqués lorsque vous utilisez ce composant.

Devrions-nous essayer d’aligner ce composant avec les changements de style dans le cœur du système ?

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [Août 8, 2025, 4:58 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/143 "2025-08-08T04:58:50Z")

</div>

Hmm… quels sont les changements ici ? Peut-être une capture d’écran ? Merci.

---

<div class="post-metadata">

### Author: ![nathank](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/nathank/32/290039_2.png) [@nathank](https://meta.discourse.org/u/nathank)
#### Post date: [Août 8, 2025, 5:20 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/144 "2025-08-08T05:20:10Z")

</div>

Avec le TC actif sur un site fraîchement mis à jour (il est clair que le style est devenu un peu fou) :

 ![image](https://global.discourse-cdn.com/meta/original/4X/c/6/2/c62cf4fe9f6b6e5c5504475a1eab0e4f3e683e71.png)

Avec le TC inactif :

 ![image](https://global.discourse-cdn.com/meta/original/4X/6/2/9/6291da4d5f4c0415ba7be2d64002d009225b6ca3.png)

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [Août 8, 2025, 7:22 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/145 "2025-08-08T07:22:11Z")

</div>

J’ai ajouté un `!important` à l’arrière… est-ce que ça marche maintenant ?

---

<div class="post-metadata">

### Author: ![jrgong](https://avatars.discourse-cdn.com/v4/letter/j/c57346/32.png) [@jrgong](https://meta.discourse.org/u/jrgong)
#### Post date: [Août 8, 2025, 11:29 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/146 "2025-08-08T11:29:12Z")

</div>

Petite observation : La taille du texte de description est toujours trop grande. Même l’option « plus petite » utilise `var(--font-up-2)`. Y a-t-il une chance d’ajouter `var(--font-0)` (« la plus petite » ou « par défaut ») comme option.

Accepteriez-vous une PR pour cela ?

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [Août 8, 2025, 12:19 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/147 "2025-08-08T12:19:39Z")

</div>

@jrgong Je viens de [fusionner une PR](https://github.com/naidihr/discourse-category-headers/pull/17) qui ajoute une option ‘smallest’, avec la valeur de `$font-0`. Faites-moi savoir si vous rencontrez des problèmes !

[Previous page](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682.md?page=6)

[Next page](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682.md?page=8)
