Skip to content

Instantly share code, notes, and snippets.

@BasToTheMax
Created May 25, 2023 16:28
Show Gist options
  • Save BasToTheMax/a9b0371118ec5d821c0d16cc376ba944 to your computer and use it in GitHub Desktop.
Save BasToTheMax/a9b0371118ec5d821c0d16cc376ba944 to your computer and use it in GitHub Desktop.
YouTube Plyr
<div class="container">
<div id="player" data-plyr-provider="youtube" data-plyr-embed-id="bTqVqk7FSmY"></div>
</div>
<!-- Plyr resources and browser polyfills are specified in the pen settings -->
// Change "{}" to your options:
// https://github.com/sampotts/plyr/#options
const player = new Plyr('#player', {});
// Expose player so it can be used from the console
window.player = player;
<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=es6,Array.prototype.includes,CustomEvent,Object.entries,Object.values,URL"></script>
<script src="https://unpkg.com/plyr@3/dist/plyr.min.js"></script>
.container {
margin: 20px auto;
max-width: 500px;
}
<link href="https://unpkg.com/plyr@3/dist/plyr.css" rel="stylesheet" />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment