임베드된 Discourse에서 다크 모드와 밝은 흰색 모드로 전환하는 방법

[mikeguo (Mike)]

공식 최신 기능을 사용하여 구현했습니다.
아직 요구사항이 있으시면 다음 링크를 참고하세요.

임베드된 댓글에도 자동 다크 모드가 적용되나요?

postMessage를 사용하여 구현했습니다. 코드와 실행 로직은 다음과 같습니다: [image] 코드 블록 ①은 임베디드 Discourse iframe에 이벤트 리스너를 추가하여, 임베디드 Discourse가 로드되면 임베디드 Discourse iframe이 포함된 내 웹사이트로 메시지를 전송하도록 합니다. 내 웹사이트가 임베디드 Discourse에서 메시지를 수신하면 코드 블록 ②에 표시된 바와 같이 유효성 검사를 수행하고, 통과하면 setIframeStyle 함수를 호출하여 임베디드 Discourse를 설정합니다. 코드 블록 ③에 표시된 setIframeStyle 함수는 postMessage를 호출하여 iframe에 색상 모드(“dark” 또는 “light”)를 전달합니다. 또한 다크 모드가 전환되면 이 함수가 호출되어 임베디드 Discourse가 내 웹사이트와 동일한 색상 모드를 유지할 수 있도록 합니다. 코드 블록 ④는 임베디드 Discourse가 내 웹사이트에서…