Extraits de texte/Markdown insérables, maintenus centralement

Une option possible consiste à utiliser un composant de thème.

Cela s’insère dans header.html

<script type="text/discourse-plugin" version="0.8">
var disclaimer = settings.Disclaimer_text,
  disclaimer_selector = 'div[data-theme="disclaimer"]';

$.fn.disclaimer = function() {
  if (!this.length) {
    return;
  } else {
    this.each(function() {
      $(this).html(disclaimer);
    });
    return this;
  }
};

api.decorateCooked($elem => $elem.children(disclaimer_selector).disclaimer());

// créer un bouton dans l'éditeur
let currentLocale = I18n.currentLocale();

I18n.translations[currentLocale].js.disclaimer_button = "Ajouter un avertissement";
I18n.translations[currentLocale].js.composer.disclaimer_prompt = ""; // laisser vide

api.onToolbarCreate(function(toolbar) {
  toolbar.addButton({
    trimLeading: true,
    id: "disclaimer-button",
    group: "insertions",
    icon: "exclamation-circle", // changer l'icône
    title: "disclaimer_button",
    perform: function(e) {
      return e.applySurround(
        '<div data-theme="disclaimer">',
        "</div>",
        "disclaimer_prompt"
      );
    }
  });
});
</script>

et cela doit être ajouté dans le fichier settings.yml de votre composant

Disclaimer_text:
  default: "Lorem ipsum dolor sit amet, ei purto complectitur has, per at quas senserit. Et malis libris eos, vix id pericula dissentiet, aliquid apeirian pro eu. Sed ex viderer inciderint, vitae officiis dissentiet eos no. Omnes percipit singulis in has, ne nam nibh tation inciderint. Quas nulla ei sit, ex eam rebum voluptaria. Id eam altera similique. Ex justo assentior persequeris mea, ei hinc paulo ubique mei. <br><br>Cu nam epicurei torquatos, et accusam accommodare vim. Vis sint saperet officiis et. Ad consequat posidonium mea, et duo paulo quidam maluisset, vel an electram expetendis. An vis repudiare tincidunt, mentitum convenire eloquentiam ut vis, summo partiendo pro ad."
  description:
    en: Entrez le texte d'avertissement souhaité. Utilisez &lt;br&gt; pour les sauts de ligne.

Vous aurez alors un bouton dans l’éditeur qui ressemble à ceci :

et cliquer sur ce bouton ajoutera

<div data-theme="disclaimer"></div>

ce qui sera converti en ce que vous avez défini dans les paramètres du composant

et le résultat final ressemble à ceci

Vous pouvez ensuite utiliser

[data-theme="disclaimer"] {

}

en CSS pour le styliser comme vous le souhaitez.

21 « J'aime »