Audio Player

Click MEDIA tab.

Drag and Drop Audio Player widget into the area of your website page where you'd like to add it to.

Right-click on the added Audio Player widget.

Click Settings (you can also double-click on the added widget to reveal the Settings Pane).

Click Change Audio.

Select a previously uploaded track.

Click Select Audio.

Adjust Audio Player settings (i.e. an option to play track(s) in loop), if necessary.

Click Save to preserve your edits.

That's it. You're done!

Click HERE for an interactive tutorial. Scroll to the bottom for animated steps.

Detailed Step-by-step Tutorial

Add Audio Player

  • Go to MEDIA at the top of the screen.
  • Drag Audio Player widget to an area of the page where you'd like to add it to.

  • Double-click on Audio Player or highlight it and go to Settings pane > APP.

Change Audio

  • Change Audio: Click to select/upload a song for the audio player.
  • Select a previously uploaded song or click Upload to upload a song from your computer.
  • Click Select Audio.

General Settings

  • Title: Enter the title.
  • Show as Tooltip: Show the title as tooltip (text that appears when your mouse hovers over the audio player).
  • Top: Set top margin.
  • Left: Set left margin.
  • Width: Set the width.
  • Fixed Width: Toggle ON to fix audio gallery's width.



  • Color: Choose background color.
  • Opacity: Set opacity for the background.
  • Image: Enable to use an image as a background.
  • Size: Choose background size (i.e. auto, 100%, etc.).
  • Position: Set position of the background.
  • Repeat: Choose repeat type for the background.


  • Color: Choose border color.
  • Style: Chose border style.
  • Width: Choose the width of the border.
  • Radius: Choose border corner radius.


Box Shadow

  • Shadow: Toggle ON to create a shadow for the contact form.
  • H-Shadow: Set horizontal position of the shadow.
  • V-Shadow: Set vertical position of the shadow.
  • Blur: Set blur value for the shadow.
  • Spread: Define how far the shadow spreads.
  • Color: Set the color for the shadow.
  • Style: Select between inset and outset.

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request