Comment passer du mode sombre au mode blanc lumineux dans Discourse intégré

Soutien
1

Mon site web fournit le bouton du mode sombre, donc lorsque le bouton est cliqué, je dois changer le thème de couleur des intégrations Discourse pour qu’il corresponde à mon site web.

Mais lorsque j’essaie d’ajouter une classe au corps de l’iframe intégré, je constate que iframe.contentDocument est toujours nul, et si j’utilise document.getElementById(\"discourse-embed-frame\").contentWindow.document, l’erreur est la suivante :

image
image1826×146 25.5 KB

Je pense qu’il devrait y avoir un moyen de configurer le cadre intégré pour autoriser les origines croisées, mais je n’ai toujours pas trouvé comment configurer après avoir essayé quelques configurations.

L’autre solution consiste peut-être à utiliser postMessage, comme document.getElementById(\"discourse-embed-frame\").contentWindow.postMessage(\"darkMode\"), mais il faut un gestionnaire pour traiter le message darkMode dans le script, je n’ai pas trouvé où l’ajouter.

2

J’ai un défi similaire. Avez-vous trouvé une solution de contournement ?

En raison du problème inter-origines, je ne peux ajouter aucun type de marqueur sur l’iframe que mon CSS intégré peut utiliser pour déterminer les couleurs à utiliser :

image
image1146×604 29.7 KB

4

Pas encore résolu. Je n’ai pas non plus reçu de réponse officielle, donc je ne sais pas si tous les amis officiels sont en vacances.

1 « J'aime »
6

(Petit rappel amical pour savoir si nous avons des directives officielles :slight_smile: )

1 « J'aime »
7

Il existe une méthode officielle, mais uniquement pour les thèmes officiels : Styling of Embedded Discourse

Cela pourrait aider :

8

J’ai implémenté la dernière fonctionnalité officielle.
Si vous avez encore des besoins, vous pouvez vous référer à