QiitaでSlideShareをいい感じに表示する

Qiitaにプレゼン資料埋め込みたいときってありますよね。こんなかんじで。

(画像です)

でもQiitaではできません。不可能です。 なぜならSlideShareのoEmbedに対応していないのです。

oEmbed

OEmbed Documentation

WordPress等SlideShareの埋め込みができるものは、たいていこのoEmbed APIを利用して埋め込みを実現しています。

なんで対応しないんでしょうね。不思議です。

でも今の所何がなんでも普通の埋め込みは実現できないので、他の方法を考える必要があります。

最善の策…を考えると、表紙画像のリンクではないでしょうか。

こんな感じ。というかここにあります。

LT資料まとめ – Qiita

結構いい感じではないでしょうか?

これを実現するのに結構手こずったので手順を書いておきます。

oEmbed APIを叩く

先に載せたSlideShareのDocumentationにも載っていますが、以下のような感じです。

https://www.slideshare.net/api/oembed/2?url=[スライドのURL]

ここにブラウザでアクセスします。

スライド1枚目の画像のURLを取得

するとこんな感じの部分があります。

これでどうするかといいますと、この情報からスライドの1枚目の画像ファイルがあるURLを作り出します。

スライド1枚目の画像URLは以下です。

http:{slide-image-base-url}1{slide-image-baseurl-suffix}

つまりこの場合ですと

http://image.slidesharecdn.com/htm-170509021429/95/slide-1-1024.jpg

となります。

Markdownを作成

ここまでくれば簡単ですね。

画像にもとのURLをリンクさせればいいので、

[![thumbnail](画像URL)](SlideShareURL)

つまりこの場合だと、

[![thumbnail](http://image.slidesharecdn.com/htm-170509021429/95/slide-1-1024.jpg)](https://www.slideshare.net/EyesJapan/htm-75799436)

となり、

こんな感じです。

まとめ

oEmbed対応が待ち遠しいです。