記事書くのにあたっていろんなものを貼り付けると思うので動作確認も兼ねて色々外部サイトを埋め込んでみるテスト
URL
https://blog.seeds-9.com/post/hello-world/
OGPあっても出ない
Misskey Notes
https://a19n.seeds-9.com/notes/9teyk5ygdv8u001j
Missbed使用
Missbedを使うとTLやノートを埋め込めるらしい。フォントがちょっとおかしいのと、縦幅をよしなにしてくれないので使い方が難しい。
Youtube
https://www.youtube.com/watch?v=qU9QJGhGXpY
Youtubeはショートコードが既にある。スタイルがちゃんと当てられていてコンテンツ幅に応じて拡縮するので、こちらを使えということだろう。
Bandcamp
Album
https://dccd.bandcamp.com/album/punctuated-equilibruim
横型
横型（トラックリストあり）
縦型
Song
https://dccd.bandcamp.com/track/multiverse
アルバムとの差が分かりづらすぎる
Soundcloud
画像がガビガビなのはこのサイズの素材しかもう手元に残っていなかったからなので、Soundcloudくんのせいではない。
https://soundcloud.com/czk/battery-music-04
Spotify
Song
https://open.spotify.com/intl-ja/track/2Mu8Vqlv8BzH62cbkuJijX?si=b060194a1e6d488b
Album
https://open.spotify.com/intl-ja/album/3zEZr24E4kHUaE74lVzoPU?si=bIyxGFORSmqWGTFqni1zJQ
ひとまず
URL貼るだけではそのままリンクになるだけだった。そりゃそうか。他は自分でショートコード作れば、ということらしい。iframe貼るのが面倒過ぎるようだったら考えるか。作ってもいいけどテーマによって意匠が異なるから全然汎用性ないなってなるとブログのネタにもならないから今のところはあまり食指は動かない。
とはいえiframeで横幅がピクセル指定のコードを貼り付けると当然ながらレスポンシブに対応しないのでモバイル表示時とかに死ぬ。そのへんをケアするとなると、CSSだけでも用意しないと駄目かもしれない。
https://gohugo.io/templates/shortcode-templates/
MisskeyのノートはURL貼るだけで勝手にパースしてショートコード展開する、みたいな挙動だと思うけどあれは楽でよかったな。
Photo by: Pixabay