How to embed Google Drive videos into a Webflow CMS Collection element using unique URLs from the product database?

To embed Google Drive videos into a Webflow CMS Collection element using unique URLs from the product database, you'll need to follow these steps:

1. Get the Google Drive video URL: First, upload your video to Google Drive. Once uploaded, right-click on the video file and select "Get shareable link". Make sure the sharing settings are set to "Anyone with the link can view".

2. Get the unique URL for each video: In your Webflow CMS Collection, you should have a field that includes the Google Drive video URL for each product. This could be a plain text field or a rich text field, depending on your setup.

3. Add an embed element to your CMS Collection Template: In your Webflow Designer, navigate to the CMS Collection Template that you want to display the videos on. Add an Embed element to the appropriate location on the template.

4. Customize the embed element: With the Embed element selected, click on the gear icon and open the settings panel.

5. Use dynamic binding to insert the video URL: Inside the embed element, use the dynamic binding feature to insert the unique product video URL. To do this, click on the plus icon in the URL field and select the appropriate field from your CMS Collection that contains the Google Drive video URL.

6. Adjust the iframe dimensions: By default, the Google Drive video will be embedded using an iframe. If necessary, adjust the width and height of the iframe to ensure proper display of the video.

7. Preview and publish: Save your changes and preview the CMS Collection Template to see how the videos are displayed. If everything looks good, publish your site to make the changes live.

Following these steps will allow you to embed Google Drive videos into a Webflow CMS Collection element using unique URLs from the product database. Please note that this method assumes that the URLs in your CMS Collection are pointing to publicly accessible Google Drive videos.

Webflow Resources

Webflow templates

Webflow inspiration

Rate this answer

Other Webflow Questions

Can Webflow's interface be used to link buttons to filter and sort collection lists, similar to how the Isotope plugin allows for filtering and sorting?

What is a workaround for creating a fullscreen fluid grid with different width and height items in Webflow's collection list?

Why is the auto play feature of the slider not functioning properly on the desktop version of my Webflow site in Safari and Chrome, despite working correctly on mobile devices?

How can I resolve various performance issues, such as eliminating render-blocking resources, deferring unused CSS, ensuring text remains visible during webfont load, minimizing main-thread work, serving static assets with an efficient cache policy, reducing JavaScript execution time, avoiding an excessive DOM size, and minimizing Critical Requests Depth in my Webflow site?

What are some recommended tools for designing and optimizing websites in Webflow?

What is the optimal method for managing images in Webflow? As a newcomer to Webflow, I am unfamiliar with image transformation abilities found in other CMS platforms. How can I achieve automatic resizing of logos in a Collection to dimensions of 200px by 100px, with a JPG quality of 85%? I am aware of setting a DIV background image, but that doesn't provide the same functionality. Do you have any recommendations or am I overlooking this feature within Webflow?

Why is the lottie animation file size so large when exported from After Effects using bodymovin with a compression of 60, making it unsuitable for Webflow due to long loading times?

How do I set up SSL hosting using NameCheap for a client site in Webflow?

How can I align the text in the "MEET US" section to stay fixed to the right with a 20-30px separation from the photo in Webflow?

Can Webflow be used to create a web app with user login, information entry, photo or detail uploads, and have that information appear in a template accessible through a unique URL?

How can I achieve a smooth scrolling effect in Webflow, like the one on the Oui Will website?

How can I make the sign-up form modal in Webflow's homepage only appear once, either after initial load or after the user has signed up or closed out, and how and where can I insert the code to set a cookie?

Where can I modify the settings in Webflow to display my desired content instead of showing the template or Webflow name (as seen in the attached screenshot)?

How can I fix the issue with Google PageSpeed where I have 1 blocking script resource and 4 blocking CSS resources causing a delay in rendering my Webflow page?

Is there a way to replicate a Google map style drag to pan and scroll to zoom on an image in Webflow? Is it possible to achieve this without using interactions? I'm trying to create a webmap for a fantasy game project and want users to be able to pan and zoom high resolution rasterized images of our world. I've considered using Mapbox, but it seems too complex. Are there any other options available in Webflow?

Can Webflow be used to call a CSS or JS file stored on a different server, instead of hosting them on GitHub?

Can the Webflow YouTube component recognize channel IDs instead of video IDs for embedding a Live Stream?

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 whitelist the IP or user agent of a third-party vendor to crawl my Webflow site for legal compliance archiving purposes?

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 add user input to the end of the redirect URL in Webflow?