はてなダイアリーの@Anywhere対応を試してみた
5/27にはてダがバージョンアップされましたが、
Twitter 連携機能の追加
- @Anywhere に対応
はてなダイアリーのバージョンアップを実施しました ― iPhone、Twitter、SEO、複数ブログ、応答改善など - はてなダイアリー日記
「@Anywhere に対応」ってなんじゃ？具体的になにができるんだ。
このエントリーは"はてなダイアリー"で@Anywhereを使う実験です。@Anywhereの紹介ではありません。通常のウェブページでの正しい使用方法は公式ドキュメント
あと実際の@Anywhere使用例として、私が地元のラジオ局のFmHaroリスナーの為に勝手に作った FmHaro!76.1 Unofficial Web CAMERA Beta
準備
自分のはてなダイアリーで@Anywhereを使うには、管理 - 設定 - 外部サービス連携 にある"Twitter@Anywhereを有効にする"にチェックを入れて変更ボタンを押す。
通常@Anywhereの機能を使うにはHTMLタグとscriptタグが必要になる。
はてなダイアリーでdivタグなどは使えるのでHTMLは問題ないとして、スクリプトはコードを表示して閲覧者にコピペして実行してもらうように促すしかないのかな。Hatena::Letを使ってもいいかも。
（これを回避する方法ある？nitoyonさんのflashのブログパーツからjs実行できたっけ？）
@Anywhereで出来ること
- Auto-linkification of Twitter usernames
- Hovercards
- Follow buttons
- Tweet Box
- User login & signup
では順番に試していきます。
毎回コピペするのがメンドクサイ人向けに、これ以降に現れるブックマークレットをまとめました。以下のコードをアドレスバーに貼り付けてエンターを押して下さい。
javascript:twttr.anywhere(function(T){T('#follow-me').followButton("cherenkov");T("#login").connectButton();T("#entry_tbox").tweetBox({height:100,width:400,defaultContent:document.title+" "+location.href});});
Auto-linkification of Twitter usernames と Hovercards
@マークの後にtwitter IDを書いて投稿すると、自動でtwitterにリンクされて、カーソルを合わせた際にはHovercardsがポップアップ表示される。
↓
@cherenkov
Follow buttons
ワンクリックでフォローすることができるボタンを表示する機能。
@Anywhereが公開される以前から画像にリンクを貼っただけのボタンや、hovercardsからも同様なことができますが選択肢が増えることはいいんでしょうね。
エントリーに以下のようなタグを書き込んで投稿する。矢印の下にこのタグを埋め込んであります。
<div id="follow-me"></div>
スクリプトは閲覧者にコピペ実行してもらう。
javascript:twttr.anywhere(function(T){T('#follow-me').followButton("cherenkov");});
↓
User login & signup
twitterのログイン状態を表示する。
エントリーに以下のようなタグを書き込んで投稿する。
<div id="login"></div>
javascript:twttr.anywhere(function(T){T("#login").connectButton();});
↓
Tweet Box
OAuth認証によって全てのウェブページからつぶやきを投稿することができる機能。
エントリーに以下のようなタグを書き込んで投稿する。
<div id="entry_tbox"></div>
（idではなくclassにして複数のTweet Boxが表示されるか確認したところ、一つしか正しく表示されなかった。）
javascript:twttr.anywhere(function(T){T("#entry_tbox").tweetBox({height:100,width:400,defaultContent:document.title+" "+location.href});});
↓
実際にここからつぶやくことも可能。しかし同様のことは新機能のひとつ「このエントリーについてTwitterに投稿する」ボタンから行うことができる。
まとめ
ここまではてダ上で@Anywhereを一通り試してみましたが、そもそもは はてなダイアリー日記にあった「@Anywhere に対応」ってなんのこっちゃと思ったことが発端です。これは正しくは「@Anywhereの"Auto-linkification of Twitter usernames"と"Hovercards"に対応」がいいと思います。
