tips!

最近続々と「リニューアルした～」というツイートが流れてくるのでちょっと話題に乗っかってみます。
ツイート埋め込みとはなんぞや、かと言うとこんな代物 ↓ です。

This Tumblr Tuesday! Illustrator Richey Beckett, The Kennedy Center, Ballerina Project, Our Valued Customers: tmblr.co/ZE5FbyG1_brF

— Tumblrさん (@tumblr) 2月 7, 2012

こちらはTumblr公式アカウントのツイート。
画像ではなく実際にTwitter側のスクリプトによりリンクその他諸々が繋がってます。

TumblrにTwitter関連持ってくるならlinkかquoteでいい気もしますが、
Tumblrでも埋め込みできるんかな～と思って試したらいろんなポストタイプで出来たので、その覚書です。

【目次】

1. 【前説】ツイートの埋め込みについて
2. ツイートが埋め込めるポストタイプ
3. Tumblrにツイートを埋め込む
4. 埋め込まれたツイートの様々な表示

1．【前説】ツイートの埋め込みについて

基本の埋め込み方については公式ガイドの冒頭部分＆以下のサイトさんを参考にしてみてください。

• Twitter公式：Embedded Tweets | Twitter Developers
• Twitterのリニューアルに関して地味にすごいな、と思った4つのポイント | IDEA*IDEA

「ツイート 埋め込み」で検索でも沢山の紹介記事が出てくるので、自分でいろいろ探ってみるのもおすすめ。
ここではTumblrへの埋め込み方法を書いていきます。

2．ツイートが埋め込めるポストタイプ

ツイートはTumblr公式アカウントからちょっとお借りします。
まずは「このツイートをサイトに埋め込む」から、HTML形式のコードを取得。

     

配置はお好みで。ちなみに冒頭に貼ったものは「センター」です。
そしたらいよいよ埋め込み。
以下のポストタイプで埋め込みが可能です。あんまりにいろんなタイプで出来たので驚き。

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－

• テキスト（text）,画像（photo）,引用（quote）,リンク（link）,音声（audio）,動画（video）

－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－－
※確認分のみ。

どういうこっちゃかというと、項目3で解説しますが投稿欄に「HTMLソース編集」があるポストタイプなら
どうやらどれでもいけるっぽいんですね。
大体以下のようなイメージです。

     
     
     
     

3．Tumblrにツイートを埋め込む

各ポスト投稿欄の「HTMLソース編集」を開いて、目的のツイートのコードをコピペ、更新して保存するだけです。らくちん

     
                     　　　　　　　　　　　　↓      ↓      ↓

     


投稿欄上では引用をしたときのような表示がされます。
この引用状態のままポストしないとうまくいかないので注意。

     

これでTumblrへのツイート埋め込み完了です。

4．埋め込まれたツイートの様々な表示

例えば画像を添付したツイートを埋め込むと、画像も一緒についてきます。
同じくYouTubeなど、動画のURLを貼ったツイートならついでに動画も表示されるといった具合。

     
     


これはTumblrとTwitterの連携の一つとしてありじゃないかなーと。
TumblrではポストしたことをTwitterへ知らせることが出来ますけども、その逆バージョンみたいなもんでしょうか。

TumblrやるならTomblooなどを使ってヒョイヒョイポストするのが相場だと思うのであまり需要ないかもですが、
取り合えずTumblr ⇔ Twitter間でこういうことできたよ～という小話でした。