Last time, I have tried to insert a MP3 Audio file into sidebar of my wordpress blog. After researching around over internet, there are some solution for that, such as: embed code from a music uploading/sharing service website as NCT, Zing MP3, SoundCloud…
Currently, I am using SoundCloud upload/share audio for my wordpress blog (“updated on 20 Sep, 2017”). Using SoundCloud is mostly ok, except that some of SoundCloud users and even I have some hard experience with the embeding display of SoundCloud, especially when user visit your website by a smartphone, then SoundCloud display an really awful big element “Play on SoundCloud”… I have mind about that, and decided to make a research for making a self Audio Player.
After referring some tutorial on the internet and also tried some of those solutions, I was temporarily feel good with the solution from wavesurfer.js – it’s mostly convenient and simply deploying (especially for someone that is not an expert on wordpress like me…). Below is my showcase and resource link for you all can do a reference.
My showcase: Rawgit demo link, Github source link
Codepen Preview:
[codepen_embed height=”467″ theme_id=”31320″ slug_hash=”qPZVGQ” default_tab=”result” user=”trongnghia203″]See the Pen <a href=’https://codepen.io/trongnghia203/pen/qPZVGQ/’>wavesurfer-example-of-trongnghia203</a> by Nghia Le (<a href=’https://codepen.io/trongnghia203′>@trongnghia203</a>) on <a href=’https://codepen.io’>CodePen</a>.[/codepen_embed]
P/s: At the time of updating of this post, I am still using SoundCloud embed code to play an audio at my sidebar.
