Customizable Youtube iFrame Player API – youtubeAttributeAPI

Preview:

Description:

A custom Youtube iframe player API that enables you to embed customizable Youtube videos into your page via HTML data attributes.

How to use it:

1. Import the necessary JavaScript and CSS files.

<link rel="stylesheet" href="dist/css/noWrap.css" />
<script src="dist/js/api.js"></script>

2. Create an empty DIV container and specify the video ID in the data-identity attribute:

<div class="player" 
     data-identity="VIDEO ID HERE">
</div>

3. Config the Youtube video player using the following HTML data attributes:

<div class="player" 
     data-identity="VIDEO ID HERE"
     data-height="400"
     data-width="100%"
     data-inline="1"
     data-autoplay="0"
     data-loop="1" 
     data-mute="0" 
     data-controls="1"
     data-playlist="Playlist ID HERE"
     data-modest="0"
     data-rel="0"
     data-fs="1">
</div>