Yendif Player (A Jquery Media Player Plugin) is now available for WordPress. DownloadDocumentationLive Demo

Setup wizard

Installation

Playing video

Subtitle your video

Playing audio

Working with playlists

Skins

Control player size

Google analytics setup

Keyboard shortcuts

Add commercial license

Video Bottom side playlist scrollable

    // ensure DOM is ready
    $(function () {
 
      // this will install yendifplayer into an element with id="player"
      $("#player").yendifplayer ({
        playlistPosition:"bottom",
        playlistHeight:"150",
        videos:[{
          mp4:"https://mysite.com/videoOne.mp4",
          poster:"https://mysite.com/posterOne.jpg",
          title:"Title - Video One",
          description:"Description - Video One",
          duration:"00:00"
        },{
          mp4:"https://mysite.com/videoTwo.mp4",
          poster:"https://mysite.com/posterTwo.jpg",
          title:"Title - Video Two",
          description:"Description - Video Two",
          duration:"00:00"
        },{
          mp4:"https://mysite.com/videoThree.mp4",
          poster:"https://mysite.com/posterThree.jpg",
          title:"Title - Video Three",
          description:"Description - Video Three",
          duration:"00:00"
        }]
      });
      
	});
    
    <!-- empty container element with unique id="player" -->
	<div id="player"></div>
    

Audio Bottom side playlist scrollable

    // ensure DOM is ready
    $(function () {
 
      // this will install yendifplayer into an element with id="player"
      $("#player").yendifplayer ({
        playlistHeight:"150",
        audios:[{
          mp3:"https://mysite.com/audioOne.mp3",
          title:"Title - Audio One",
          description:"Description - Audio One",
          duration:"00:00"
        },{
          mp3:"https://mysite.com/audioTwo.mp3",
          title:"Title - Audio Two",
          description:"Description - Audio Two",
          duration:"00:00"
        },{
          mp3:"https://mysite.com/audioThree.mp3",
          title:"Title - Audio Three",
          description:"Description - Audio Three",
          duration:"00:00"
        }]
      });
      
	});
    
    <!-- empty container element with unique id="player" -->
	<div id="player"></div>