Link to the plugin page:
https://zeroqode.com/plugin/hls-video-player-plugin-for-bubble-1688398809646x372061027391842560
Demo to preview the plugin:
Introduction
The HLS Video Player plugin allows you to play streaming video in the .m3u8 format directly inside your Bubble app.
.m3u8 files are playlist files encoded in UTF-8 and typically contain links to live or on-demand video streams. With this plugin, you can integrate live broadcasts or adaptive streaming content into your Bubble pages effortlessly.
Key Features
Prerequisites
Before using the plugin, ensure that:
- A valid .m3u8 video stream URL
- Stream hosted over HTTPS for best compatibility
- Modern browser/device support (Safari natively, others via plugin)
- HLS Video element added to your Bubble page
How to setup
Step 1 – Install the Plugin
Step 2 – Add the Plugin Element to Your Page
Step 3 – Add the Input and Button
Step 4 – Create a Custom State
Step 5 – Configure the Workflow
Step 6 – Bind to the Plugin Element
Plugin Element Properties
HLSvideo
Fields:
Title | Description | Type |
Url | The HLS video source URL (usually ending in .m3u8 ) that the player will stream. | Text |
Autoplay | Determines if the video should automatically start playing when loaded. | Checkbox (yes/no) |
Controls | Enables or disables the built-in video controls (play, pause, volume, etc.). | Checkbox (yes/no) |
Exposed states
Title | Description | Type |
Error | Returns any error message encountered during video loading or playback (e.g., invalid URL, network failure, unsupported format). Useful for debugging and handling errors in workflows. | Text |
Element Events
Title | Description |
Error | Triggered when the video player encounters an error (e.g., invalid/missing URL, playback failure, or unsupported format). This event can be used to run workflows for error handling, such as showing an alert to the user. |