Incorporando uma lista de tópicos do Discourse em outro site

Acho que isso não é possível. O código do Discourse usado para recuperar os tópicos está buscando apenas as listas de tópicos mais recentes. Os filtros disponíveis que conheço para ordenar as listas são replies, views, activity, likes. Você pode tentar ordenar as listas com um desses filtros para selecionar os melhores tópicos. Por exemplo:

<d-topics-list discourse-url="http://localhost:3000" category="14" per-page="5" order="replies"></d-topics-list>

A fonte usada no iframe é definida no Discourse. Na versão mais recente do Discourse, estou enfrentando um problema ao definir a fonte quando incorporo uma lista de tópicos no meu site WordPress. Estou testando isso localmente, não em um site de produção, então isso pode estar relacionado ao problema. O que estou observando é que este estilo está sendo passado para a fonte do iframe:

font-family: var(--font-family);

Esse estilo está sendo definido no Discourse, mas o WordPress não tem acesso à variável, então a fonte está sendo definida como Times New Roman no meu site. Vou investigar mais esse problema. (Edição: o problema ao definir a fonte é devido a alterações recentes no Discourse. Vamos corrigir isso.)

Isso pode ser complicado. O iframe criado está dentro do elemento d-topics-list que você adiciona à página. Definir o valor para uma largura explícita no CSS do meu site está funcionando para mim. Acredito que isso possa ser melhorado:

d-topics-list iframe{
	width: 700px !important;
	margin-left: auto;
	margin-right: auto;
}
6 curtidas

No canto superior esquerdo do iframe há um número (por exemplo, 110,5 ms) que leva a um link para /embed/topics. Há alguma maneira de removê-lo?

Edição: A resposta é que ele só é exibido para o “desenvolvedor do Discourse”: What is this box at the upper left displaying timings in milliseconds when I am logged in as admin? :slight_smile:

7 curtidas

Olá! Estou tentando incorporar posts em um site WordPress e consegui fazer a parte da incorporação funcionar. Existe alguma maneira de deixar a visualização mobile um pouco mais atraente? Quando os posts têm imagens, o layout das colunas com imagens fica espremido. Um simples

@media (max-width: 768px) {
	.topics-list .topic-list-item .topic-column-wrapper {
	    flex-direction: column;
	}
}

resolveria esse problema. Há alguma chance de algo assim possa ser implementado?

Abraços, M

3 curtidas

Você deve poder adicionar seu próprio CSS personalizado aqui ao editar seu tema. Há algum motivo para você querer isso no núcleo?

2 curtidas

Ah, não percebi que isso carregaria o CSS do tema do Discourse. Vou tentar e te retorno!

2 curtidas

Há uma seção sob temas para incorporação para esse fim!

4 curtidas

Olá, já incorporei uma lista de tópicos no meu site, mas agora estou tentando destacar apenas um tópico com base em uma tag. Consegui incorporar outra lista (com per-page=1), mas o problema é que não consigo adicionar classes CSS ou IDs, então não há absolutamente nenhuma diferença entre a primeira lista e esta.

Isso significa que até mesmo algo simples, como usar uma cor de fundo diferente para uma das listas incorporadas, é impossível.

Existe alguma solução alternativa?

Agradeço muito sua ajuda.

2 curtidas

Obrigado, @eviltrout! Adicionar esse código ao “CSS Incorporado” resolveu o problema!

2 curtidas

Atualmente, não há como adicionar regras CSS diferentes a diferentes incorporações. Você só pode adicionar estilos personalizados que se aplicam a todas as incorporações.

4 curtidas

Estou recebendo o seguinte erro ao incorporar os tópicos mais recentes aqui em https://vceliquidrecipes.com/

includes.js?v=f8924c1fd3fbe1787f0bed5c8998b636:168 POST https://vapingcommunity.co.uk/mini-profiler-resources/results 404

