← All widgetsWidget 91 · emcp_custom_91

Audio Player

Elementor widget3 layouts9 content options5 style options2 panel sections

Built with the EMCP Widget Builder and registered under the EMCP Custom category of the Elementor panel. Search the panel for: audio, player, music, podcast, sound, visualizer.

Setup guide

  1. Open a page in Elementor, search the panel for Audio Player and drag it into a container.
  2. Content › Content: Layout Preset, Audio File (URL or media), Cover Image, Title, Artist / Subtitle, Show Cover, Show Title & Artist, Show Visualizer and 1 more.
  3. Pick a Layout Preset: Card (cover left), Cover (image on top), Compact (single row). Each one is shown below.
  4. Style tab sections: Style. Colours, typography and spacing set here are scoped to this widget instance.
  5. Publish. Every option is a standard Elementor control, so it responds to the editor, dynamic tags and global styles as usual.
Conditional options: Visualizer Bars appears when Show Visualizer is yes.
Ships with its own JavaScript; it runs once per instance and re-initialises inside the Elementor editor preview.
Layout

Card (cover left)

Layout Preset = card

SoundHelix Song 1T. Schurger
0:00
Layout

Cover (image on top)

Layout Preset = cover

SoundHelix Song 1T. Schurger
0:00
Layout

Compact (single row)

Layout Preset = compact

SoundHelix Song 1T. Schurger
0:00

Options reference

Every control the widget exposes, grouped by panel section. Names in code are the setting keys used by the MCP tools (add-free-widget, update-widget).

Content tab

Content

OptionTypeChoices / rangeDefaultNotes
Layout Preset
preset
DropdownCard (cover left), Cover (image on top), Compact (single row)card
Audio File (URL or media)
audio_file
Image
Cover Image
cover
Image
Title
title
TextTrack title
Artist / Subtitle
artist
TextArtist name
Show Cover
show_cover
Toggleon / offyes
Show Title & Artist
show_title
Toggleon / offyes
Show Visualizer
show_visualizer
Toggleon / offyes
Visualizer Bars
bar_count
Numbermin 5, max 6024Shown when show_visualizer = yes

Style tab

Style

OptionTypeChoices / rangeDefaultNotes
Accent
accent
Color
Visualizer Color
viz_color
Color
Background
card_bg
Color
Text Color
text_color
Color
Border Radius
radius
Dimensions

Add it with the MCP tools

Any connected agent can place this widget: call add-free-widget with widget_type: "emcp_custom_91" and a settings object using the keys above. Run get-custom-widget with id 91 for the full JSON spec.