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 to the standard format (https://www.youtube.com/watch?v=VIDEO_ID) before adding them to the Webflow CMS Video field.
Alternatively, use a custom Embed element with a Plain Text CMS field storing the video ID to build a manual <iframe> embed.

Webflow does not currently support embedding YouTube Shorts via the CMS Video link field in native components. Shorts links often use a URL format that Webflow's video field cannot interpret correctly for embedding.

1. Why YouTube Shorts Don’t Work in the Video Field

The Webflow CMS Video field is designed to accept standard YouTube watch URLs (e.g., https://www.youtube.com/watch?v=VIDEO_ID) or Vimeo links.
YouTube Shorts URLs (e.g., https://youtube.com/shorts/VIDEO_ID) use a different path structure that Webflow’s parser doesn’t currently recognize.
When you use a Shorts URL, Webflow cannot automatically extract the video ID for embedding.

2. How to Use YouTube Shorts in Webflow CMS

To make it work, update the URL in your CMS item:

Convert your Shorts URL to the standard YouTube video link format.
Instead of https://youtube.com/shorts/XYZ123, use https://www.youtube.com/watch?v=XYZ123.
Paste this converted URL into your CMS Video Link field. Webflow should then embed the video correctly.

3. Alternative Option Using Embed Code

If you want to embed the Shorts layout specifically, or need more customization:

Use a custom Embed element in your design.
In the CMS, create a Plain Text field to store just the video ID (e.g., XYZ123).
Inside the Embed element, use dynamic fields to construct a custom <iframe> manually (e.g., https://www.youtube.com/embed/XYZ123).
Note: Webflow limits script tags and may sanitize some custom embeds on the CMS.

Summary

Webflow CMS Video fields don’t directly support YouTube Shorts URLs because of their non-standard format. To fix it, convert Shorts URLs to the regular YouTube watch URL format (/watch?v=VIDEO_ID), or use a custom embed approach for more control.

Webflow Resources

Webflow templates

Webflow inspiration

Rate this answer

Other Webflow Questions

Can the background shadow animation shown on the Build microinteractions around mouse movement example on the Webflow Interaction feature page be achieved using just interactions or does it require custom code?

How can icons be added to TAB and BUTTON components in Webflow for a complex project?

How can I implement a navbar that shows on scroll-up and hides on scroll-down in Webflow? This feature is particularly useful for mobile browsing.

How can I remove extra white space on the right side of my Webflow site when scrolling to the left?

How can I ensure that the correct Meta description and title are displayed when searching for my Webflow site on Google?

Is it possible to link buttons to specific CMS collection pages in Webflow? For example, if there are three buttons on a page, can each button be linked to their respective CMS collection pages? I have searched extensively but couldn't find an answer. Thank you! - Andrew

Can Webflow be used to create this?

How can I make a responsive video autoplay and loop in Webflow, even on mobile devices?

Do the URLs for inline images in articles on Webflow CMS persist when shutting down a site, or do they need to be migrated?

How can I set up a custom code button in Webflow that waits 2 seconds before redirecting to a specific URL when clicked?

How can I integrate Stripe with Webflow and ensure it works properly?

How can anchor links be created in Webflow without altering the site address when clicked on?

Where can I find the first buy button embedded on the "Products Template" dynamic collection page in Webflow?

What could be causing the flexbox on the main home page and the "Leasing" page in Webflow to not stack properly and have a white margin on the right div block? I have tried multiple solutions, but nothing seems to be working. Could you please take a look at my site Read-Only and advise on what I might be doing wrong?

How does Webflow address high CO2 emissions and strive for green hosting for websites hosted on their platform?

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 dynamically redirect to a CMS created after form submission in Webflow?

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!

Can I capture a screenshot of a Webflow page on click and convert it to a downloadable PDF?

How can I alternate the layout of the image and heading for each collection item in a two-column format on Webflow?

How can I execute JavaScript code when clicking a specific button with a given ID in a Webflow project?

How can I disable the Webflow success or failure state for a sign-up form and display a custom thank you page using jQuery and the Webflow form submit state?

How can I create a vertical scrolling menu with Webflow, similar to the one on Apple's website, that switches to horizontal scrolling when the menu doesn't fit on one screen?

How can I change the language of the Google Maps embed from English to Arabic in Webflow?

How can I reduce the vertical space between lines within a bullet point in Webflow? Can I replace the bullet points with icons on the "Services" page?

How can the text color be changed for custom input fields on Webflow?

How can I add conditional visibility in Webflow to prevent a div from appearing on a published page if a CMS field is empty?

How can I stop a YouTube video from playing in the background in audio mode when I close a modal in Webflow?

How can I connect and use my JavaScript and CSS files for special functions and styles in Webflow?

How can I fix the "Ensure text remains visible during webfont load" warning in Webflow?