Embedding a whole Discourse forum on another site in an <iframe>

This has been talked about on two other threads already, but they are locked:

Some people say that we should instead work on re-branding Discourse to match design of an existing site.

From experience, this is very difficult to do. Markup and the CSS for that markup are very complicated to work with and not flexible. As an example, the DOM trees between the Discourse header and the main content are very disparate from each other. Injecting header content (In Dicourse’s built-in editor) places injected content very far off from the actual Discourse header, for example.

Believe me, it is quite difficult to simply “make your DIscourse follow you main site theme”.

What I’d like to try next is embedding Discourse in a <iframe>. Let’s see how that goes.


Feature request! It’d be neat if Discourse could be consumed as a set of custom elements. For example:

<!-- ... some custom markup ... -->

<discourse-actions backend="http://url.to/actual/discourse/instance">

<!-- ... some custom markup ... -->

<discourse-main backend="http://url.to/actual/discourse/instance>

which could allow the pieces of Discourse to be embedded anywhere in a site, and the elements would connect to the specified backend.

Visiting http://url.to/actual/discourse/instance directly would open Discourse the normal way as a web application by itself.

Basically this would make Discourse parts usable within overall HTML structures (like Handlebars template partials, but in a future-proof way built on web standards).

Just imagine what else would be possible with such a feature (think about when custom elements have different values for backend attributes)…

iframe에서 Discourse를 시도해 보시는 것을 막을 수는 없지만, 다른 주제에서 경고했듯이… 불안정하고 문제가 생길 가능성이 높습니다… 또한 iframe 관련 문제를 해결하는 데 시간을 들일 계획도 없습니다.

Discourse 테마 설정 시 겪는 문제를 자세히 설명해 주시는 것이 시간을 더 잘 활용하는 방법일 수 있습니다. 그러면 도움을 드리고/또는 프로세스를 개선하는 데 기여할 수 있습니다. 지난 몇 년간 테마 설정 기능을 많이 개선해 왔으며, 가능한 한 지원하고 개선하는 것을 확실히 원하고 있습니다.

커스터마이징이 다른 요소보다 확실히 더 어려운 요소들이 있으며, 헤더가 그 중 하나입니다. 이는 성능을 개선하기 위해 Virtual DOM이 구현되었기 때문입니다 (A tour of how the Widget (Virtual DOM) code in Discourse works).

따라서 헤더에 콘텐츠를 삽입하려면 관리자 UI에서 콘텐츠 전/후에 추가하는 대신 해당 시스템을 활용해야 합니다 (https://meta.discourse.org/t/developer-s-guide-to-discourse-themes/93648/1의 고급 pluginAPI 섹션에 일부 설명되어 있음). 또한 기존 #customization:theme-component에서 헤더 콘텐츠를 조작하는 좋은 예시들이 있으며, Custom Header Links 등이 있습니다.

this would be nice to have and I see it still does not work when I try I just get