Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/dommmel/jekyll-youtube
:tv: Generate embed html snippets for Youtube URLs
https://github.com/dommmel/jekyll-youtube
Last synced: about 1 month ago
JSON representation
:tv: Generate embed html snippets for Youtube URLs
- Host: GitHub
- URL: https://github.com/dommmel/jekyll-youtube
- Owner: dommmel
- License: mit
- Created: 2015-08-24T10:37:24.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2022-04-09T20:32:44.000Z (over 2 years ago)
- Last Synced: 2024-04-24T16:24:42.126Z (8 months ago)
- Language: Ruby
- Homepage:
- Size: 4.88 KB
- Stars: 91
- Watchers: 4
- Forks: 20
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE.txt
Awesome Lists containing this project
- awesome-jekyll-plugins - **YouTube** - youtube](https://rubygems.org/gems/jekyll-youtube)) -- a Liquid tag that embeds YouTube videos. The default emded markup is responsive but you can also specify your own by using an include/partial. (Videos & Screencasts)
README
# Jekyll Youtube
This Jekyll pluging provides a tag that takes a Youtube URL and generates a (responsive) html snippet to embed the video into your site.
## Installation
Add this line to your Gemfile:
```ruby
group :jekyll_plugins do
gem "jekyll-youtube"
end
```
And then execute:
$ bundle
Alternatively install the gem yourself as:
$ gem install jekyll-youtube
and put this in your ``_config.yml``
```yaml
plugins: [jekyll-youtube]
# This will require each of these gems automatically.
```
## Usage
```
{% youtube "https://www.youtube.com/watch?v=ho8-vK0L1_8" %}
```
or using variables/front matter
```
{% youtube page.youtubeurl %}
```
## Result
By default the plugin will output the following code
```markup
.embed-container {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
max-width: 100%;
}
.embed-container iframe,
.embed-container object,
.embed-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
```
You can specify your own snippet by creating a partial ``_includes/youtube.html``. Inside that partial the Youtube ID is available as ``{{ youtube_id }}``.