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

Dev
1

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 :

<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é !

2

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 :

<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 et à travailler avec des fichiers séparés.

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.
Vous dites que vous voulez rendre dans un outlet spécifique :

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

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

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

5 « J'aime »
3

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

2 « J'aime »
4

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