Incorporando um fórum Discourse inteiro em outro site em um iframe

Isso já foi discutido em outros dois tópicos, mas eles estão bloqueados:

Algumas pessoas dizem que, em vez disso, deveríamos trabalhar no rebranding do Discourse para combinar com o design de um site existente.

Por experiência, isso é muito difícil de fazer. O markup e o CSS para esse markup são muito complicados de trabalhar e não são flexíveis. Como exemplo, as árvores DOM entre o cabeçalho do Discourse e o conteúdo principal são muito diferentes entre si. Inserir conteúdo do cabeçalho (no editor integrado do Discourse) coloca o conteúdo inserido muito longe do cabeçalho real do Discourse, por exemplo.

Acredite em mim, é bastante difícil simplesmente “fazer seu Discourse seguir o tema do seu site principal”.

O que gostaria de tentar a seguir é incorporar o Discourse em um <iframe>. Vamos ver como isso funciona.


Solicitação de recurso! Seria legal se o Discourse pudesse ser consumido como um conjunto de elementos personalizados. Por exemplo:

<!-- ... algum markup personalizado ... -->

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

<!-- ... algum markup personalizado ... -->

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

Isso permitiria que partes do Discourse fossem incorporadas em qualquer lugar de um site, e os elementos se conectariam ao backend especificado.

Acessar http://url.to/actual/discourse/instance diretamente abriria o Discourse da maneira normal, como um aplicativo web independente.

Basicamente, isso tornaria as partes do Discourse utilizáveis dentro de estruturas HTML gerais (como partials de templates Handlebars, mas de uma maneira futura e construída sobre padrões web).

Apenas imagine o que mais seria possível com tal recurso (pense em quando elementos personalizados têm valores diferentes para os atributos backend)…

Certamente não podemos impedir você de tentar usar o Discourse em um iframe, mas como alertado em outros tópicos… é esperado que seja frágil e problemático… e não pretendemos gastar tempo resolvendo problemas relacionados a iframes.

Pode ser mais produtivo descrever em detalhes os problemas que você enfrenta ao criar temas para o Discourse, para que possamos ajudar e/ou melhorar o processo. Melhoramos bastante a criação de temas nos últimos anos, e é algo que definitivamente queremos apoiar e aprimorar sempre que possível.

Existem elementos que são definitivamente mais difíceis de personalizar do que outros, sendo o cabeçalho um deles. Isso ocorre porque foi implementado um Virtual DOM para melhorar o desempenho (A tour of how the Widget (Virtual DOM) code in Discourse works).

Portanto, se você deseja inserir conteúdo no cabeçalho, precisará utilizar esse sistema, em vez de adicionar conteúdo antes/depois dele pela interface de administração (abordado um pouco na seção de API avançada de plugins de Developing Discourse Themes & Theme Components). Também existem alguns bons exemplos de manipulação do conteúdo do cabeçalho em componentes de tema existentes, como em Custom Header Links.

Isso seria ótimo de ter e vejo que ainda não funciona quando tento; só recebo