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 host content for European clients in Europe instead of the United States using Amazon Web Service?

What am I missing in Webflow when the black background appears on the button after clicking it in the top nav menu, even though I am on the current page and trying to change the menu's current state?

How can I use the "clamp" function with Webflow? I have already placed an HTML Embed code in the body to apply custom styling, and I have set the root with my variables. However, the "clamp" function is not working. Can someone help me with this issue in Webflow?

What is the extent to which I can develop a Food Delivery web app, including a Driver app and a Restaurant app, using Webflow?

What are some additional tools or apps that work well with Webflow, such as analytics, social sharing, commenting, email (specifically Mailchimp), and CDN/security?

How can I create filter buttons on top of styled events in Webflow CMS?

How can I add a specific webhook for each form in Webflow to connect to different scenarios in Integromat/Zapier? Thank you for your help, I haven't been able to find a solution on the forums.

How can I create interactions with Webflow, specifically for image hover effects? I am a designer with basic CSS knowledge.

Can I use Webflow's invite-only user area with a passwordless login like magic instead of the Webflow login, and still maintain all the other Webflow user area functions? Is there a tutorial available for this?

Why are background videos not playing on the desktop version of my Webflow website, even though they work when toggling the preview?

How can I increase the space between text and underline in Webflow, and can the line thickness be adjusted as well?

How can I recreate the on hover pop up effect like Notion's pricing page in Webflow?

How can I switch from hosting my website on Wix to using Webflow and publishing it online?

How can I create different layouts for mobile and desktop versions in Webflow? I have already created a layout for the mobile version, but when I hide it on the desktop, it also gets hidden on the mobile version. Webflow does not have an option to make it visible on desktop or mobile only.

Can I create a breaking news section like UFC champion Miesha Tate's website on Webflow without any programming knowledge?

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?