How do I play one embedded video at a time in Post and Page Builder?

Hi Neal,

Thanks for reaching out!  If you’re using the BoldGrid Post and Page Builder “Video” block element by default it should only play one embedded video at a time.  If this isn’t the case for you can you link us to the page where the issue is occurring so that we can have a look?

We look forward to assisting you further with this Neal!

Hey Neal,

Thanks for the additional details. Ultimately, I’d recommend the native builder because we directly support it and I’m positive this functionality is available.  With that being said I understand you’ve already put a lot of work into the bunny.net method and you may not wish to change it.  Here’s how I would approach both scenarios:

1. Prevent Simultaneous Play with iFrame Embeds

To stop multiple iFrame videos from playing simultaneously, you’ll need to add JavaScript that pauses the first video when another one starts. Here’s how to implement this:

• Add the following script to your Crio customizer under the Custom CSS/Js Editor (js), which will ensure only one video plays at a time:
  html

  <script>
document.addEventListener('play', function(e) {
var videos = document.getElementsByTagName('video');
for (var i = 0, len = videos.length; i < len; i++) {
if (videos[i] !== e.target) {
videos[i].pause();
}
}
}, true);
</script>

• This code will apply to all <video width="300" height="150"> elements on the page, so any active video will automatically pause if another one starts.
  

  2. Using the BoldGrid Video Block

  If you’d prefer to use the Video Block in the BoldGrid Post and Page Builder, here’s how to ensure proper embedding with bunny.net:

  • Insert a Video Block:
    1. In the Post and Page Builder, click Add Block > Media > Video Block.
    2. Use the “Insert from URL” option, but ensure you’re using the correct video URL format from bunny.net.
  • If the embed is creating just a link instead of an embedded video, make sure:
    • The URL you’re inserting is directly accessible by browsers as an embed source. Bunny.net should provide a specific embed URL for video hosting.

  I hope this helps Neal!

   

Thanks Neal,

It should pull those tags from the iframe meta data. We’d likely need to inspect your code directly to give you more clear solutions.  I see you’re a BoldGrid Premium subscriber, which means you have access to our BoldGrid Premium support via your BoldGrid Central account (help section).

If you reach out with this request to premium we can access your website with your permission and address your concern directly.  This will allow us to properly inspect the configuration and embed code from Bunny.

We look forward to assisting you further with this!