When I include a Facebook video in my rich text collection field then I get comments and a ton of extra white space. I included a screenshot of what I mean. I used to be able to add a “no-comments” to the end of Facebook video links, but it no longer works at removing the space.
Not sure what to say, both load up for me. If you are clicking the webflow designer link, click the “Click Me - Example Post” button to be taken to the cms post
Hi @Kameron2332 - The extra space is a byproduct when using Facebook video with the video field. It is caused by Webflow adding an inline style of padding-top=100% to the div.w-video.w-embed wrapper they create , when the source is a FB video that is created via the video field in a collection you add to the template.
Webflow is using Embedly to automatically create the video embed from the URL. If I test an Embedly embed without Webflow wrapping elements, it is fine. When I test the Facebook SDK and embed that way, no issue either.
A quick fix might be to write some custom code that checks the height of the iframe.embedly-embed with a facebook value in src, then read the height value + 53px (for the social links) and use it to set the padding top value of the parent div.w-video.w-embed.
Thanks for pinging me and sorry to hear about the trouble. After testing on this end I can confirm I’m seeing the same behavior when embedding a facebook video into the rich text.
I’ve reported this to our team and we’ll investigate this further to see if we can find a solution. In the mean time you may consider these other options:
Just an update here. It looks like this error is caused stemming from how embedly works with Facebook embeds. At this point, this is not something we can control.
That said, we have some updates to the rich text element coming up that will make it possible to work around this. I don’t have a timeframe for you all quite yet, but will post with updates as I learn more.