Why is my HTML5 video not showing up when I try to embed it using the Webflow embed HTML widget, even though the video plays fine when I paste the URL into a browser? I have followed the coding guides correctly.

TL;DR

Ensure the video is hosted on a public HTTPS server that allows CORS and provides a direct .mp4 link.
Use correct

If your HTML5 video isn't displaying in Webflow despite the file working directly in a browser, the issue likely involves file hosting, incorrect video attributes, or Webflow sandboxing of third-party content.

1. Check Video Hosting and Permissions

Some servers (like Google Drive, Dropbox, or private hosting) block cross-origin (CORS) access, which Webflow requires to load external video files inside an embed element.
Test by:
Right-clicking the video link → Open in new tab → If it downloads instead of playing in-client or requires login, it's not embeddable.
Use a publicly hosted video instead, such as one on Amazon S3 or a direct video file hosted on your own server with proper permissions.

2. Confirm Correct `<video>` Tag Syntax

Ensure your embed code matches this structure without extra styling or misconfiguration inside the Webflow Embed widget:
``
Keep in mind:
autoplaying video must also be muted for browsers to allow it.
If hosted externally, always specify the type attribute (type="video/mp4").
Avoid using relative URLs or file paths like /video.mp4 unless the video is hosted on the same domain and available via a direct path.

3. Use HTTPS and Direct URLs

Webflow requires assets embedded via the widget to load over HTTPS.
Verify your video URL starts with https:// and points directly to the .mp4 file. If the URL is a redirect (e.g., unauthenticated file share URLs), embedding will likely fail.

4. Test Without Browser Extensions or Ad Blockers

Some browser extensions like privacy or ad blockers can prevent media from playing or loading.
Open your site in incognito mode or try with all extensions disabled.

5. If Using Dropbox, Google Drive, or iCloud – Avoid

These services do not serve raw video files correctly for HTML5 embedding. They usually serve preview pages or block embedding altogether.
Use a proper file host that serves the .mp4 directly—Amazon S3, GitHub, or dedicated CDN platforms work reliably.

Summary

Your HTML5 video probably isn't appearing in Webflow due to one of three issues: the URL isn't a direct link to an MP4, the server blocks cross-origin access (CORS), or syntax inside the embed has problems. Hosting the video on a CDN with a public HTTPS link and using the correct <video> syntax in the embed widget will resolve the issue.

Webflow Resources

Webflow templates

Webflow inspiration

Rate this answer

Other Webflow Questions

How can I center a column in a Div or Container in Webflow?

How can I style the "Current" state of a menu item in Webflow using custom CSS?

Is there a way to add anchor links to specific paragraphs in a blog post on Webflow without using ID's and creating sections?

Why does Webflow not allow buttons to be clicked and prevent navigation to other pages upon first loading the site?

How can I send data from a Webflow Form to ActiveCampaign without using Zapier? I have set the form to POST and input the form's action URL, similar to Mailchimp but it redirects me to the admin area of ActiveCampaign without sending the data. Has anyone had success with this method?

How can I delete a hover state's styles in Webflow that I added by mistake?

How can I dynamically change the background of every other item in a collection list in Webflow?

How can I ensure compatibility with the latest version of jQuery in newly published Webflow sites?

Does Webflow have a dropdown menu function for submenus? If not, how can I export and add this function separately? Will Webflow offer this feature in the future?

Can Webflow support features like personalization and A/B testing found in landing page builders such as Instapage and Unbounce?

How can I access and modify the laptop image or text in a Webflow template?

Any suggestions on how to resolve the issue where editors invited to my Webflow site are unable to create their username and password after entering the temporary site password?

How can I display event start and end dates in the local time of my website visitors using Webflow?

Can anyone advise on how to link an existing external database to a Webflow site?

Can text entered in the Webflow CMS be automatically truncated once added to a page? For example, using the first 100 characters of a field as the snippet text on a directory page?

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!

How can I prevent the "w-current" class in Webflow from overriding the height of my custom class on a link block element?

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

How do I mirror user input from a form field to a non-form text field on the same Webflow page in real-time using JavaScript?

How can I close a dropdown in Webflow when clicking on a link?

Is there a more optimal way to create a portfolio section with a sticky image container that changes as you scroll, similar to the design on Deveb's website, that works across different web browsers, especially Safari, using Webflow or any other JavaScript tools?

How can I implement a multi-select field with a pre-selected option in a popup form on a collection page using Webflow?

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?