ツイッター公式の「ツイートボタン」を設置してみる

2010/08/13 12:10

チャットのようなミニブログ【ツイッター(Twitter)】で、自分のアカウントを使った書き込みを「ツイート(つぶやき)」と呼ぶ。一般のブログやウェブサイトを巡回している最中に「この記事いいナ」と思ったら、すぐにその気持ちをツイッター上で表現できるよう(、そしてそのツイートを読んだ人がその記事に足を運んでくれるよう)手助けしてくれるのが「ツイートボタン(つぶやきボタン)」。これまでは【個別記事にちょっとシャレた「つぶやきボタン」を設置してみた】で紹介した「TOPSYボタン」のように、サードパーティーによるものが広く使われていたが、2010年8月13日に公式のツイートボタンが公開された。今回はこれを紹介する(【公式ブログでの発表】【ツイートボタンのコード配布ページ】)。

スポンサードリンク


指示に従い選択するだけ
コード配布ページには次のような説明がある。

このボタンをあなたのWEBサイトに表示すれば、ユーザーはあなたのサイトを離れることなく、あなたのWEBサイト上のコンテンツをTwitter上で共有することができます。TwitterからあなたのWEBサイトへとトラフィックを呼び込むのと同時に、戦略的なTwitterアカウントをユーザーにおすすめすることができます。

ライブドアブログやココログのような主要ブログサービスでは、それぞれ独自に「ツイートボタン」のコードなどを用意してあるので、それを使っても一向に構わない。しかし「公式」であるために多くの人が利用する可能性が高いこと、そしてデザインが共用化されるため(それぞれのブログサービスやサードパーティーのボタンよりも)「ツイートボタンであると認識されやすい」、つまり使われやすいなどのメリットがある。

設置も非常に簡単。コード配布ページで、選択肢を順番に選んでいけば、自動的にコードが生成される。

↑ ボタンのスタイルの選択。サイトのデザインや配置場所で変えよう。
↑ ボタンのスタイルの選択。サイトのデザインや配置場所で変えよう。

↑ ツイート内テキストの変更。通常は変更の必要なし。下側を選んでテキストを入力すると、どんなページでも同じテキストになってしまう。
↑ ツイート内テキストの変更。通常は変更の必要なし。下側を選んでテキストを入力すると、どんなページでも同じテキストになってしまう。

↑ 初期表示するツイート内容。これも上のままでOK。
↑ 初期表示するツイート内容。これも上のままでOK。

↑ 言語選択。仮に日本語以外のブログやサイトに導入するのなら、その言語を選ぶ。通常は日本語のまま。
↑ 言語選択。仮に日本語以外のブログやサイトに導入するのなら、その言語を選ぶ。通常は日本語のまま。

↑ フォローするためのおススメのユーザー……とあるが、ツイッターにログインした状態でコードを発行すると、自動的に「1.」の部分には自分のアカウント名が入る。
↑ フォローするためのおススメのユーザー……とあるが、ツイッターにログインした状態でコードを発行すると、自動的に「1.」の部分には自分のアカウント名が入る。

最後の「2.フォローするためのおススメのユーザー」は少々説明を要する。ツイッターのアカウントでログインした状態でこのコード発行作業を行うと、自動的に自分のアカウント名が入る。そしてそのアカウント名は、発行されたボタンを使ってツイートした時に「@アカウント名」で合わせて表記されることになる。つまりボタン設置側が「自分宛ての発言」をチェックする際に、このボタン経由でツイートされたものを確認できるという次第だ。

↑ 自分から自分宛てで間抜けだが、このツイートボタンでツイートした場合、赤い四角で囲った部分に上の段で設定した(通常はコード発行者のアカウント)アカウントが表記される。発行側は「自分宛てのツイート一覧」で、ツイートしてもらったもののチェックができる次第。
↑ 自分から自分宛てで間抜けだが、このツイートボタンでツイートした場合、赤い四角で囲った部分に上の段で設定した(通常はコード発行者のアカウント)アカウントが表記される。発行側は「自分宛てのツイート一覧」で、ツイートしてもらったもののチェックができる次第。

二段目はツイートが終わった後に「こんなアカウントもあるよ、フォローしてみないか?」とおススメするもの。例えばサークル活動の報告ブログで使うなら、自分以外の主要メンバーのアカウントを教えてあげたり、漫画家なら連載中の雑誌の公式アカウントを知らせるという具合。

↑ おススメなアカウントを設定していた場合、未フォローの人がボタンを使うと、このようなウィンドウが開く。
↑ おススメなアカウントを設定していた場合、未フォローの人がボタンを使うと、このようなウィンドウが開く。

なおボタンを使った人本人がすでにその人をフォローしていた場合には何の反応もせず、未フォローの場合にのみ特別のウィンドウが開く仕組みとなっている。

発行されたコードをぺたり、と貼り付ける
これらの設定をし終えたら、あとは画面下の部分に表示されるコードをコピーして、自分のブログのテンプレートやウェブサイトの好きな所に貼り付けるだけ。左側には「こんな形になりますよ」というプレビューも表示されるので、チェックをしておくとよいだろう。

↑ 発行されたコードをコピーして、サイトやブログに貼り付ければ準備終了。
↑ 発行されたコードをコピーして、サイトやブログに貼り付ければ準備終了。

興味深いのはこの発行コードが、どのようなブログ・サイトにおいてもそのまま使えること。サードパーティ提供のコードの場合、ブログのテンプレートに収めるにはそのブログの個別URLを表すタグ(例えば<$MTEntryPermalink$>のような)を自前で入れる必要があったが、その手続きは不要。これは非常に便利でありがたいお話。

当方では旧サイトには大きめの「垂直方向にカウント数を表示」ボタン、新サイトでは「水平方向にカウント数を表示」の小さめなボタンを使ってみた。

↑ 当サイトでの使用例
↑ 当サイトでの使用例

なおカウント数の部分をクリックすると、該当ページのURLを対象とした検索が行われ、一覧が表示される。

↑ カウント数をクリックした結果。当ツイートボタン経由以外のも表示されてしまう。
↑ カウント数をクリックした結果。当ツイートボタン経由以外のも表示されてしまう。

画像をよく見ればお分かりの通り、当ツイートボタンから発せられたツイートは「Tweet Buttonから」と表記される。



今ページで取得できるコードによるツイートボタンは大きさも色も変更は不可能。ただし開発用のAPIドキュメントも公開されているので、今後色々なスタイルのものが登場するかもしれない(ただし上記で解説した「ツイートボタンであると認識されやすい」という点では、このまま利用した方がよいのだろう)。

ソーシャルメディアとしてはすでにFacebookがLikeボタンなどを提供しているし、今後はmixiも同様のボタンをリリースするかもしれない、という噂もある。一方この公式ツイートボタンが今後、色々と飛躍発展する可能性も否定できない(例えば星マークで5段階評価が出来るとか)。今後の動向にも目が離せないところだ。

スポンサードリンク




▲ページの先頭に戻る    « 前記事|次記事 »

(C)2005-2017 ガベージニュース/JGNN|お問い合わせ|サイトマップ|プライバシーポリシー