products breaks embedded videos

[rafaeltcc]

Hi,

I have some videos embedded in my page. I add them copying the embedded code as provided by facebook. I just adjust some styles properties to make them responsive.

example page: https://inverta.org/jornal/cobertura-da-greve

When I activate collective.lazysizes images work well, but my frame appears empty. Somehow the product is making those contents not to load at all.

Thanks,

Rafael

[hvelarde]

you have to provide more details; AFAIK Facebook videos are working on CartaCapital with lazysizes installed.

anyway, you can mark that video with a class and then configure the package to ignore that class all over the place.

[rafaeltcc]

Hi, Steps to reproduce. 1 - Install collective.lazysizes in plain Plone 5.0.7 2 - Add an embedded facebook video, with same css for responsiveness (this does not matter, though), for example: <div style="position: relative; overflow: hidden; height: 0; padding-top: 30px; padding-bottom: 56.25%;"><iframe style="border: none; position: absolute; top: 0; left: 0; width: 100%; max-width: 800px; height: 100%;" src=" https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Fwww.facebook.com%2Fjerre.silva.94%2Fvideos%2F787733371389238%2F&amp;show_text=0&amp;width=400" width="400" height="225" frameborder="0" scrolling="no" allowfullscreen="allowfullscreen"></iframe> 3 - Instead of it being correctly rendered I get as output when viewing the source of the page viewed in my browser <div id="parent-fieldname-text" class=""><p> </p> <div style="position: relative; overflow: hidden; height: 0; padding-top: 30px; padding-bottom: 56.25%;"><iframe style="border: none; position: absolute; top: 0; left: 0; width: 100%; max-width: 800px; height: 100%;" width="400" height="225" frameborder="0" scrolling="no" allowfullscreen="allowfullscreen" data-src=" https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Fwww.facebook.com%2Fjerre.silva.94%2Fvideos%2F787733371389238%2F&amp;show_text=0&amp;width=400" class="lazyload"></iframe></div> <p><br /><br /></p></div> I don't know a lot about lazysizes, but, if my data-src is not replaced it seems hat something in the javascript has not worked, correct? I now found that this problem is browser dependent. In firefox desktop, the videos are not rendered, but the images are. And in Chrome desktop, all the content seems to be correctly rendered. How can I help to debug it further? I first thought this was a conflict with mosaic, but in plain pages I get this error. Hector, as you are also a devolper of sc.embedder, is it tested together with colelctive.lazysizes? I might give it a try

[hvelarde]

I'm busy right now; maybe I could help you by the end of the week.

[hvelarde]

do you mind to upgrade this plugin in your site and test again?