Introduction

Changing the media player game.

If you're wanting to use a custom media player for audio / video elements (including YouTube and Vimeo embeds), you're in the right place. (A special thanks to Sam Potts for making Plyr.io for us all!)

Ever get tired of the Webflow Video player, YouTube/Vimeo embeds, or the standard HTML 5 Video/Audio elements?

Plyr.io solves this.

This website serves as a cloneable version of different video- and audio- based integrations of plyr.io: a simple, accessible and customizable player for HTML5 Video/Audio, YouTube, and Vimeo.

NOTE: If you want to know the ins-and-outs of how we built this, please read our tutorial on the matter. This project just shows you the set-up in action and allows you to clone the project yourself, but does not go into how the project is set up.

There are different versions of this integration. On top of the static set-ups listed below, you can also use this integration with the CMS to pull in dynamic data.

01

Plyr.io Video Integration
(Default Player)

Perfect for you if you don't like YouTube embeds, Vimeo embeds, or Webflow's default video player and don't need much customization.

02

Plyr.io Video Integration
(Custom Controls)

Perfect for you if want a player with full customization in regards to what controls are shown on the player (volume, captions, etc.)

03

Plyr.io Audio Integration
(Default Player)

Perfect for you if you don't like SoundCloud or another 3rd-party embed and don't need much customization.

04

Plyr.io Audio Integration
(Custom Controls)

Show/Hide all the controls you'd like on the default plyr.io player, such as fast-forward, rewind, download, restart, and more.

© 2019 | The Visual Developers Podcast
Plyr.io Video Integration (Default Player)Plyr.io Video Integration (Custom Controls)
Plyr.io Audio Integration (Default Player)Plyr.io Audio Integration (Custom Controls)