はてなブログにスライド（Speaker Deck / Slideshare）を貼る方法

「出来ない」ことが「出来るようになる」って超嬉しい♪

誰かの役に立つかどうかはわからないけど、はてなブログSpeaker Deckやslideshareのスライドを貼る方法がわかったので備忘メモ。（2014年1月時点）

仕組みをちゃんと理解したわけではないので、正しいかどうかは分からないけど、とりあえずできちゃった、的な。

しかし、なんなんですか。最近のBLOGは。機能豊富杉！複雑杉！

スライドひとつ貼るのに苦労しちゃいましたよ。

みんなやってるからサクっと出来ちゃうのかとおもったのにさ・・・orz

■Slideshareを貼る（これはすぐ出来た。）

＜手順１＞

Slideshareのサイトで、貼りたいスライドのEmbedから以下のようなコードを取得

<iframe src="http://www.slideshare.net/slideshow/embed_code/▲▲▲" ・・・・・・・</div>

長いのですがそのままコピペでOK

Slideshareのサイト上でスライドの表示サイズとかもカスタマイズできました

＜手順２＞

はてなブログに埋め込む（HTML編集）

以上。あら簡単。

■Speaker Deckを貼る（ちょっと困ったぞ！）

グーグル先生に聞いても情報が少なく、いくつか上手くいく方法があったが、一番簡単なやつ。とりあえずSlideshareみたいに簡単にコピペだけでは上手くいかず・・・

＜手順１＞

Speaker Deckのサイトで、貼りたいスライドのEmbedからdata-id値を取得

Share　→　Embed　→　Popup画面

f:id:uhe_uhe_uhe:20140124005547p:plain

＜手順２＞

下記Scriptの■■■を取得した data-id値で置き換える

<script src="http://speakerdeck.com/embed/■■■.js"></script>

＜手順３＞

はてなブログに埋め込む（HTML編集）

以上。

しかし、このSpeaker Deckのスライドを貼るのに年を跨いでしまって（ぉぃ！）、それでしみじみ思ったこと。

Web技術もドンドン進化していて、ボーっとしているとBLOGにスライド貼ることすら、なんでこう書いたら上手くいくのに、これだと上手くいかないのか、とか分からない！

SlideshareはPHP＋Flashで、Speaker DeckはRubyなんだって。へぇーーー

ま、ともかく、このBLOG初めて１か月以上たってみて、Webを通じての自己発信ってイイなって思い始めたので、徐々に、ゆる～ぅぅりと、自己紹介とか記事を充実させていこうとおもいます。

■参考記事

部屋とネルシャツと私