Audio Waveform Player with Playlist

Audio Waveform Player is responsive and fully customizable HTML5 audio plugin. It creates waveform from audio track automatically and displays it as a seekbar.

Waveform can be created using Web Audio Api, plus there is also image waveform available as backup option.

Once the waveform is drawn, peak file is saved, and next time audio is loaded, waveform is available immediately and it works on all browsers (including old IE versions).

It support self hosted audio mp3 files and some other external music services like Soundcloud, Podcasts, Google Drive Storage etc…

This plugin can be added into any post or page area using shortcodes.

Video installation:

Video tutorials on creating presets and shortcodes:

Video tutorials on creating playlists:

Features and options:

  • Responsive layouts
  • Font Awesome Library icons
  • Only mp3 audio format required for all browsers and devices
  • Playlist options available:
    • Audio mp3 playlist
    • Auto create playlist from folder of mp3 files (and get id3 tags)
    • Podcasts
    • SoundCloud (track set, user tracks, single track, user favorites, user groups)
    • Google Drive, Amazon S3
  • Mix different media types in the same playlist
  • Include multiple instances in the same page
  • Optional playlist
  • Optional song url link in playlist
  • Filter tracks in playlist by title
  • Optional playlist scroll (scroll orientation vertical / horizontal)
  • Optional tooltips
  • Optional song download
  • Optional random playback
  • Optional song playback speed
  • Optional song start / end time
  • Media end action (go to next song / loop current song / stop at song start or end)
  • Optional keyboard audio navigation (pause/play, mute/unmute, next, previous)
  • Automatically created thumbnails for podcast, soundcloud
  • Optional social share (facebook, twitter, tumblr, google plus + other social networks can be added)
  • API methods available
    • Play media
    • Pause media
    • Toggle playback
    • Next media
    • Previous media
    • Load media
    • Load playlist
    • Add track(s) to playlist
    • Remove track(s) from playlist
    • Sort playlist items by title / random (ascending / descending)
    • Destroy media
    • Destroy playlist
    • Set playback rate
    • Toggle random
    • Toggle playlist loop
    • Get / set volume
    • Toggle mute
    • Seek
    • Get current time
    • Get duration
    • Set autoplay
    • Set title
    • Get playlist transition on
    • Get playlist loaded
    • Get active item id
    • Get playlist length
    • Get media playing
    • Get playlist data
    • Get current media data
    • Init playlist scroll
    • Destroy playlist scroll
    • Get settings
  • Callbacks available
    • Setup done
    • Playlist end
    • Playlist start load
    • Playlist end load
    • Playlist empty
    • Media empty
    • Destroy media
    • Destroy playlist
    • Media triggered
    • Media start
    • Media play
    • Media pause
    • Media end
    • Media seek
    • Playlist item enabled
    • Playlist item disabled
    • Playlist item rollover
    • Playlist item rollout
    • Playlist item click
    • Volume change
    • Filter change

Pin It on Pinterest

Share This