Also read: Working JWPlayer for Blogger Blogspot
Table of Contents:
👉 Copying the Clappr player code
👉 Making a post
👉 Pasting the Clappr player code inside post
👉 Placing the M3u8 link inside the code
👉 Saving the post
👉 Testing the working player
👉 First, copy the given code below.
Fashion TV live stream // HLS link: https://fash1043.cloudycdn.services/slive/_definst_/ftv_paris_adaptive.smil/chunklist_b380000_t64MTQ0cA==.m3u8
👉 Making a post
👉 Pasting the Clappr player code inside post
👉 Placing the M3u8 link inside the code
👉 Saving the post
👉 Testing the working player
Working Clappr/m3u8/hls Player for Blogger Blogspot
As you can see, Listph.com is a website made up of Blogger platform. So, if you are also a Blogger or Blogspot user, then, this player code will also work 100% for your own.👉 First, copy the given code below.
👉 Second, Paste the code inside your Blogger Post/Article (whatever). Make sure to switch from Compose to HTML first before pasting, otherwise, the code won't work for your site.<script type="text/javascript" src="https://cdn.jsdelivr.net/clappr/latest/clappr.min.js"></script><script type="text/javascript" src="https://cdn.jsdelivr.net/clappr.level-selector/latest/level-selector.min.js"></script><div id="oper"></div><div id="vid"></div><script>player = new Clappr.Player({source: "PASTE YOUR M3U8 LINK HERE",mimeType: "application/x-mpegURL",autoPlay: true,height: "400",width: "100%",plugins: {"core": [LevelSelector]},parentId: "#vid"});</script>
☑ source: change this to your own m3u8 link
☑ height: you can change this to change the height of your player
☑ autoPlay: you can change this to false if you want the live stream not to play automatically
Important note: If your blogspot or website is in https, then, do not paste a m3u8 link that is in http only. It won't play.
👉 Now, save your post and done!
See live sample below:
Red Bull TV live stream // HLS link: https://rbmn-live.akamaized.net/hls/live/590964/BoRB-AT/master_3360.m3u8
Fashion TV live stream // HLS link: https://fash1043.cloudycdn.services/slive/_definst_/ftv_paris_adaptive.smil/chunklist_b380000_t64MTQ0cA==.m3u8
8 Comments
Thanks a lot for this tutorial. It really help me for my streaming site. :)
ReplyDeleteim glad this helped you. cheers!
Deletehow can i do?my website is https
ReplyDeletejust copy and paste the given code on your site
Deletehow can i add ads code at the middle of the player with x letter to remove
ReplyDeleteI add this link “ https://i-am-so-cool.licenses4.me/cdn/premium31/chunks.m3u8?md5=Njgc81Udw63VE0wHYJXncg&expires=1646751049”. But it didn’t play. Why?
ReplyDeletebecause it is not the real m3u8 link it is only a segment.
DeleteHow can I hide the m3u8 address in the code?
ReplyDeletePlease comment according to the post topic. Any links and off-topic comments will not be published. Thanks!