WordPress Audio Player for WPBakery Page Builder

WPBakery Page Builder is one of the most popular WordPress page editors. This tutorial will guide you how to add an audio player in WPBakery Page Builder. You can create a single button audio player, audio player bar, or audio player with playlist.

A created WordPress audio player demo is as follows (this page is not built with WPBakery Page Builder, but it will have the same effect). You can view the page for more examples: WordPress Audio Player Examples.

There are 2 steps in this tutorial:

• Step 1 - Install Wonder Audio Player and Create a WordPress audio player
• Step 2 - Add the audio player shortcode to WPBakery Page Builder

Step 1 - Install Wonder Audio Player and Create a WordPress audio player

First please install the WordPress premium plugin Wonder Audio Player. You can download the free trial version from the plugin home page, test it, make sure it works for you before upgrading to the commercial version.

After you install the plugin, you can view this post for how to create an audio player: Wonder Audio Player Quick Start Guide. You can also view the quick start video:

Step 2 - Add the audio player shortcode to WPBakery Page Builder

After you create the WordPress audio player, the plugin will provide the audio player shortcode.

To add the audio player to WPBakery Page Builder, in the page editor, add a Text Block element.

Edit the Text Block, add the audio player shortcode.

Please note, the audio player will not work in the page builder itself, both frontend and backend. To test the WordPress audio player, publish the page and view the final web page.