F.Ko-Jiの「一秒後は未来」

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

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

» Twitter / Tweet Button

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

twitter-official-tweet-button.gif

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

生成されるコードを見てみると、アンカータグの属性に「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”」のダブルクォーテーションがエスケープされてしまうので気をつけてください。「あなたのユーザー名」と「関連ユーザー」の部分はきちんと自分のものを設定してください。

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

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

著者について

fkoji

F.Ko-Ji

Webエンジニアやってます。最近は ドットインストール の開発がお仕事です。その傍ら、個人で Meity電車遅延なう梅酒.in#グラドル自画撮り部 の部室といったネットサービスを開発・運営してます。梅酒と草野球とリアル脱出ゲームが好きです。

» 詳しいプロフィールや運営サービスの一覧など