# 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:** 3

<div class="post-metadata">

### Author: ![Drew-ART](https://avatars.discourse-cdn.com/v4/letter/d/8edcca/32.png) [@Drew-ART](https://meta.discourse.org/u/Drew-ART)
#### Post date: [Juillet 1, 2022, 12:49 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/43 "2022-07-01T12:49:18Z")

</div>

Je vois beaucoup de messages d’erreur dans la Console mentionnant ce composant.

> Avis de dépréciation : utilisez siteSettings injecté au lieu de Discourse.SiteSettings (obsolète depuis Discourse 2.8) (suppression dans Discourse 2.9)

Nous avons corrigé cela dans un autre plugin en remplaçant `Discourse.application.SiteSettings[...]` par `container.lookup('site-settings:main')[...]`

Peut-être que cela résoudrait également les problèmes ici.

---

<div class="post-metadata">

### Author: ![Rhod](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rhod/32/507923_2.png) [@Rhod](https://meta.discourse.org/u/Rhod)
#### Post date: [Septembre 1, 2022, 4:53 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/44 "2022-09-01T16:53:19Z")

</div>

Cela ne fonctionne pas pour moi, j’ai déjà essayé toutes les méthodes, en modifiant la configuration de l’affichage des catégories, je suis même revenu au thème «&nbsp;Par défaut&nbsp;» de Discourse et je n’arrive toujours pas à le faire fonctionner.

 ![image](https://global.discourse-cdn.com/meta/original/4X/d/c/1/dc12b6718625b2a4cefcd7dea73db98a06eb3ae6.png)

---

<div class="post-metadata">

### Author: ![Tris20](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tris20/32/264639_2.png) [@Tris20](https://meta.discourse.org/u/Tris20)
#### Post date: [Septembre 1, 2022, 4:57 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/45 "2022-09-01T16:57:24Z")

</div>

Je viens de passer de la version 2.9.0.beta8 à la 2.9.0.beta9 et je rencontre le même problème. Pour une raison quelconque, cela ne semble pas fonctionner.

---

<div class="post-metadata">

### Author: ![Rhod](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rhod/32/507923_2.png) [@Rhod](https://meta.discourse.org/u/Rhod)
#### Post date: [Septembre 1, 2022, 4:59 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/46 "2022-09-01T16:59:10Z")

</div>

Et sur github, il n’a pas été mis à jour depuis 2 ans, @Rhidian ce composant n’est-il plus pris en charge ?

 ![image](https://global.discourse-cdn.com/meta/original/4X/1/4/8/1488294134006082cd65a4dd00ac1fac6a27bb89.png)

---

<div class="post-metadata">

### Author: ![Rhidian](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rhidian/32/176630_2.png) [@Rhidian](https://meta.discourse.org/u/Rhidian)
#### Post date: [Septembre 1, 2022, 5:01 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/47 "2022-09-01T17:01:59Z")

</div>

Je vais y jeter un œil quand je pourrai. Il n’est mis à jour que si une mise à jour de Discourse le casse. Je suis heureux d’accepter les pull requests sur GitHub si quelqu’un a une chance d’y jeter un œil avant moi.

---

<div class="post-metadata">

### Author: ![Tris20](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tris20/32/264639_2.png) [@Tris20](https://meta.discourse.org/u/Tris20)
#### Post date: [Septembre 1, 2022, 5:05 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/48 "2022-09-01T17:05:29Z")

</div>

![image](https://cdck-file-uploads-global.s3.dualstack.us-west-2.amazonaws.com/meta/original/4X/0/9/1/09151db591ba36e8a6be00d9e078e0f1f0fd04ad.png)

Cela me saute aux yeux. Je ne sais pas encore pourquoi la version bêta9 en particulier a déclenché l’échec.

En comparant mes instances, il n’y a eu aucun problème pour [cette version](https://github.com/discourse/discourse/commits/010bb20f53cc81068824fc278c457ef1739f25e7)

Et la première version avec laquelle j’ai un problème est [ce commit](https://github.com/discourse/discourse/pull/18086/commits)

Donc, un commit entre le 28 juillet et le 25 août semble avoir dérangé quelque chose.

---

<div class="post-metadata">

### Author: ![david](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/david/32/157490_2.png) [@david](https://meta.discourse.org/u/david)
#### Post date: [Septembre 1, 2022, 6:23 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/49 "2022-09-01T18:23:12Z")

</div>

J’ai jeté un coup d’œil rapide pour voir s’il s’agissait d’un problème fondamental qui avait causé la rupture.

Il me semble qu’il y a du javascript invalide dans le composant. Étant donné que cela fonctionnait dans le passé, je suppose que nos récentes mises à jour de la configuration de transpilation Babel de JavaScript du thème l’ont rendu moins tolérant à ce genre d’erreurs.

J’ai ouvert une PR pour corriger ici : [FIX: Do not access variables before initialization by davidtaylorhq · Pull Request #3 · naidihr/discourse-category-headers · GitHub](https://github.com/naidihr/discourse-category-headers/pull/3)

Et une autre qui nettoiera l’avertissement `Discourse.SiteSettings` : [Remove use of deprecated and private functions/properties by davidtaylorhq · Pull Request #4 · naidihr/discourse-category-headers · GitHub](https://github.com/naidihr/discourse-category-headers/pull/4)

---

<div class="post-metadata">

### Author: ![Rhidian](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rhidian/32/176630_2.png) [@Rhidian](https://meta.discourse.org/u/Rhidian)
#### Post date: [Septembre 1, 2022, 6:34 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/50 "2022-09-01T18:34:30Z")

</div>

C’est génial David. Merci beaucoup. Je les ai fusionnés.

Rhod et Tristan, est-ce que cela résout le problème pour vous maintenant ?

---

<div class="post-metadata">

### Author: ![Rhod](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rhod/32/507923_2.png) [@Rhod](https://meta.discourse.org/u/Rhod)
#### Post date: [Septembre 2, 2022, 6:09 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/51 "2022-09-02T06:09:39Z")

</div>

Oui, merci beaucoup à vous et à @david, je vérifie maintenant depuis mon appareil mobile, plus tard je vérifierai sur PC, mais cela semble fonctionner correctement.

---

<div class="post-metadata">

### Author: ![Tris20](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tris20/32/264639_2.png) [@Tris20](https://meta.discourse.org/u/Tris20)
#### Post date: [Septembre 2, 2022, 7:12 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/52 "2022-09-02T07:12:11Z")

</div>

Comme un rêve ! Merci Rhidian !

---

<div class="post-metadata">

### Author: ![Joart](https://avatars.discourse-cdn.com/v4/letter/j/43a26b/32.png) [@Joart](https://meta.discourse.org/u/Joart)
#### Post date: [Décembre 9, 2022, 3:41 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/53 "2022-12-09T15:41:17Z")

</div>

Merci pour ce super composant !

Y a-t-il un moyen d’ajouter également un titre aux différentes pages d’étiquettes ?

---

<div class="post-metadata">

### Author: ![danielabc](https://avatars.discourse-cdn.com/v4/letter/d/b9e5f3/32.png) [@danielabc](https://meta.discourse.org/u/danielabc)
#### Post date: [Avril 14, 2023, 11:00 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/54 "2023-04-14T23:00:22Z")

</div>

Comment faire pour que la bannière n’apparaisse que sur la page d’accueil et que les membres de niveau 4 puissent également la modifier ?

---

<div class="post-metadata">

### Author: ![mattdm](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/mattdm/32/216484_2.png) [@mattdm](https://meta.discourse.org/u/mattdm)
#### Post date: [Juin 23, 2023, 9:31 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/55 "2023-06-23T21:31:45Z")

</div>

Je voudrais utiliser ceci pour une seule catégorie. Je pourrais lister tout le reste dans les « Exceptions de catégorie à masquer », mais cela semble difficile à maintenir. Serait-il possible d’ajouter un paramètre qui soit l’inverse de celui-ci ?

---

<div class="post-metadata">

### Author: ![Pandabear](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pandabear/32/207556_2.png) [@Pandabear](https://meta.discourse.org/u/Pandabear)
#### Post date: [Septembre 11, 2023, 11:07 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/56 "2023-09-11T23:07:04Z")

</div>

J’adore ce thème, mais il y a un bug que je ne sais pas comment corriger, c’est à cause de mon ignorance.  
J’utilise ce composant pour mettre des bannières dans les sous-catégories, mais dans les sous-catégories où je n’utilise pas l’image, il y a un espace qui n’est pas joli. exemple :

 ![Captura de pantalla 2023-09-12 000632](https://global.discourse-cdn.com/meta/original/4X/d/2/1/d210f2cb9f6b0ef6da60083abb9f03ef7330f4cd.png)

 ![Captura de pantalla 2023-09-12 000359](https://global.discourse-cdn.com/meta/original/4X/c/7/c/c7c0511b514c28d608dcd6cc57f53652b2a4491d.png)

---

<div class="post-metadata">

### Author: ![Lilly](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/lilly/32/575047_2.png) [@Lilly](https://meta.discourse.org/u/Lilly)
#### Post date: [Septembre 11, 2023, 11:39 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/57 "2023-09-11T23:39:46Z")

</div>

Salut @Pandabear Je suis allé sur ton forum pour voir si je pouvais aider, mais la bannière ne semble pas activée. Peut-être qu’une fois que tu l’auras activée, essaie ceci :

dans le CSS commun d’un thème ou d’un composant de thème :

```scss
.category-parentcategory-subcategory {
  .category-title-contents {
    display: none;
  }
}

```

`parentcategory` et `subcategory` sont respectivement le nom de la catégorie et de la sous-catégorie (le nom en minuscules que tu vois dans le champ URL du navigateur). par exemple, dans le cas de ta capture d’écran, l’URL est `https://holaforo.com/c/musica/thalia/`, donc le code serait

```scss
.category-musica-thalia {
  .category-title-contents {
    display: none;
  }
}

```

---

<div class="post-metadata">

### Author: ![Pandabear](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pandabear/32/207556_2.png) [@Pandabear](https://meta.discourse.org/u/Pandabear)
#### Post date: [Septembre 11, 2023, 11:56 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/58 "2023-09-11T23:56:21Z")

</div>

Merci beaucoup, vous êtes très gentil. Je l’avais désactivé car je ne trouvais pas de moyen de le corriger.

Je l’ai réactivé pour l’instant, j’ai seulement mis une bannière dans la sous-catégorie suivante  
[https://holaforo.com/c/musica/musica-pop/153](https://holaforo.com/c/musica/musica-pop/153)

dans le reste des sous-catégories je n’ai pas de photo pour le moment, mais certaines sous-catégories je ne vais pas mettre de photo et ça fait moche avec un espace vide.

Concernant le code suivant :

```plaintext
.category-parentcategory-subcategory {
  .category-title-contents {
    display: none;
  }
}

```

Dois-je le faire pour toutes les catégories et sous-catégories pour lesquelles je ne vais pas mettre de photo ?

Je le fais pour toutes les catégories et sous-catégories et cela fonctionne ainsi :

```plaintext
.category-musica-thalia {
  .category-title-contents {
    display: none;
  }
}
.category-musica {
  .category-title-contents {
    display: none;
  }
}
.category-musica-musicapop1 {
  .category-title-contents {
    display: none;
  }
}
.category-musica-musicavariada {
  .category-title-contents {
    display: none;
  }
}

```

…

---

<div class="post-metadata">

### Author: ![Lilly](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/lilly/32/575047_2.png) [@Lilly](https://meta.discourse.org/u/Lilly)
#### Post date: [Septembre 12, 2023, 12:44 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/59 "2023-09-12T00:44:24Z")

</div>

@Pandabear - Je ne comprends pas pourquoi vous n’utilisez pas le paramètre `hide category exceptions` dans ce composant de thème ?

> [@Rhidian](#):
>
> - **hide category exceptions :** Les en-têtes ne s’afficheront pas pour ces catégories

Quoi qu’il en soit, si nécessaire, vous pouvez également faire quelque chose comme ceci afin qu’il soit plus facile de gérer les catégories et les sous-catégories auxquelles vous souhaitez appliquer le code CSS :

```scss
$categories: 'musica', 'musica-thalia', 'musica-musicapop1', 'musica-musicavariada';

@each $category in $categories {
    .category-#{$category} {
      .category-title-contents {
          display: none;
      }
   }
}

```

---

<div class="post-metadata">

### Author: ![Pandabear](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pandabear/32/207556_2.png) [@Pandabear](https://meta.discourse.org/u/Pandabear)
#### Post date: [Septembre 12, 2023, 9:30 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/60 "2023-09-12T21:30:12Z")

</div>

Merci pour toute votre aide.  
Je l’ai fait avec toutes les catégories en CSS sauf « soporte ».

La catégorie « soporte » est configurée sur masquer, mais un espace vide apparaît toujours.  
[https://holaforo.com/c/soporte/72](https://holaforo.com/c/soporte/72)

 ![Captura de pantalla 2023-09-12 222824](https://global.discourse-cdn.com/meta/original/4X/3/e/f/3eff541233e5554c4624fe16538d991533d05482.png)

---

<div class="post-metadata">

### Author: ![digitaldominica](https://avatars.discourse-cdn.com/v4/letter/d/97f17d/32.png) [@digitaldominica](https://meta.discourse.org/u/digitaldominica)
#### Post date: [Janvier 5, 2024, 2:07 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/61 "2024-01-05T14:07:22Z")

</div>

Salut, je reçois ces avertissements concernant ce composant :

[THEME 68 ‘Composant de thème des en-têtes de catégorie’] Avis de dépréciation : controller:navigation/category n’existe plus, et ce shim sera éventuellement supprimé. Pour récupérer des informations sur la route de découverte actuelle, utilisez plutôt le service de découverte. [id de dépréciation : discourse.navigation-category-controller]

---

<div class="post-metadata">

### Author: ![Arkshine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/arkshine/32/298682_2.png) [@Arkshine](https://meta.discourse.org/u/Arkshine)
#### Post date: [Janvier 5, 2024, 7:05 UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/62 "2024-01-05T19:05:04Z")

</div>

J’ai fait une PR 👍

> <https://github.com/naidihr/discourse-category-headers/pull/7>
>
> Meta: https://meta.discourse.org/t/discourse-category-headers-theme-component/14…8682/61?u=arkshine
> 
> This fixes the following deprecation warning:
> \> Deprecation notice: controller:navigation/category no longer exists, and this shim will eventually be removed. To fetch information about the current discovery route, use the discovery service instead. \[deprecation id: discourse. navigation-category-controller
> 
> Note that a \`.discourse-compatibility\` file is added. The \`discovery\` service has been added relatively recently after 3.2.0.beta3-dev. This locks the users below this version to use the latest commit before this PR. (More information: https://meta.discourse.org/t/pinning-plugin-and-theme-versions-for-older-discourse-installs-discourse-compatibility/272665)

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

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