(anônimo) @ includes.js?v=f8924c1fd3fbe1787f0bed5c8998b636:168
fetchResults @ includes.js?v=f8924c1fd3fbe1787f0bed5c8998b636:169
initPopupView @ includes.js?v=f8924c1fd3fbe1787f0bed5c8998b636:763
doInit @ includes.js?v=f8924c1fd3fbe1787f0bed5c8998b636:1050
sc.onload.sc.onreadystatechange @ includes.js?v=f8924c1fd3fbe1787f0bed5c8998b636:1065
load (async)
load @ includes.js?v=f8924c1fd3fbe1787f0bed5c8998b636:1061
init @ includes.js?v=f8924c1fd3fbe1787f0bed5c8998b636:1109
deferInit @ includes.js?v=f8924c1fd3fbe1787f0bed5c8998b636:1089
setTimeout (async)
deferInit @ includes.js?v=f8924c1fd3fbe1787f0bed5c8998b636:1085
init @ includes.js?v=f8924c1fd3fbe1787f0bed5c8998b636:1118
(anônimo) @ includes.js?v=f8924c1fd3fbe1787f0bed5c8998b636:1463

Meu código de incorporação está assim:

<d-topics-list discourse-url="https://vapingcommunity.co.uk" status="open" order="replies" per-page="10"></d-topics-list>
2 curtidas

Esses erros parecem vir do mini profiler e provavelmente não estão relacionados ao que um usuário comum vê. Visitei seu site e vi uma lista de tópicos sem erros.

4 curtidas

Ah, então é normal que apareçam nos logs, certo?

2 curtidas

Não tenho certeza se é normal, mas não há motivo para preocupação. A maioria dos usuários não tem acesso ao mini profiler, então provavelmente isso só aparece quando você o faz.

3 curtidas

Ok, obrigado pela sua ajuda, é muito apreciada como sempre, continue com o ótimo trabalho

2 curtidas

Saudações, obrigado pelo seu trabalho árduo nisso.

No Firefox e no Chrome, a lista não funciona como esperado para nós. Embora tenhamos configurado para mostrar 10 tópicos, ela exibe apenas 4.

No Chrome, observamos este erro de JS ao incorporar a lista:

Uncaught DOMException: Failed to execute 'postMessage' on 'Window': Invalid target origin '' in a call to 'postMessage'.
    at u (https://rembetiko.gr/assets/embed-application-9cef8308c816fc1d83137e63d6c556c6cc2b68fe2b6e5ce16cca6766ba2c0ae4.js:1:105)
    at window.onload (https://rembetiko.gr/assets/embed-application-9cef8308c816fc1d83137e63d6c556c6cc2b68fe2b6e5ce16cca6766ba2c0ae4.js:1:515)

Curiosamente, isso não acontece no Safari.

A lista está incorporada neste site: https://rebetiko.sealabs.net (no final da página, se quiser testar por conta própria).

4 curtidas

Alguém aqui consegue reproduzir esse problema? :slight_smile:

CC: @JimPas, @simon, @Vaping_Community

3 curtidas

Você tem 10 links de tópicos na página, 6 estão ocultos por algum motivo, não faço ideia do que causou esse erro

Adicionar uma altura ao iframe funciona para mostrar os links de tópicos ocultos

d-topics-list iframe {
    height: 380px;
    width: 700px !important;
    margin-left: auto;
    margin-right: auto;
}
4 curtidas

Eu também tive um problema com isso. Às vezes, parecia estar tudo certo. Outras vezes, a lista de tópicos era cortada antes do fim (como se fosse definida pelo número de pixels em vez do número de tópicos) e a fonte não estava como o esperado (não me lembro dos detalhes). Mudei para usar o feed RSS do Discourse. Eu só uso o Chrome e não suspeitava que o problema pudesse ser apenas com o Chrome.

3 curtidas

Olá!

Existe alguma maneira de excluir tópicos da lista?

2 curtidas

Você poderia usar tags para isso, talvez? Marque os tópicos que deseja que apareçam na lista e filtre por eles?

5 curtidas