How to automatically adjust iframe height for embedded wordpress posts

제품 지원 WordPress
7

으, 결국 해결했어. 문제는 iframe 태그에 사용자 정의 클래스를 사용했던 거였는데, Discourse에서는 그런 태그를 전부 제거해버려. 며칠 전에 배운 교훈을 또 잊었네 (Formatting posts to look more like Wordpress blog - #6 by jimkleiber). 사용자 정의 HTML 클래스가 여기에서 작동하지 않는 이유가 보안 때문이라고 읽었긴 한데, 왜 그런지 정확히 모르겠어 :confused:

그럼에도 불구하고, .topic-body iframe 셀렉터를 사용하여 iframe 높이를 조정하는 코드를 여기에 올릴게 (다른 사람들에게도 작동하는지 확실하지 않음, 나한테는 잘 작동하는 것 같음):

<script type="text/discourse-plugin" version="0.8.18">
    api.decorateCookedElement(
      element => {
        setTimeout(function() {
          let iframes = element.querySelectorAll('.topic-body iframe');
          if (iframes) {
            iframes.forEach(function(iframe) {
              iframe.onload = function() {
                let iframeDocument = this.contentDocument || this.contentWindow.document;
                let contentHeight = Math.max(
                  iframeDocument.body.scrollHeight,
                  iframeDocument.documentElement.scrollHeight
                ) + 'px';
                this.style.height = contentHeight;
              };
            });
          }
        }, 5000); // 필요에 따라 지연 시간을 조정하세요                  
      },
      { id: "component-id", onlyStream: true}
    );
</script>

수정: 사실 작동하지 않더라고. iframe 태그에 height="4000px"를 추가했더니 그 덕분에 작동했던 것 같아.