Video Popup

Overview

A popup that displays a video.

Structure

This popup includes a Bubble video element. You can display a YouTube or Vimeo video. For more information, please read Bubble's reference on how to use this element.

How to set up

• Modify Video's data source (YouTube or Vimeo) and update the video ID field (you can copy this from the ID shown in the URL when watching the video on YouTube or Vimeo).

  • YouTube video ID is usually 12 characters long

  • Vimeo video ID is usually 10 characters long

• Add a workflow on the page to show Popup videoPopup. In the same workflow, before the show popup action, add a workflow step to Display data in Popup videoPopup. In the workflow, enter the video ID in the data to display field.

• On the workflow tab, add a new event, and select When a popup is closed, reset Popup videoPopup.

Why is my video not showing?

• Make sure your video on YouTube or Vimeo is not private

• In your Bubble editor > Settings tab > General tab > Under privacy & security, check your cookies settings for Do not set cookies on new visitors by default

  • Since recently, Bubble has started to enforce the 'opt-in cookie policy' for apps that have the setting on/checked. This means that any embedded video or iframe will also inherit that setting, which has the side-effect of not working with YouTube or Vimeo's cookie policies as they do not allow playback in embedded frames to people that do not allow cookies. If you have this setting turned on, you need to either have a sign in or cookie consent workflow run before you show users embedded videos. Alternatively, you could turn this setting off my default.