gatsby-remark-embed-autoplay-video
v1.7.2
Published
Embed Videos (Youtube, Vimeo, VideoPress) in Gatsby via Markdown
Downloads
10
Readme
gatsby-remark-embed-video
Embed a Youtube Video in your Markdown
Inspired by gatsby-remark-embed-youtube
Install
- Install plugin to your site:
npm i gatsby-remark-embed-video
yarn add gatsby-remark-embed-video
- Add following to your
gatsby-config.js
:
plugins: [
{
resolve: "gatsby-transformer-remark",
options: {
plugins: [
{
resolve: "gatsby-remark-embed-video",
options: {
width: 800,
ratio: 1.77, // Optional: Defaults to 16/9 = 1.77
height: 400, // Optional: Overrides optional.ratio
related: false, //Optional: Will remove related videos from the end of an embedded YouTube video.
noIframeBorder: true //Optional: Disable insertion of <style> border: 0
}
}
]
}
},
Note: if you also rely on gatsby-remark-responsive-iframe
, you have to define the embed-youtube plugin first:
plugins: [
"gatsby-remark-embed-video",
"gatsby-remark-responsive-iframe"
]
Note: you can style the videoIframe using .embedVideoIframe
- Restart gatsby.
Usage
# Look at this Video:
`video: https://www.youtube.com/embed/2Xc9gXyf2G4`
`youtube: https://www.youtube.com/watch?v=2Xc9gXyf2G4`
`youtube: 2Xc9gXyf2G4`
`vimeo: https://vimeo.com/5299404`
`vimeo: 5299404`
`videoPress: https://videopress.com/v/kUJmAcSf`
`videoPress: kUJmAcSf`
`twitch: https://player.twitch.tv/?channel=dakotaz`
`twitch: https://player.twitch.tv/?autoplay=false&video=v273436948`
`twitch: 273436948`
`twitchLive: dakotaz`
License
MIT