Skip to content

brandoneggar/react-plyr

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

81 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

ReactPlyr Video Component

npm npm David Travis license

A React video component based on Plyr.

react-plyr

Installation

Add react-plyr into your package.json dependencies:

npm install react-plyr --save

CSS

Include the plyr.css stylsheet into your <head>

<link rel="stylesheet" href="path/to/plyr.css">

If you want to use our CDN (provided by Fastly) for the default CSS, you can use the following:

<link rel="stylesheet" href="https://cdn.plyr.io/3.3.21/plyr.css">

Usage

Simple Youtube or Vimeo video

import Plyr from 'react-plyr';

// add the component in the render function
render() {
  return (
    <Plyr
      type="youtube" // or "vimeo"
      videoId="CDFN1VatiJA"
    />
  )
}

Note: The videoId can either be the video ID or URL for the media.

Props

[WIP]

Support

Please open an issue for support.

Contributing

Please contribute using Github Flow. Create a branch, add commits, and open a pull request.

About

📺 A React video component based on Plyr

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 99.7%
  • HTML 0.3%