A Jekyll plugin for creating YouTube or Vimeo embed codes.

readme.md

This is a Jekyll plugin for creating YouTube or Vimeo embed codes.

Usage

Put the plugin file video-embeds.rb in your _plugins directory. Create a tag specifying the type of video you want to embed with the first required argument, the video id.

{% youtube ab1234ab1 %}

You can also specify a height and width. If you do not, it defaults to 500 x 281.

{% vimeo 123456789 1920 1080 %}

video-embed.rb

class YouTube < Liquid::Tag 
  def initialize(tagName, markup, tokens)
    super

    args = markup.split(' ')
    @id = args[0]
    @width = 500
    @height = 281
    
    if args[1]
      @width = args[1]
      @height = args[2]
    end
  end
 
  def render(context)
    "<div class=\"youtube\"><iframe width=\"#{@width}\" height=\"#{@height}\" src=\"http://www.youtube.com/embed/#{@id}?color=white&theme=light\"> </iframe></div>"
  end
 
  Liquid::Template.register_tag("youtube", self)
end

class Vimeo < Liquid::Tag
  def initialize(tagName, markup, tokens)
    super

    args = markup.split(' ')
    @id = args[0]
    @width = 500
    @height = 281
    
    if args[1]
      @width = args[1]
      @height = args[2]
    end
  end
 
  def render(context)
    "<div class=\"vimeo\"><iframe src='http://player.vimeo.com/video/#{@id}\" width=\"#{@width}\" height=\"#{@height}\" frameborder=\"0\" webkitAllowFullScreen mozallowfullscreen allowFullScreen> </iframe></div>"
  end
 
  Liquid::Template.register_tag("vimeo", self)
end

I'm using redcarpet2 for my markdown processing and I'm not having any problems. This may or may not work with maruku processing at the moment.

| Illegal character '&' in raw string "http://www.youtube.com/embed/oHg5SJYRHA0?color=white&theme=light"
| Line: 1
| Position: 166
| Last 80 unconsumed characters:

whoops (using maruku)

• update, just switched to redcarpet instead, apparently Maruku is obsolete: http://benhollis.net/blog/2013/10/20/maruku-is-obsolete/

Shouldn't the Vimeo render line use a " instead of a ' character?

% diff _plugins/video-embed_old.rb _plugins/video-embed.rb
39c39
<     "<div class=\"vimeo\"><iframe src='http://player.vimeo.com/video/#{@id}\" width=\"#{@width}\" height=\"#{@height}\" frameborder=\"0\" webkitAllowFullScreen mozallowfullscreen allowFullScreen> </iframe></div>"

---
>     "<div class=\"vimeo\"><iframe src=\"http://player.vimeo.com/video/#{@id}\" width=\"#{@width}\" height=\"#{@height}\" frameborder=\"0\" webkitAllowFullScreen mozallowfullscreen allowFullScreen> </iframe></div>"

Just in case anyone is curious, I'm using Embedly for this task (and more) these days. This Jekyll plugin is a start for implementing it. https://github.com/robb/jekyll-embedly-client

Using kramdown for rendering, the <iframe is rendered into <iframe. What should I do?

Starting May 1st, 2016, GitHub Pages will only support kramdown.

🚀 A Jekyll plugin to provide powerful supports for table, mathjax, plantuml, youtube, vimeo, dailymotion, etc.
https://github.com/jeffreytse/jekyll-spaceship