YouTube Playlist Player

Created with ❤ in Poland by lepo.co
A simple way to display playlists nicely on your website. Reponsively, using YT API V3.
This is an early version so there is still room for improvement.

Usage

Add a reference to the script and style

<linkrel="stylesheet" href="https://cdn.jsdelivr.net/gh/rapiddev/ytpp@1.0.3/ytpp.min.css"><scriptsrc="https://cdn.jsdelivr.net/gh/rapiddev/ytpp@1.0.3/ytpp.min.js"></script>

Place the player wherever you like

<divclass="ytpp-player"
data-playlist="PLpsBoYnu3xNbKE_i7crf55E8h7lgHp4bt"
data-format="2by1"
data-itemsheight="50"
data-itemswidth="90"
data-rounded="true"
data-loop="true"
data-autoplay="true"
data-playnext="true"
data-showcontrols="false"
data-showtitles="false"
data-showinfo="false"
data-showrelated="false"></div>

Finally, run the script

<script>newYTPP({api: 'your_youtube_api_v3_key'}).Show();</script>

Global arguments

You can change the settings for all players during script initialization

<script>newYTPP({debug: true,itemsHeight: 50,itemsWidth: 90,api: 'your_youtube_api_v3_key',show:
{controls: true,related: false}}).Show();</script>

Options available

Option	Description
api	Your private YouTube API V3 key Default: ''
playlist	Playlist embed ID Default: ''
format*	The aspect ratio of movies in your playlist Available: 16by9, 21by9, 2by1 Default: '16by9'
itemsheight*	The height of a single element in the slider. Default: 70 (px)
itemswidth*	The width of a single element in the slider. Default: 110 (px)
container*	The HTML element that the player will be placed in Default: null
rounded*	Adds rounded edges to the player and carousel items Default: true
playnext*	Automatically play next videos Default: true
autoplay*	Start playback automatically Default: false
showcontrols*	Show interface elements like play and next buttons Default: false
showtitles*	Show videos titles below thumbnails Default: false
showinfo*	Setting this parameter to FALSE causes the Player to not show information such as the movie title or uploader name before the movie starts. Default: false
showrelated*	This parameter determines whether the player should show similar movies after the video has finished playing. Default: false
loop*	After the entire playlist has played, the player will skip back to the first video and start over. Default: false
debug*	It displays a lot of information. Do not use in production. Default: false

*optional

License

YTPP is free and open source software licensed under MIT License. You can use it in private and commercial projects.
Keep in mind that you must include a copy of the license in your project.