Webflow sync, pageviews & more.
NEW

Does Webflow support YouTube Shorts for the Video Link in the CMS, as it is not working for me?

TL;DR
  • Convert YouTube Shorts URLs from youtube.com/shorts/VIDEO_ID to youtube.com/watch?v=VIDEO_ID before adding them to the CMS Video field.
  • Alternatively, use a CMS text field and a custom embed element with the format https://www.youtube.com/embed/VIDEO_ID for greater flexibility and support.

Webflow currently does not fully support embedding YouTube Shorts links (e.g., youtube.com/shorts/...) in the CMS Video field. The CMS is designed to work with standard YouTube video URLs.

1. Understand the Issue

  • Webflow’s Video field in a CMS collection accepts YouTube and Vimeo links, but it expects standard video URLs, like https://www.youtube.com/watch?v=VIDEO_ID.
  • YouTube Shorts use a different format: https://youtube.com/shorts/VIDEO_ID, which does not automatically embed correctly in Webflow’s video element.
  • To make it work, convert the Shorts URL to the standard YouTube format:
  • From: https://youtube.com/shorts/VIDEO_ID
  • To: https://www.youtube.com/watch?v=VIDEO_ID
  • Enter this converted URL into the CMS Video field.

3. Automate with CMS Text Field and Embed Element (Optional)

If you want to allow both formats, you can:

  • Use a plain Text field (instead of the Video field) in your CMS to store the URL.
  • On the page, add a Custom Embed element and use the following format inside it:
  • <iframe src="https://www.youtube.com/embed/VIDEO_ID?rel=0" loading="lazy"></iframe>
  • Replace VIDEO_ID with a dynamic reference using Webflow’s “Add Field” for your text field.
  • This provides more control and supports Shorts if you standardize the embed link to https://www.youtube.com/embed/VIDEO_ID.

4. Validate the Video ID

  • Ensure that the YouTube video exists and that embedding is not disabled by the content owner.
  • You can test the embed URL separately in a browser to confirm it loads.

Summary

Webflow’s CMS Video field does not support YouTube Shorts links directly. Convert Shorts URLs to the standard YouTube format (watch?v=VIDEO_ID) or use a CMS text field with a custom embed for full control.

Webflow Resources
Webflow templates
Webflow inspiration
Rate this answer

Other Webflow Questions

Explore Logic tutorials
Is it possible to create a separate mobile version of my website in Webflow, with a different site structure, code, and images specifically for mobile devices?
Why does my desktop / tablet nav menu disappear in Webflow's preview mode, even though it appears when I delete the "nav-trigger" (the mobile burger menu)? How can I keep both the nav-trigger and the nav menu in preview mode?
How can we redirect users based on their input in the signup form using Webflow?
How can I make one column sticky and one column scrollable in the About Us section of my Webflow Grid?
How can I redirect my old domain to my new domain in Webflow after rebranding?
What other e-commerce solutions can be used with Webflow for creating and managing products on a website?
Does Webflow have endpoints to add products to the cart via E-commerce API?
How can I export and host a website built on Webflow and make a form work to send details to my client's email instead of using Webflow?
How can I create a full-width background video using a Vimeo embed without the controls and with autoplay, but without it being 100vw and 100vh in Webflow?
How can I display a div that will only be visible to Internet Explorer users, including IE 11, on my Webflow site? The purpose of this div is to display a message saying "For the best experience, please open using Chrome, Firefox, or Safari. Thanks!"
Can Webflow be used to crop images with CSS, instead of editing them individually in Photoshop for a large number of images in the CMS?
How can I make a popup appear at a specific point during scrolling on my Webflow site if the 'show/hide' option is no longer available in the interactions panel?
Is it possible to completely remove all content, styles, and CMS from a paid plan website started with a template in Webflow?
Is there an alternative method for adding a nationality dropdown to my website in Webflow without exceeding the 10k character limit for custom embed code?
How can I quickly duplicate a prepopulated CMS Collection Page in Webflow and easily modify its contents without manually copying and pasting fields or using the bulk import function?
Can Webflow be used to call a CSS or JS file stored on a different server, instead of hosting them on GitHub?
How can I use the Finsweet script to manage two different sliders on my Webflow page, each feeding content from different collections?
How can I prevent a full-screen slider in Webflow from pausing on hover? Additionally, I would like to link two sliders to one control or navigation. Can anyone with JavaScript knowledge help me achieve this?
How can I fix the issue with the scroll not being smooth on my mobile device (iPhone + Safari) in Webflow?
How can I prevent scroll when my nav is open in Webflow using code? The scroll is disabled correctly when I change the class name of the second 'menu', but it does not get activated when the menu is closed. It doesn't work at all if both class names are the same. Can anyone provide assistance with this issue?
How can I add date filtering to my current list of filters in Webflow using Finsweet CMS Filtering?
How can I change the language of publication dates in Webflow CMS collection from English to Portuguese?
How can I configure Webflow forms to exclude empty or unchecked checkboxes when sending emails? Additionally, is it possible to customize the email text for checked checkboxes, such as using "réservé" instead of "true"?
How can I dynamically redirect to a CMS created after form submission in Webflow?
How can I make the menu close when a link is clicked in Webflow?
How can I hide the "no items found" empty field in Webflow for a second multi-image gallery on certain pages?
How can I implement swipe functionality between tab panes on mobile using custom code in Webflow?
How can I disable right-clicking on images to prevent downloading on my Webflow portfolio website?
Is there a way to fix the issue of values from Textareas with multiple lines not getting parsed correctly in Webflow Logic when posting to an external API?
In Webflow, how can I hide specific elements in the footer (such as "Ramin Khaze The Difference" and "Schedule showing") when the URL contains a certain parameter, such as "?mls"? I am a beginner in coding and would appreciate any help. Thank you!