Injecter du HTML uniquement sur une page

Dev
1

J’ai quelque chose comme ça dans l’onglet JS de mon thème :

import { apiInitializer } from "discourse/lib/api";


export default apiInitializer("0.11.1", (api) => { 
    api.renderInOutlet("above-main-container",
        <template>
            <div>
              du code HTML
            </div>
        </template>
     );
});

J’ai copié-collé ça, ça marche (c’est juste un exemple)

Comment faire pour que cela s’affiche uniquement sur la page d’accueil ou uniquement sur la page des catégories ?

désolé si ce n’est pas une bonne question

2

C’est une bonne question, ne vous en faites pas ! Voici ce qui fonctionnera :

import Component from "@glimmer/component";
import { service } from "@ember/service";
import { apiInitializer } from "discourse/lib/api";
import { defaultHomepage } from "discourse/lib/utilities";

class HomepageOnly extends Component {
  @service router;

  get shouldShow() {
    return this.router.currentRouteName === `discovery.${defaultHomepage()}`;
  }

  <template>
    {{#if this.shouldShow}}
      <div>
        du contenu HTML
      </div>
    {{/if}}
  </template>
}

export default apiInitializer((api) => {
  api.renderInOutlet("above-main-container", HomepageOnly);
});

Cela crée un nouveau composant, qui utilise le service router et l’utilitaire defaultHomepage pour vérifier si vous êtes sur la page d’accueil. Le composant est ensuite rendu dans la prise (outlet).

Vous trouverez plus d’informations ici : Add custom content that only appears on your homepage

3

Merci Kris, ça fonctionne parfaitement. Merci aussi pour le lien, j’essaie d’apprendre.