ネットサービスの開発に役立ちそうな話題を中心にお届けします。
F.Ko-Jiの「一秒後は未来」 > Twitter(ツイッター) > Twitterの公式ツイートボタンをMTのインデックスページに設置する方法
2010年08月14日 13:34
544日前に投稿

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

  • ... PV
  • このエントリーをはてなブックマークに追加

スポンサード リンク

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"」のダブルクォーテーションがエスケープされてしまうので気をつけてください。「あなたのユーザー名」と「関連ユーザー」の部分はきちんと自分のものを設定してください。

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

スポンサード リンク

Written by
関連エントリーはこちら
お探しの情報が見つからない場合はサイト内検索もお試しください。
Meity.jp - Twitterなかまでプライベートなオフ会を開催したいなら


トラックバック

このエントリーのトラックバックURL:

この一覧は、次のエントリーを参照しています: Twitterの公式ツイートボタンをMTのインデックスページに設置する方法:

» Twitterの公式ツイートボタンをWordPressのトップページに設置する方法 from F.Ko-Jiの「一秒後は未来」
先ほどはMTについて書きましたが、方法は同じなのでついでにWordPressも。 WordPressのトップページに公式ツイートボタンを設置する場合も、同... [詳しくはこちら]

トラックバック時刻: 2010年08月14日 14:04

Twitter(ツイッター)

English version

2010/08/14 13:34:27 by F.Ko-Ji
コメント (0) トラックバック (1) Twitter(ツイッター)

前のエントリー: « 鶏肉を七輪で炙って食べられる「博多 自在」
次のエントリー: Twitterの公式ツイートボタンをWordPressのトップページに設置する方法 »

コピペにご利用ください。

タイトル:

URL:

リンク用HTMLタグ: