如何在jekyll markdown博客中包含video
我刚刚开始使用jekyll博客。 我用markdown写我的post。 现在，我想在我的文章中join一个YouTubevideo。 我怎样才能做到这一点？
另外，我真的不喜欢由默认提供的jekyll py pyments。 无论如何，我可以改变这种风格？ 如果是的话，你可以指点我一些不错的风格/插件？
你应该可以把HTMLembedded到你的markdown中。 在video下，有一个“共享”button，点击这个，然后点击“embedded”button，这应该给你看起来有点像：
<iframe width="420" height="315" src="http://www.youtube.com/embed/dQw4w9WgXcQ" frameborder="0" allowfullscreen></iframe> 只需将其复制并粘贴到您的文章中，Markdown预处理器就不会触及它。
对于Pygments，在这个仓库中有各种各样颜色主题的CSS样式表，你可以尝试一下。 （请注意，您将不得不用.highlight代替.codehilite ，以便与Jekyll一起工作。）
我做了类似的事情，但在我的情况下，简单的复制和粘贴不起作用。 错误消息如下：
REXML could not parse this XML/HTML:
为了避免这个错误，我从复制源中删除了allowfullscreen ，如下所示：
<iframe width="480" height="360" src="http://www.youtube.com/embed/WO82PoAczTc" frameborder="0"> </iframe>
在closures</iframe>之前添加一个空白是非常重要的。
然后，我成功地将videoembedded到我的网站。
插入YouTubevideo的html代码可以在Jekyll中使用一个简单的插件来生成，如https://gist.github.com/1805814所述; 。
语法变得如此简单：
{% youtube oHg5SJYRHA0 %}
在我的情况下问题已经解决与jQuery：
jQuery的
$('.x-frame.video').each(function() { $(this).after("<iframe class=\"video\" src=\"" + ($(this).attr('data-video')) + "\" frameborder=\"0\"></iframe>"); });
用法
<div class="x-frame video" data-video="http://player.vimeo.com/video/52302939"> </div>
请注意， <div> </div>之间需要空格
WordPres的一个更好的function是，你可以在内容中粘贴一个Youtube URL（在一个新的行），WordPress将它转换成一个embedded代码。
下面的代码对于Jekyll来说是一样的。 只要把这个代码放在你的页脚（或者使用一个Jekyll include），所有带有JUST URL的段落都会自动转换为由Vanilla JS提供的响应式Youtubeembedded。
<style> .videoWrapper {position: relative; padding-bottom: 56.333%; height: 0;} .videoWrapper iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;} </style> <script> function getId(url) { var regExp = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/; var match = url.match(regExp); if (match && match[2].length == 11) { return match[2]; } else { return 'error'; } } function yt_url2embed() { var p = document.getElementsByTagName('p'); for(var i = 0; i < p.length; i++) { var pattern = /^((http|https|ftp):\/\/)/; if(pattern.test(p[i].innerHTML)) { var myId = getId(p[i].innerHTML); p[i].innerHTML = '<div class="videoWrapper"><iframe width="720" height="420" src="https://www.youtube.com/embed/' + myId + '?rel=0&showinfo=0" frameborder="0" allowfullscreen></iframe></div>'; } } } yt_url2embed(); </script>
虽然只需将HTML代码添加到Markdown中是一个非常好的有效解决scheme，但此解决scheme可能更加便于用户使用。
资料来源： http ： //jekyllcodex.org/without-plugin/open-embed/
