Twitterの公式ツイートボタンをMTのインデックスページに設置する方法

2010/8/14 13:34

Twitterからウェブページに貼りつけるための公式ツイートボタンが公開されています。

英語版インタフェースであればフッターの「Goodies」のところから飛べますが、日本語版だとまだ上記リンクを直接開かないといけないようです。

さて、この公式ツイートボタンをブログのインデックスページやそのほか複数の記事が表示されているページに貼ろうとするときは、ちょっと手動でカスタマイズしてあげないといけません。

生成されるコードを見てみると、アンカータグの属性に「data-url」や「data-text」やらが設定されてそれを元にツイートボタンの動作が決められているようなので、MTのインデックスページに設置する場合は以下のように記述するといいです。

<a href="http://twitter.com/share" class="twitter-share-button"
 data-url="<$MTEntryPermalink$>"
 data-text="<$MTEntryTitle escape="html"$>"
 data-count="horizontal" data-via="あなたのユーザー名"
 data-related="ツイート後に表示させたい関連ユーザー"
 data-lang="ja">Tweet</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

data-url=”<$MTEntryPermalink$>” と data-text=”<$MTEntryTitle escape=”html”$>” のところが手動で設定した部分。見やすくするために改行を入れていますが、改行は不要です。

ツイートボタンのページ上でもカスタマイズ可能ですが、「escape=”html”」のダブルクォーテーションがエスケープされてしまうので気をつけてください。「あなたのユーザー名」と「関連ユーザー」の部分はきちんと自分のものを設定してください。

実際に設置されている様子はブログのトップページをご参考に。