Hugoのshortcodesでnicovideoの埋め込みを簡単にする

  • 2
    Like
  • 0
    Comment
More than 1 year has passed since last update.

はじめに

ブログにも書いた記事の転載です。

Hugoにはshortcodesという仕組みで、カスタムタグみたいなことを実現できるみたいです。
そこで、ニコニコ動画の動画サムネイルやプレイヤーの埋め込みを行うshortcodesを書いてみました。

動画サムネイル

layouts/shortcodes/nicovideo.htmlとして、以下をおきます。

<iframe width="312" height="200" src="http://ext.nicovideo.jp/thumb/{{ .Get 0 }}" scrolling="no" style="border:solid 1px #CCC;" frameborder="0">
</iframe>

記事のMarkdownでは以下のように書きます。

{{<nicovideo sm9 >}}

動画プレイヤー

同じnicovideoにして、ifで分岐させようと思ったのですが、色々やってもうまくいかなかったので別の名前のshortcodesにしちゃいました。

{{ $sm := .Get 0 }}
{{ $url := printf "http://api.ce.nicovideo.jp/nicoapi/v1/video.info?v=%s&__format=json" $sm }}
{{ $dataJ := getJSON $url }}
{{ $title := $dataJ.nicovideo_video_response.video.title }}
<script type="text/javascript" src="http://ext.nicovideo.jp/thumb_watch/{{ $sm }}?w=490&amp;h=307"></script>
<noscript><a href="http://www.nicovideo.jp/watch/{{ $sm }}">{{ $title }}</a></noscript>

使い方はこう。

{{<nicovideoplayer sm9 >}}

変換結果

ブログの方を参照してください。