{"componentChunkName":"component---src-templates-single-template-tsx","path":"/como-incluir-videos-do-youtube-no-jekyll","result":{"data":{"site":{"siteMetadata":{"siteUrl":"https://blog.nandomoreira.dev","author":{"name":"Fernando Moreira","site":"https://nandomoreira.dev","social":{"disqus":"fernandomoreira"}}}},"markdownRemark":{"html":"

Criar plugins para Jekyll é bem simples e fácil, basta criar seu arquivo .rb dentro do diretório _plugins.

\n

Hoje vamos usar um plugin bem bacana para incluir vídeos do Youtube no seu blog Jekyll sem precisar copiar e colar o iframe do youtube, apenas usando o ID do vídeo.

\n

O arquivo youtube.rb

\n

Crie um arquivo chamado youtube.rb dentro do diretório _plugins e coloque o código abaixo:

\n
class YouTube < Liquid::Tag\n  Syntax = /^\\s*([^\\s]+)(\\s+(\\d+)\\s+(\\d+)\\s*)?/\n\n  def initialize(tagName, markup, tokens)\n    super\n\n    if markup =~ Syntax then\n      @id = $1\n\n      if $2.nil? then\n          @width = 560\n          @height = 420\n      else\n          @width = $2.to_i\n          @height = $3.to_i\n      end\n    else\n      raise \"No YouTube ID provided in the \\\"youtube\\\" tag\"\n    end\n  end\n\n  def render(context)\n    \"<iframe width=\\\"#{@width}\\\" height=\\\"#{@height}\\\" src=\\\"http://www.youtube.com/embed/#{@id}?color=white&theme=light\\\"></iframe>\"\n  end\n\n  Liquid::Template.register_tag \"youtube\", self\nend
\n

Exemplo de uso:

\n

Como eu falei logo acima, é bem simples, apenas com uma linha curta você inclui o iframe do youtube no HTML final do Jekyll.

\n
{% youtube 8SbUC-UaAxE %}
\n

Você também pode especificar uma altura e largura do iframe. Se você não usar o padrão é de 560 x 420.

\n
{% youtube 8SbUC-UaAxE 850 460 %}
\n

Conclusão

\n

Bom, na verdade copiar e colar o iframe do Youtube não é tão difícil assim (HUE), mas eu NÃO gosto muito de misturar HTML com Markdown enquanto estou escrevendo um post, mas em alguns casos é necessário.

\n

\n \n