Widget Used
Switcher
Tutorial Videos
Official Video

Let your visitors play a song or a podcast on your website using the Audio Player widget. You can showcase a single song from your collection or a complete playlist. This widget can be widely used on Music Streaming, DJ, Events, and Podcast websites.

Pro tip
Why not create your company/business timeline using this widget. Explain how and when it started, how it grew over the years, and how it is doing today. Don’t you think it will look cool?

How to use the Audio Player Widget of The Plus Addons For Elementor

The Audio Player widget comes with 9 different styles and a plethora of customization options using which you can create stylish looking players for your websites.

Table Of Contents

General Steps

Search for the Audio Player element from the Elementor screen in the left and then drag and drop it into the content building area. After dropping the element, you will see three tabs i.e. Content, Style, and Advanced related to the Audio Player widget. First, click on the Content tab.

1. Content

Audio Player

Styles

Select your preferred Audio Player style from the dropdown. We have provided 9 different styles to choose from. Keep switching the styles to see the different design layouts and settle on one.

Select Source

Select your preferred source of your content from the dropdown. You can add custom content or you can fetch the content from your templates.

This is a sample image demonstration

Playlist

By default, there will be one sample playlist created for you. You can either add a new one or duplicate the existing one and start adding your content. Use the Add Item button to add a new playlist. Click this + icon on the playlist to duplicate it.

Song Title

Add the title of your song here.

Song Author

Add the author/singer of your song here.

Source

Set how are you going to upload your media files(songs). You get two options to select from.

Self Hosted
Upload the media files on your own server (i.e. uploading to your WordPress Media Library).  After you select the Self Hosted option, you will see the File Upload option. Click on it to add all your songs.

External
Add an external URL to your hosted song or playlist such as Soundcloud. You will see an option to add a custom URL after you select the External option.

Song Image

Set your playlist image here by clicking the + icon.

Common Setting

Image Size

Set your preferred image size from the dropdown. You can also add custom dimensions for your image.

This is a sample image demonstration

Split Text

Add a split text between Song Title and Song Author. For eg: Girls Like Your by Maroon5

Max Width

Set the max-width of your Audio Player widget. Click the icon to set different widths for desktop, tablet, and mobile.

Default Volume

Set a default volume for your Audio Player widget by using the slider.

Alignment

Set the position of your Switcher button. By clicking the alignment icons, you can set it to Left, Right or Center.

2. Style

The Style tab is used for customizing the look of all the Audio Player widget components such as Song Title, Song Author, Split Text, Control, Tracker, Playlist, and Player Background.

All these styling options include customizing the fonts, colors, background, margins and padding which are common across all the widgets. So, we have created a single detailed article explaining these Styling Options.

View On Scroll View Animation Tutorial

3. Advanced

Advanced Options are a common option for almost all widgets. So, we have written a detailed tutorial on how to use these options.

View On Scroll View Animation Tutorial