youtube playlist jQuery, html5, SEO and php Gdata Api v3 (Wordpress version available)

Example html5 with the searchbox enabled (Playerbar autohide, sliding effect, social links, slideshow (loop) and all languages)

+ Slide
- Slide
Youtube Wordpress

Example slideshow enabled. It removes the list and then uses the new standard playlist player from youtube (autoplay next video)

+ Slide
- Slide

Example playlist version with playlist to the right (with thumbs, slideshow (loop) and only listsliding) and autostart

+ Slide
- Slide
+ Slide
- Slide

Demo with Userlist, Colorbox, Light theme and only listslide

(not included in the package)
Click to play these video's

Player options jQuery

The player acts on a simple unordered list containing links to YouTube videos which are created by a little php script

holderId - (ytvideo)
The ID of the element (usually a div) into which the YouTube video will be inserted

html5 - (true)
Uses the iframe player version from youtube for html5 support

NOTE: Only works with the latest browsers and a flash fallback for older browsers. Also most of the parameters like colors doesn't work yet. Youtube is working on this new embed method.
More info here

NEW version 5

New Api V3

slidingshow - (false)
Set to true to play the complete playlist one after another in a continues loop

social - (true)
Facebook and twitter icons with mouseover video. Set to false ro remove (default = true)

slideshow - (false)
Set to true ro remove the playlist below the player and activates the new auto playlist player from youtube (default = false)

sliding - (false)
Set to true to let the list scroll up and show the arrows (default = false)

listsliding - (false)
Set to true to only let the list scroll up (default = false)

adjustHeight - (30)
Instead of adjusting the css you can set the heifgt of the video for all behaviours (like autohide true or not ect.)

autoHide - (true)
Hide, Unhide the player bar (true or false)

playOnLoad - (false)
Auto play by onload page (true or false)

playfirst - (0)
Select the video to start with. 0 is the first, 1 the second ect.

playerHeight - (385)
The height of the embdedded youtube video

playerWidth - (640)
The width of the embdedded youtube video

showRelated - (true)
Set to false to stop related videos being shown at the end of the embedded video

showInfo - (true)
Set to false to stop the title being shown in the video

wmode - (true)
Set to false if you don't want wmode=opaque (html5 only)

modestbranding - (true)
Set to false to show the youtube logo on the playerbar

controls - (true)
Set to false to remove the player bar (only player 3 and html5)

Theme color option - &theme=dark&color=red (default)
Since august 10 2011 a new player is introduced by youtube. There are four themes available.

(Note: Using the desaturated color disables the modestbranding option.)

allowFullScreen - (true)
Add the full screen button (doesn't work with the html5 version)

Player options php

Choose which feed you want
keywords, playlist or username or channel

You will need an proper V3 API key ( Google Console )

can be relevance (default), published, viewCount, rating or none

Sorting at this moment only works in a search

Set language filter
for example EN (english)

parameter none , moderate, strict

Cache the xml feed(true or false)

Empty cached xml
for example after one hour 3600, one day 86400 or one week 604800 (in seconds)

Set length title and description text
Standard is 75 and 300 characters

Set 3d
Search only for 3d movies (works only in search mode). Set to any, 2d or 3d (within single quotes)

Set HD
Search only for HD movies (works only in search mode). Set to any, high or standard (within single quotes)

Set license
Search only for movies with any , creativeCommon or youtube license(works only in search mode)

Set duration
To find videos less than 4 minutes long, use duration=short. To find videos that are between 4 and 20 minutes long (inclusive), use duration=medium. Only videos that are longer than 20 minutes will be returning when requesting duration=long(works only in search mode)


Object-oriented programming

Everything is well documentated in this script so you can easy change things for your own needs

Optimized SEO

Easy integration in your website

Works in all major browsers


maximum 50 movies (youtube restriction)

API key youtube

  1. Create a Google Account

    If you do not already have a Google account, create one now as you'll be needing it.

  2. Create a new Google Project

    Go to your Google Console. Click on Projects in the upper-left, then Create Project and enter a project name & ID.

  3. Enable YouTube Data API V3

    Click on the project you have created if it hasn't already opened after creating. Then go to APIs & auth on the left. In the next screen, click on YouTube Data API V3. Enable the API by toggling the OFF button to ON.

  4. Get API Key

    Once you have enabled the API, click on Quota on the top. You can then click on API Access on the top left and create a new Browser Key. This key can be linked to a domain for security measures, but it is not obligated. Once you've created the key (it should look something like this: AIzaSyDmk3oxVjtu06AWRv60ADPvcYO9tvswzm8), copy it and use it as 'YouTube Data V3 API Key' option.


You can buy this script at codecanyon here for only $9

Buy now at Codecanyon