2010年9月9日木曜日

Twitter @Anywhere をためしてみる。

Twitterの@Anywhereを試してみた。どうやら自分のサイトにTwitterの機能を実装するAPIらしく、Twitterと連携するサイトを作る手助けをするものっぽい。

既存のTwitter APIとの違いで目につくのは「OAuth認証じゃなくAPI Keyを用いる」「JavaScript」「ドメインで認証している」くらいかな?


使い方は非常に簡単で、 JavaScript「http://platform.twitter.com/anywhere.js?id=あなたのAPI KEY&v=1"」を読み込んだ後、 お好みで下記のようなソースコードを書けばページ内のTwitter IDぽいもの(@のあとに英数字が続いてる部分、たとえば @yosilove とか)を探し出し、Twitterへのリンクを張り、ついでにマウスでポイントしたときに情報が表示されるようにしてくれる。


// @Anywhere を初期化。初期化完了後は onAnywhereLoad を呼ぶ
twttr.anywhere(onAnywhereLoad);

// @Anywhere 初期化コールバック。こっからいろいろ呼び出す。
function onAnywhereLoad(twitter){
  /*初期設定*/
  //myTwitter = twitter; // オレ達用に @Anywhere から授けられた Twitter オブジェクトを保存しておく。

  //@xxxにTwitterへのリンクを張る
  twitter.linkifyUsers();
  //@xxxの情報をポップアップで表示
  twitter.hovercards(); //Twitter IDをみつけると、ユーザ情報を表示する

  //以下、やりたいこと書いていく
}
これとは別にTwitter Antwhereを使うサンプルスクリプトを書いてみたのでよかったら見てみてください。


サンプルスクリプトの設置方法

とりあえず、Wellcome to @Anywhereからアカウント作成。注意すべきなのは「アクセス権をread and Writeにすること」と「コールバックURLを”スクリプトをおくサイト”」にすること。(このブログでいう「http://yosilove.blogspot.com/」)

そしてどっか適当なところ(たいていはhead)で「APIの読み込み」と「サンプルスクリプトの引数の設定」と「サンプルスクリプトの読み込み」をする。
<script src="http://platform.twitter.com/anywhere.js?id=API KEY&v=1" type="text/javascript">
</script>
<script type="text/javascript">
<!--
//変数をいくつか指定しておく。
var my_twitter_id='followボタンでフォローさせたいユーザの名前';
// -->
</script>
<script src="http://my-sample-files.googlecode.com/svn/trunk/site-script/twitter-anywhere/my-anywhere.js" type="text/javascript">
</script>
あとはスクリプトに書いてあるコメントにしたがい、ページ内の好きなところに
<span id="follow-buttom"></span>
と書いてフォローボタンを表示したり
<span id="twitter-connect"></span>
とかいてコネクトボタンを表示したりしてみてね。


表示サンプル

フォローボタン


コネクト


ツィートぼっくす


0 comments:

コメントを投稿