Clicar na área escura ao redor do iframe ou no x no canto superior direito fecha a lightbox. Funciona da mesma forma que as lightboxes de imagem padrão.
Configurações
Há apenas uma configuração. Você adiciona os domínios nos quais deseja ter essa funcionalidade.
Quaisquer domínios que você especificar aqui também precisam estar na lista de permissões na configuração do site allowed_iframes para aparecerem nas postagens.
Exemplos de uso:
Aqui estão alguns exemplos além do iframe do CodePen acima
Correct, this component will not mess with any whitelisting settings at all.
In order for any iframe to show up in the cooked content of a post - expandable or not - it has to be on the list of allowed_iframes setting like you pointed out.
@Johani is this component still functional? If so, any thoughts on why I am not getting the pop-out diagonal-arrows in the upper-right, but rather a blank/dead box?
Here is what I’ve tried:
Updated themes/components.
Made sure src links were white-listed in the component and the Discourse settings.
Tried a few different links, including Google Maps.
Tried several scenarios with the Media Overlay on/off + Lightbox alone on/off.
thank you very much for conceiving and maintaining this theme component.
After installing it on https://community.hiveeyes.org/ the other day, some users recently started to complain that the overall appearance of the head of the page looked different for them. They finally found out the reason was that they blocked cloudflare altogether, so all requests to https://cdnjs.cloudflare.com/ajax/libs/featherlight/1.7.13/featherlight.min.js would fail.
So, we are humbly asking if there would be a way for you to provide this component in a self-contained variant?
Não precisa se desculpar, é bom ver que você conseguiu dar um pouco de atenção a ele, entre todas as outras coisas que estão acontecendo. Nós realmente apreciamos.
Não estou ciente de nenhum componente existente que faça isso, então você teria que criar um ou encomendar esse trabalho na categoria Marketplace.
Este componente de tema verifica iFrame em uma postagem e compara seu atributo src com uma lista de fontes elegíveis fornecida pelo administrador nas configurações do componente. Se o domínio da fonte corresponder, ele adiciona o botão lightbox. A exibição do lightbox é tratada pelo featherlight.js. Featherlight escuta cliques em elementos com o atributo data-featherlight. Se um desses for clicado, ele abre o lightbox com o conteúdo desse iFrame.
Você pode fazer o mesmo com tags <a> em um componente diferente com um pouco de esforço. Se o href do link corresponder a um domínio listado nas configurações do componente, exiba-o em um lightbox de iframe. Caso contrário, deixe-o como um link normal. Você não quer que todos os links abram em um iframe com lightbox.
A maior parte do trabalho necessário já é tratada por este componente, então você pode simplesmente fazer um fork dele e começar a partir daí. Não há planos para adicionar esse recurso a este componente porque ele se destina apenas a lidar com tags iFrame em postagens.
Não consigo fazer isso funcionar, segui o guia precisamente e adicionei o domínio tanto ao componente do tema quanto à configuração do site. Eis o que recebo:
Ambos os TCs usam a mesma API para decorar uma postagem, então a ordem em que você os instala seria necessária. Além disso, a origem do iframe é definida dinamicamente assim que o PDF é baixado e pode não estar imediatamente disponível neste TC de IFrame Lightboxes.
As alterações que fiz são basicamente:
Procure por elementos iframe no próximo loop de execução, então o iframe tem garantia de estar disponível
Espere o iframe carregar para que você possa recuperar o URL de origem
Quaisquer domínios que você especificar aqui também precisam estar na lista de permissões na configuração do site
