iPhoneからツイッターのツイートをブログに貼り付けられるようにするブックマークレット。

2013年6月13日追記:Tweet2HTMLは公開終了しました。詳しくはTweet2HTML公開終了とその後の対策について。【動画あり】をご覧ください。

2012/01/22追記

検索エンジンなどでこのページにたどり着いたみなさまへ。

ブックマークレットの最新版はブックマークレット | Feelingplaceに置いてあります。

大変お手数ですが、上記のリンク先をご覧いただきますようお願いいたしますm(_ _)m

以上、追記終わり。


やっぱりiPhoneからブログを書くのが大好きな@feelingplaceです。

以前、ネタフルさんで紹介されていたBlackbird bookmarkletというのをご存じでしょうか。

[N] 「BlackBird bookmarklet」ツイッターのツイートをブログに貼り付けられるようにするブック

これはその名の通り、ツイッターのツイートをブログに貼りつけられるようにするブックマークレットなんですね。

ただ、残念なことが1つ。そうです。iPhoneでは使えないんです。

BlackBird bookmarkletをiPhoneで使うとどうなる!?

まずはiPhoneのSafariでツイートを表示してみましょう。

垢BAN王子、@norirowさんがまたダメージを受けていますね(^_^;

このツイートのURL、mobile.twitter.comになっているのがわかると思います。

01 ツイートURLがmobile
01 ツイートURLがmobile Photo by feelingplace

ここで、BlackBird bookmarkletを起動します。すると…

02 BlackBird bookmarklet起動
02 BlackBird bookmarklet起動 Photo by feelingplace

なんと!!twitter.comで起動してくれ!と怒られてしまいます(T-T)

03 ブックマークレットに怒られる
03 ブックマークレットに怒られる Photo by feelingplace

これでは、iPhoneでツイートのHTMLタグを取得することはできません。

そこで、思い出したのがこの記事。

Twitterの引用ツールの決定版!Blackbird Pieのかわりに、公式で強力な引用ツールが実装されていた件 | 想造ノート

公式サイトのツイートの詳細画面ではEmbed this Tweetをクリックすると、

公式サイト ツイートの詳細
公式サイト ツイートの詳細 Photo by feelingplace

このようにHTMLが取得できるんですが、iPhoneにはまだEmbed this Tweetは表示されていないんですよね。

Embed this Tweet
Embed this Tweet Photo by feelingplace

そこで公式サイトの情報(Embedded Tweets | Twitter Developers)が載っていたんで辿っていくと、何とかブックマークレット化できそうな気がしたので、とりあえず作ってみました。

名前はTweet2HTMLとでもしておきましょう。

Tweet2HTMLでできること。

では、Tweet2HTMLでできることをスクショで見ていきましょう。

もう1度、垢BAN王子がダメージを受けているツイートに戻ります。

01 ツイートURLがmobile
01 ツイートURLがmobile Photo by feelingplace

ここで今回紹介するブックマークレット、Tweet2HTMLを起動すると…

04 今回紹介するブックマークレットを起動
04 今回紹介するブックマークレットを起動 Photo by feelingplace

プロンプトにツイートのHTMLタグが表示されます。

あとはコピーしてお好きなエディタで加工するだけ。

05 HTMLタグを取得
05 HTMLタグを取得 Photo by feelingplace

ちなみに今回取得するHTMLタグは先程紹介した公式サイトのHTMLに準拠しています。

で、毎度おなじみのTextforceへ貼り付けてプレビューしてみると…

06 Textforceに貼付
06 Textforceに貼付 Photo by feelingplace

こんな感じになります。これはJavaScriptが無効になっている状態になります。ブログを書く側としては、ツイートがBlackBird bookmarkletで取ってくるHTMLよりも内容がわかりやすいのでいいですよね。

07  プレビュー
07 プレビュー Photo by feelingplace

これをブログに貼り付けると以下のようになります。

こんな感じでHTMLタグをiPhoneでも取得することができます。ただ、これってあまり現実的な方法ではないですよね。だって、Twitterは普段アプリで見ているから。

そこで、もう1つの方法。

これはアプリでできるできないがあるかも知れませんが、ボクが普段使っているTweetlogixでの例をご覧ください。

まずはアプリでツイートの詳細画面まで行きます。

08 ツイートを表示
08 ツイートを表示 Photo by feelingplace

Tweetlogixの場合、ここでツイートを長押しするとメニューが表示されるので、Copy Linkをタップ。

09 ツイートのURLをコピー
09 ツイートのURLをコピー Photo by feelingplace

先程のブックマークレットをどこでもいいので起動してください。すると、ツイートのURLを入力するよう求められますので、

10 Twitterサイト以外で起動するとURLの入力を求めます
10 Twitterサイト以外で起動するとURLの入力を求めます Photo by feelingplace

さっきコピーしたツイートのURLを貼り付けてOKをタップしてください。すると…

11 プロンプトにツイートのURLを入力
11 プロンプトにツイートのURLを入力 Photo by feelingplace

同じようにちゃんとHTMLタグを取得することができました(^^)

12 HTMLタグを取得
12 HTMLタグを取得 Photo by feelingplace

このようにTweet2HTMLでは、

  1. ツイートのURLが表示されていればそのツイートのHTMLタグを取得
  2. ツイートのURLが表示されていなければツイートのURLを入力することでそのツイートのHTMLタグを取得

することができます。

もちろん、これはiPhoneだけでなく、デスクトップからでも利用することが可能です。

Tweet2HTMLのブックマークレットメーカーはこちら。

Tweet2HTMLのブックマークレットメーカーはこちらになります。

Tweet2HTMLメーカー

設定項目を確認しておきましょう。

Tweet2HTMLメーカー
Tweet2HTMLメーカー Photo by feelingplace

  1. ブックマークレット名:お好きな名前を入力してください。
  2. 出力方法:6種類の中から選択してください。
  3. 書式テンプレート:変更するとHTMLタグの取得ができませんのでご注意ください。

設定を終えたらBookmarkletを生成するボタンをポチッとします。下にスクロールすると、

Tweet2HTML完成
Tweet2HTML完成 Photo by feelingplace

上の画像のようにブックマークレットのリンクができているので、お好きなところへ登録するだけです。

これでiPhoneからもツイートをブログに貼り付けることができる!!

WordPressではTwitter ブラックバード・パイプラグインがありましたけど、これならプラグインの必要もありません。

現時点では公式サイトのようにAlignmentの設定はできませんが、またそれはおいおいできればいいなと思います。

使ってみて気になる点があれば@feelingplaceまで教えていただければ幸いです。

それでは、よりよいモブログライフを!!

この投稿へのコメント

コメントはありません。

メッセージをどうぞ!!

この投稿へのトラックバック

  1. iPhoneからツイートをブログに貼れるブックマークレット! | masayan's STYLE said on 2012年1月16日 at 9:04 PM

    […] iPhoneからツイッターのツイートをブログに貼り付けられるようにするブックマークレット。 | Feelingplace […]

  2. iPhoneからツイッターのツイートをブログに貼り付けられるようにするブックマークレット。 | Feelingplace | iPhone-feed.info said on 2012年1月16日 at 10:06 PM

    […] クマーク新着情報です。 iPhoneからツイッターのツイートをブログに貼り付けられるようにするブックマークレット。 | Feelingplace […]

  3. 何やらTweetをBlogに簡単に貼り付けられるということなのでTweet2HTMLを試してみた | 病院で働くおとうさん〜iPhoneもよろしく|imuzio's Blog said on 2012年1月17日 at 11:04 PM

    […] iPhoneからツイッターのツイートをブログに貼り付けられるようにするブックマークレット。 | Feelingplace ブックマーク追加した。 RT @feelingplace: ブログ書いた。: iPhoneからツイッターのツ […]

  4. […] […]

  5. […] […]

  6. iPhoneからでもTwitterのつぶやきをブログに簡単に貼りつけられるブックマークレット 「Tweet2HTMLメーカー」 « らくがきちょう said on 2012年1月23日 at 12:01 PM

    […] iPhoneからツイッターのツイートをブログに貼り付けられるようにするブックマークレット。 | Feelingplace […]

トラックバック URL