用octopress 官方的video tag 可以添加视频，但是由于国内经常使用的是youku,所以下面是如何添加youku视频到octopress的教程。
首先添加youku.rb文件到路径:octopress/plugins/
class Youku < Liquid::Tag def initialize(tagName, markup, tokens)
super @params = markup.split(" ")
if @params.count >=
@id = @params[]
if @params.count >=
@width = @params[]
@height = @params[]
else
@width =
@height =
end
else
raise "No Youku ID provided in the \"youku\" tag"
end
end def render(context)
# "<iframe height=498 width=510 src="http://player.youku.com/embed/XNTEzNzcwNDI0" frameborder=0 allowfullscreen></iframe>"
"<iframe style=\"margin:0 auto; display: block\" height=\"#{@height}\" width=\"#{@width}\" src=\"http://player.youku.com/embed/#{@id}?color=white&theme=light\"></iframe>"
end Liquid::Template.register_tag "youku", self
end
然后就可以像如下添加youku视频文件：
{% youtube 3dNDUNYT1fY %}
其中 ‘3dNDUNYT1fY’是指视频的ID，获取视频ID 如下:
然后编辑markdown 文件，比如我的2014-11-14-test-new-theme.markdown
---
layout: post
title: "test new theme"
date: -- :: +
comments: true
categories:
---
{% video http://s3.imathis.com/video/zero-to-fancy-buttons.mp4 640 320 http://s3.imathis.com/video/zero-to-fancy-buttons.png %} Add Youku Video {% youku XODQ0NzY2MDg4 %}
然后执行:
rake generate
rake preview
然后在浏览器http://localhost:4000/ 预览即可
octopress 是完全支持html5的，完全可以在markdown文件里面直接插入html5 video的语法来添加本地视频。
首先在source目录下面新建videos文件夹（images也是在这个文件夹下面），然后copy 两个视频在videos目录下：
http://yun.baidu.com/share/link?shareid=2373040970&uk=3910054188
然后编辑markdown文件如下：
---
layout: post
title: "test new theme"
date: 2014-11-14 11:22:16 +0800
comments: true
categories:
--- Add Youku Video <video src="/videos/mov_bbb.mp4" controls="controls">
Your browser does not support the video tag.
</video> {% youku XNzM1MTM5ODEy 640 480 %} {% img /images/email.png 400 250%}
然后执行:
rake generate
rake preview
然后在浏览器http://localhost:4000/ 预览即可
html5 video 标签属性如下：