Skip to main content

Posts

Showing posts with the label SopPlayer

Custom HTML5 Video Player - CuteSu - VideoJS Custom Skin Implementation

Custom HTML5 Video Player - CuteSu - VideoJS Custom Skin Implementation Full Screen Demo :-  https://sopplayer.sh20raj.repl.co/CatSu/ Steps :- 1. Add </video> Tag...     - About Video Tag -> <video id="my-video" class="video-js" controls poster="https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-HD.jpg" data-setup='' loop> <source src="https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-1080p.mp4" type='video/mp4'/> </video> 2. Add CSS CDN...     (Before </head> Tag) <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/sh20raj/SopPlayer@main/CatSu/catsu.min.css"/> <link rel='stylesheet' href='https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css'> <link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Questrial'> 3.

Custom Video Player Integration - SopPlayer Red Rose Theme

Custom Video Player Integration - SopPlayer Red Rose Theme Link :-  https://redrose-lite.blogspot.com/ CodePen Link :-  See the Pen RedRose-Lite - Custom HTML5 Video Player - SopPlayer by SH20RAJ ( @SH20RAJ ) on CodePen . https://cdn.jsdelivr.net/gh/CDNSFree/SopPlayer/RedRose/redrose-lite.js Forked and Modified From here :- https://custom-html5-video.surge.sh/

SP-FLAMINGO - SopPlayer Skin Integration

SP-FLAMINGO SopPlayer Skin Integration See Demo :- https://sopplayer.sh20raj.repl.co/flamingo/  Demo Website :-  https://sopplayer.github.io/SP-FLAMINGO/  or  https://sopplayer.sh20raj.repl.co/flamingo View on Repl.it :-  https://replit.com/@SH20RAJ/SopPlayer#flamingo Steps to Import :-  Steps :-        1. Use  class = "sopplayer" in Your <video> Tag .      2. And Add  data-setup = "{}" , attribute like this . HERE IS THE FULL VIDEO CODE      < video   id = "my-video"   poster = " https://i.ytimg.com/vi/YE7VzlLtp-4/maxresdefault.jpg "           class = "sopplayer"   controls   preload = "auto"   data-setup = "{}"   width = "500px" >        <!--Use class="sopplayer" and data-setup="{}" -->        < source   src = "https://commondatastorage.googleapis.com/gtv-videos-bucket/CastVideos/mp4/BigBuckBunny.mp4"

Sopplayer Integration - HTML5 Stylish Video Player

Sopplayer Integration - HTML5 Stylish Video Player See Demo :-      Visit GitHub  - Codepen  - Repl.it Demo Sopplayer Screenshot See Video Documentation : -  Steps :-       1. Use  class = "sopplayer" in Your <video> Tag .      2. And Add  data-setup = "{}" , attribute like this . <video id="my-video" class="sopplayer" controls preload="auto" data-setup="{}" width="500px"> <!--Use class="sopplayer" and data-setup="{}" --> <source src="https://cdn.jsdelivr.net/gh/SH20RAJ/SopPlayer@main/sample.mp4" type="video/mp4" /> </video>      3. Add the Css CDN before  </ head >  Tag . <link href="https://cdn.jsdelivr.net/gh/SH20RAJ/SopPlayer@main/sopplayer.css" rel="stylesheet" /> <!--Here is the Css Library-->      4. Add t

Random Posts