Vimeo video url embeds
Hi Lithium developers,
I see here on community.lithium.com and on our un-customized dev community we can click the Insert a Video button, paste a Vimeo video url, e.g.
Then choose Small, Medium or Large size and insert the video into a message. After the message is posted I see the width and height attributes of the Vimeo iframe make sense for each of the three sizes. See a large one here:
https://attdev.stage.lithium.com/t5/Devices/Testing-subscriptions-4-subject/m-p/839#M150
(Can contact me for .htaccess.)
On our customized forums-sandbox community after I click the Insert a Video button and paste a Vimeo video url, the preview shows up but only due to some custom CSS. The iframe has attributes width="5" and height="3". Way too small. When I choose Small, Medium or Large size and insert the video into a message and post it, on the conversation page the Vimeo video iframe still has small width and height 5x3. I applied some CSS there too so that they show up but I can't differentiate between small, medium and large sizes. For now I set them all to 320x265 w/ CSS. See here, it's supposed to be larger:
https://forums-sandbox.att.com/t5/Billing/Vimeo-url-embed/m-p/2923#M180
The custom CSS we have in place applies the same way to Youtube video embeds as it does to Vimeo embeds. Youtube embeds in small, medium and large sizes work fine on our custom community. Feels like there's something up in the video url preview/insert process for Vimeo urls on our customized instances. The Vimeo preview iframe has attributes 5x3 and when you go ahead and insert it into the message the small width/height attributes are saved into the message body field regardless of the size chosen, e.g. here:
https://forums-sandbox.att.com/restapi/vc/messages/id/2911
Any ideas what we are missing on forums-sandbox? I figure there's some unfortunate circumstance of our customizations which prevents the inserted Vimeo iframes from getting proper small, medium or large sizes. Or could it be a configuration or plugin issue? Can't tell if it is a CSS issue in the preview popup. Note our community uses a custom skin with "No parent skin" set.
On a different tack.... Is there some way we can identify the embedded video iframes as small, medium or large? I don't see any unique css classes applied between the three sizes.
I suppose the poster could edit the HTML of the post to add a class to the wrapping div of the embedded video iframe, e.g.
<div class="video-embed-center video-embed custom-video-embed-large"><iframe src="....vimeo...." width="5" height="3" frameborder="0" allowfullscreen="true"></iframe></div>
So we could apply different size CSS to the iframe contained inside the wrapping div. But this seems like an expert/admin-only work-around. Some users may not have access to the HTML tab in the rich editor.
Thank you,
Dave
