# Comment ajouter un contenu HTML unique en dessous du corps du sujet dans le forum Discourse pour des sujets spécifiques

**URL:** https://meta.discourse.org/t/how-to-add-unique-html-content-below-topic-body-in-discourse-forum-for-specific-topics/311555
**Category:** Development
**Tags:** topic-map
**Created:** [Juin 11, 2024, 11:58 UTC](https://meta.discourse.org/t/how-to-add-unique-html-content-below-topic-body-in-discourse-forum-for-specific-topics/311555 "2024-06-11T11:58:39Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![pinder99](https://avatars.discourse-cdn.com/v4/letter/p/dfb087/32.png) [@pinder99](https://meta.discourse.org/u/pinder99)
#### Post date: [Juin 11, 2024, 11:58 UTC](https://meta.discourse.org/t/how-to-add-unique-html-content-below-topic-body-in-discourse-forum-for-specific-topics/311555/1 "2024-06-11T11:58:39Z")

</div>

Je travaille sur un forum Discourse et je dois ajouter un contenu HTML unique sous le corps du sujet pour des sujets spécifiques. Le contenu HTML ne doit être affiché que sur certains sujets et non sur tous.

Actuellement, j’ai ajouté le contenu HTML en utilisant le code suivant :

```html
<script type="text/x-handlebars" data-template-name="connectors/topic-area-bottom/custom-html">
  <div class="banner-control">
    <!-- Le contenu HTML unique va ici -->
  </div>
</script>

```

Ce code est ajouté à la sortie connectors/topic-area-bottom, mais il affiche le contenu sur tous les sujets. Mon objectif est que ce contenu n’apparaisse que sur des sujets spécifiques, et non sur chaque page de sujet.

Détails :  
La page de sujet n’a pas de classe de corps unique comme les pages de catégorie. J’ai besoin d’un moyen de rendre conditionnellement ce contenu HTML en fonction du sujet consulté. Question : Comment puis-je modifier mon code ou ma configuration dans Ember.js pour m’assurer que le contenu HTML personnalisé sous la sortie topic-area-bottom n’est affiché que pour des sujets spécifiques ? Existe-t-il un moyen d’ajouter une condition pour vérifier des identifiants de sujet spécifiques ou d’autres identifiants ?

Toute aide ou exemple serait grandement apprécié !

---

<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: [Juin 11, 2024, 2:36 UTC](https://meta.discourse.org/t/how-to-add-unique-html-content-below-topic-body-in-discourse-forum-for-specific-topics/311555/2 "2024-06-11T14:36:15Z")

</div>

`this.model` contient les données du sujet telles que l’_id_, le _titre_, etc. Vous pouvez l’utiliser.

Par exemple, pour autoriser les id de sujet 90 ou 38, vous écririez :

```plaintext
<script type="text/x-handlebars" data-template-name="connectors/topic-area-bottom/custom-html">
  {{#if (or (eq this.model.id 90) (eq this.model.id 38))}}
    <div class="banner-control">
      <!-- Le contenu HTML unique va ici -->
    </div>
  {{/if}}
</script>

```

Cependant, je vous encourage à utiliser le [Theme CLI](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950) et à travailler avec des [fichiers séparés](https://meta.discourse.org/t/split-up-theme-javascript-into-multiple-files/119369).

Il sera difficile d’ajouter plus de conditions ou d’avoir une logique ici. Il serait possible d’utiliser `registerConnectorClass`, mais c’est déprécié.

La méthode moderne consiste à utiliser `renderInOutlet` avec un composant Glimmer, par exemple [GitHub - discourse/discourse-custom-header-links](https://github.com/discourse/discourse-custom-header-links).  
Vous dites que vous voulez rendre dans un outlet spécifique :

> <https://github.com/discourse/discourse-custom-header-links/blob/main/javascripts/discourse/initializers/discourse-custom-header-links.js#L4C1-L6C4>

Vous avez le template défini ici. Notez `this.shouldShow`  
[https://github.com/discourse/discourse-custom-header-links/blob/main/javascripts/discourse/components/custom-header-links.hbs#L1](https://github.com/discourse/discourse-custom-header-links/blob/main/javascripts/discourse/components/custom-header-links.hbs#L1)

Ensuite, vous pouvez ajouter votre logique ici pour indiquer au composant s’il doit être affiché ou non :  
[https://github.com/discourse/discourse-custom-header-links/blob/main/javascripts/discourse/components/custom-header-links.js#L5-L7](https://github.com/discourse/discourse-custom-header-links/blob/main/javascripts/discourse/components/custom-header-links.js#L5-L7)

J’espère que cela vous aidera. Faites-moi savoir si vous avez besoin d’aide supplémentaire. 👍

---

<div class="post-metadata">

### Author: ![pinder99](https://avatars.discourse-cdn.com/v4/letter/p/dfb087/32.png) [@pinder99](https://meta.discourse.org/u/pinder99)
#### Post date: [Juin 12, 2024, 11:52 UTC](https://meta.discourse.org/t/how-to-add-unique-html-content-below-topic-body-in-discourse-forum-for-specific-topics/311555/3 "2024-06-12T11:52:13Z")

</div>

Merci pour la solution détaillée, j’apprécie beaucoup.

---

<div class="post-metadata">

### Author: ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)
#### Post date: [Juillet 12, 2024, 11:52 UTC](https://meta.discourse.org/t/how-to-add-unique-html-content-below-topic-body-in-discourse-forum-for-specific-topics/311555/4 "2024-07-12T11:52:28Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.