OK, I finally figured this out. For anyone else struggling with this issue –
Webflow seems to render a Vimeo video link only when you manually enter it into the CMS.
So if you add the URL to the video link programmatically, with Zapier for example, it won’t render that URL as a video.
Here’s how you can tell:
Paste a URL from a Vimeo video into a CMS video field. It automatically displays a small embed of the video right there, in a second or less. Very nice. If you then leave and come back to that entry in the CMS, you’ll still see that embedded video displayed below the link you entered in the video field. All good.
Now, contrast that with adding that same video link via Zapier. When you examine the entry in the CMS, you’ll see the URL in the video field link but the embedded video will NOT appear under it. Which suggests that Webflow hasn’t rendered the link, and won’t ever do so. (Unless you delete the URL value and re-paste it – manually. Then it works.)
Seems like a bug.
My fix was to grab the Vimeo video ID and use Vimeo’s responsive embed code to display it in an HTML embed element.
@WebflowCommunityTeam How is this a valid solution? I have spent over a month building with webflow only to find out that your URL scrapper doesn’t properly scrape Vimeo links. Really disappointing.
Can we please get some support on this request. All URL types (not just youtube) should be supported.
For anyone who comes across this, I have an addition to @WillSmith - you can actually upload the metadata for a video programmatically.
What I think is happening is that Webflows embedding service is embed.ly. When you trigger the API to update the URL, Webflow’s backend doesn’t fire their scrapper service to fetch necessary metdata for the URL. So you’re putting the link in the url field, but only pasting in the URL to the UI fires their URL scrapper. Indeed a bug (and Webflow should fix this… any API call to image or video urls should trigger a fresh scrape automatically and enrich with metadata). The image object in webflow actually works this way.
Anyway, if you know javascript and use the CMS api, you can easily add a step to configure metadata the way Webflow wants it (see below).
“object” is just the item object if you’re using the create or update methods in the JS library. You really need the “html” “title” and “description” objects, which correspond to the UI’s needed objects to render your video using the webflow out of box object.
Hope this helps for developers. Probably not good for anyone else!
function formatWebflowVideoMetadata(object){
// object should be the fields from existing data.
try{
var url = object[“video-link”][“url”]
var vimeoVideoIds = url.split(‘https://vimeo.com/‘)[1].split(’/’)
var videoMetadata = {
“url”: url,
“metadata”: {
“width”: 1920,
“height”: 1080,
“html”: <iframe class=\"embedly-embed\" src=\"//cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fplayer.vimeo.com%2Fvideo%2F${vimeoVideoIds[0]}%3Fapp_id%3D122963&dntp=1&display_name=Vimeo&url=https%3A%2F%2Fvimeo.com%2F${vimeoVideoIds[0]}%2F${vimeoVideoIds[1]}&key=c4e54deccf4d4ec997a64902e9a30300&type=text%2Fhtml&schema=vimeo\" width=\"1920\" height=\"1080\" scrolling=\"no\" title=\"Vimeo embed\" frameborder=\"0\" allow=\"autoplay; fullscreen\" allowfullscreen=\"true\"></iframe>,
“aspectRatio”: 0,
“title”: object[“lessonid”],
“provider_name”: “Vimeo”,
“type”: “video”,
“description”: object[“video-description”]
}
}
return videoMetadata
} catch {
return
}
console.log(videoMetadata)
}
I’m running into the same issue. Six months later and still it’s not fixed. This is crazy. I’ve got over 100 videos that I’ve brought in via Integromat, and none of them are rendering. Additionally, I can’t rely on an automation to bring them over from Vimeo to Webflow because they’ll NEVER work until I go in and fix it manually. Come on Webflow!??!?!? Eight months or more and this isn’t fixed??? @ForumModerators@WebflowCommunityTeam No responses to this thread after months?
The only “solution” listed on this thread is to just not use Webflow’s Video element and instead create embed codes using HTML. That’s a patch, but it’s not a solution. Please Please Please help!
I’m stumbling across this thread with a similar issue on my end. I’ve been planning on a creating a workflow with Zapier to paste Vimeo links into a CMS collection, but it looks like that’s currently a fool’s errand.
Where I’m stuck is that if you post a link to a Vimeo video that hasn’t finished transcoding on their website post-upload, Webflow doesn’t appear to re-scrape the video even if you delete and re-enter the URL after transcode. It basically renders the Vimeo link useless.
Any ideas anyone? Seems like Webflow needs to address this.
@cyberdave I’m tagging you on this because you seem to be able to help so many others. The topic on this thread is marked “solved”, but as you can see when the read it, the solution is just a workaround. I can attest that this issue is not actually solved. Any use of automation services to upload to the Webflow CMS (using API or a service like Integromat or Zapier) results in a problem when pasting in Vimeo links. They don’t show up until we manually got into the CMS, cut out the vimeo link and then paste it back in. I’ve contacted Webflow support about this issue for over a year and every response is the same: this is a known issue. There is not a solution at this time.
What about the solution that @austinhay suggests in this string of posts?
I am desperate for someone at Webflow to really take notice of this issue and solve it, since without a real fix, it completely breaks the whole ease of managing the CMS with external services or connecting the CMS to a spreadsheet or database, etc,…when the video links don’t populate.
Here is a video that I created in early January of this year demonstrating the problem:
Thank you for any help you can provide, or bumping this to someone in Webflow to take a look at.
Hi @ajgash, thanks for your post and bump, the issue with the collection or api import of the video link not getting saved until it is manually entered is still open.
The update itself is also having some pre-requisite technical updates that need to be made first/along with the api/csv update so that is part of the reason for the delay on this one.
The moment I have some good news I will let you know as Webflow does continue to receive the feedback that this needs to be fixed and our team is working toward that goal.
As to the workaround, I have not tested it, but I have also made sure our team has that info to help with the update work. You might try that to see if it works for you, it may be a workaround until the fix/update is available.
I know that is not ideal and probably not the answer you want to hear immediately, but I am helping to keep track of this now as well and will help to encourage this update be made.
Thanks @cyberdave and everyone else for continuing to bring this issue to the surface as it really does need addressing so it’s great to hear that it’s on the map to be solved by the end of the year.
Hey @cyberdave or anyone else on the team interested and listening… Just wondering about an update on this one since it’s been another 2+ months? Maybe it’s slipped through the net but I’m sure there are lots of us out here still patiently waiting for news and a fix. Thanks
100%. I’m working on a way of using @austinhay’s video/embedly metadata approach using NoCode - got it half working. I’ll share it here when I’m happy with it…
This is really a disgraceful response by Webflow. I have been building a site for several months and this is a critical error that undermines what I am doing. I use Webflow to get a site that would otherwise only be achievable by a programmer. I am not a programmer. Perhaps time for Editor X?
At the moment the item is still open on the vimeo videos imported via API or via Zapier.
I cannot yet give a timeline for this update, the workaround is still for the moment to manually update the imported url from Zapier.
The issue was also affecting to CSV imports, but there was an update in early January to fix this for the CSV imports, so an alternative method to upload the video links would be to do that via CSV import.
For the zapier integration and via the API, vimeo links will need to be updated in the designer after import until that update goes out.
Typically Webflow is not going to announce the updates here in the forum, however if you would like to be notified of when the update goes out, please reach out to our support team Webflow Customer Support | Webflow University, and let us know that this issue is something you are awaiting to be fixed, that will let us know that you are impacted and we can add you to the notification list for when this issue is resolved and to make sure you receive the latest updates as those are made.
@cyberdave It looks like this issue (at least for me), has been fixed. I use Integromat (now Make) to bring videos from Vimeo into Webflow, and finally it works without the need to go back into Webflow and re-enter the vimeo URL. Please thank the team that made this possible. It’s a great benefit to those of us who want to use Webflow as a video-based CMS.
