How to Embed Consent-Compliant Videos in Webflow

In case you are embedding YouTube or other videos on your website, please follow the documentation below to make them cookie-compliant and ensure the video is displayed only after users have given consent.

Follow this step-by-step guide to embed videos:

Note: Consent Pro is the standalone successor to the Cookie Consent solution previously included in Finsweet Components. You may still encounter mentions of “Cookie Consent” or “Components” in the screenshots of this documentation, but they remain accurate and applicable for following the tutorial.

Select a category for the video iframe detected in the script tab.

The video iframes will be detected by our solution, allowing you to update the code to make them compliant. The setup is the same whether you are using the native video in Webflow or a video embed code on the page.

Go to the page where this iframe is placed.

Our solution includes a link that shows where to update the video iframe. Click the link to go directly to the page.

Add an Code Embed element to the page.

This embed code with the updated iframe will display a disabled video, which may not be ideal for user experience. We highly recommend using our video element with a placeholder that prompts the user to consent before watching the video.

To do this, click the button below to copy the element and paste it into your page:

Copy Video Element

Copy and paste the updated code inside the Code Embed.

This is the updated video iframe code with the required attributes to make it consent-compliant. Our solution adds the attributes fs-consent-src and fs-consent-categories to prevent the video from loading until users have consented to the chosen category.

Remove the non consent-compliant video.

After adding the updated video iframe, remove the original non-compliant video.

Publish your project! Done!

Still need help?

Get Support