概要
Hugoには短いスニペットを書くと本文中にテンプレートを展開してくれるShortcodesという機能がある。
定型文をテンプレ化しておくために使えるのはもちろん、Hugoは本文中に生HTMLを書けないので、iframeで他のサービスの内容を投稿に埋め込みたい時とかにも使うことになる。
TwitterやYouTube等よくあるものはHugo自体に組み込まれているのだが、Spotifyを埋め込めるものがなかったので書きました。
使い方
この内容をコピペして自分のサイトディレクトリの layouts/shortcodes/ に spotify.html という名前で置く。
Spotifyのプレイヤーを表示したい箇所に以下のように書く。
typeとidは必須。typeは album/track/playlist/artist のどれかならいけるはず。
idはSpotifyから対象の埋め込みコードを取得してみれば分かる。
widthとheightは省略しても大丈夫。デフォルト値は上記コードを見てください。
{{< spotify type="album" id="5vqILcEeCT0N1DeJBsLrGE" width="100%" height="250" >}}
パラメータ名は省略してもよい（その場合は順番に気をつけて）。
{{< spotify "album" "5vqILcEeCT0N1DeJBsLrGE" "100%" "250" >}}
すると以下のように表示される。
簡単なものですがよかったら使ってください。
余談ですがshortcodeをエスケープしてそのまま表示するのに少し手間取った・・・。
対策はこちらで見つけました。
Escaping Hugo shortcodes