Description
Dependent Media Audio Playlist for Beaver Builder adds a self-contained audio playlist module to the Beaver Builder page editor. Drop it onto a page, paste in audio URLs (or pick files from your media library), and you get a full playlist player with play/pause, previous/next, shuffle, repeat, scrubbable progress, and a volume slider — all styleable from the standard Beaver Builder color and dimension settings.
This plugin is not affiliated with or endorsed by Beaver Builder. “Beaver Builder” is a trademark of Beaver Builder LLC and is used in this plugin’s name and description solely to describe what page builder this module integrates with.
Features
- Full playlist UI with track titles, artists, and optional artwork
- Play, pause, previous, next, shuffle, repeat (off / repeat-all / repeat-one)
- Scrubbable progress bar with current time and duration
- Volume slider with configurable initial volume
- Optional autoplay (browser-permitting)
- Per-instance color customization: background, text, accent, progress bar, hover highlight
- Border radius and max-width controls
- Native HTML5 audio — no external libraries, no third-party services
- Works with whatever audio formats the visitor’s browser supports (MP3, AAC, OGG, WAV)
- Built-in media library picker buttons in the editor for both audio files and artwork
You bring your own audio
Tracks are stored in your WordPress Media Library (or any reachable URL). The plugin just references them and plays them in the browser. No data leaves the visitor’s device — there are no analytics, no telemetry, and no third-party scripts.
Requires Beaver Builder
This module requires the Beaver Builder page builder (Lite or Pro). The free Beaver Builder Lite version is sufficient. If Beaver Builder is not installed or activated, the module simply won’t appear in the editor and an admin notice will be shown.
Installation
- Install Beaver Builder (Lite or Pro) and activate it.
- Upload this plugin through the Plugins Add New screen, or upload the ZIP via Plugins Add New Upload Plugin.
- Activate the plugin through the Plugins screen.
- Edit any page with Beaver Builder. Open the modules panel, scroll to the Media group, and drag in the MP3 Player module.
- In the module’s Tracks section, add one track at a time: paste an audio URL or click Browse Audio Files to pick from the media library. Optionally add a title, artist, and artwork URL.
- Tweak playback (initial volume, autoplay) and styling (colors, border radius, max width) in the other tabs.
- Save the page and view it on the frontend.
FAQ
-
Do I need Beaver Builder to use this?
-
Yes. This plugin adds a module to the Beaver Builder page editor. Without Beaver Builder installed and active, the module has nothing to attach to. The free Beaver Builder Lite version is sufficient.
-
What audio formats are supported?
-
Whatever the visitor’s browser supports through the native HTML5
<audio>element. In practice that’s MP3, AAC, OGG, and WAV across modern browsers. The plugin doesn’t transcode — you serve whatever file you upload. -
Where are tracks stored?
-
Wherever you put them. The module just stores URLs. Most people upload audio files to their WordPress Media Library and use those URLs, but any publicly reachable URL works.
-
Does autoplay work?
-
It tries. The plugin will call
audio.play()on page load if autoplay is enabled, but most browsers block autoplay with sound unless the user has interacted with the page first. If the browser blocks it, the player just sits ready and waits for the user to click play — no error is shown. -
Can I have multiple players on one page?
-
Yes. Each module instance is fully independent — its own tracks, its own playback state, its own styling. They don’t interfere with each other.
-
Does the player track listening data or report anything?
-
No. There are no analytics calls, no third-party scripts, no telemetry. The browser plays the file directly from wherever the URL points.
-
Will this slow down my pages?
-
The module enqueues a small per-instance CSS + JS pair only on pages that contain the module. The total weight per instance is on the order of a few kilobytes; the audio file itself is fetched only when the user starts playback (preload is set to
metadataso only the duration is fetched up front). -
Where can I report bugs or request features?
-
Open an issue at the GitHub repository: https://github.com/Dependent-Media/dm-audio-playlist
Reviews
There are no reviews for this plugin.
Contributors & Developers
“Dependent Media Audio Playlist for Beaver Builder” is open source software. The following people have contributed to this plugin.
Contributors
Translate “Dependent Media Audio Playlist for Beaver Builder” into your language.
Interested in development?
Browse the code, check out the SVN repository, or subscribe to the development log by RSS.
Changelog
2.0.2
- First public release on WordPress.org.
- Renamed the plugin from “BB MP3 Player” to “Dependent Media Audio Playlist for Beaver Builder” to comply with WordPress.org Plugin Directory naming guidance (third-party plugins cannot use a brand name as a prefix in a way that implies official affiliation).
- Updated the text domain to
dependent-media-audio-playlist-for-beaver-builder. - Fixes a CSS-injection issue in the per-instance frontend styles: color values from the Beaver Builder color picker are now passed through a strict allowlist sanitizer (
dm_audio_playlist_sanitize_color) that accepts only valid#hex,hex,rgb(), andrgba()patterns; everything else falls back to the per-field default. - Removes the duplicate inline
<style>block that was being emitted fromfrontend.phpin addition to the framework-renderedfrontend.css.php. Styles are now rendered through a single source. - Refactors the Beaver Builder editor’s media-picker injection script: the inline
<script>previously echoed intowp_footeris now an enqueued JavaScript file (js/editor.js) loaded only when the BB editor is active and the user hasedit_posts. - Adds the GPLv2
License,License URI,Requires at least, andRequires PHPplugin headers required by the WordPress.org Plugin Directory. - Backwards-compatibility shim for sites that ran the prior internal 1.x “BB MP3 Player” builds: the
BBMp3PlayerModulePHP class is registered as an alias ofDM_Audio_Playlist_Module, and both the module and its track settings form are registered under their old and new names. Existing Beaver Builder layouts that reference the old class continue to render after upgrade with all settings preserved (track URLs, titles, artwork, colors, volume, autoplay). - Drops the
Requires Plugins: beaver-builder-lite-versionheader. Beaver Builder Pro has a different slug than Beaver Builder Lite, so that header would block users on Pro from activating the plugin even though Pro fully satisfies the actual dependency. The plugin still checks forFLBuilderat runtime and shows an admin notice if neither Lite nor Pro is active.