辻本龍太

LABO

2010年 04月  7日

ムーバブルタイプにtwitterからのアクセス数を表示する retweet.js

twitter ツイッター

最近よく見かける自サイトにtwitterのretweetボタン。
気になって調べてみたら設置は結構簡単みたいなのでご紹介。

まずはじめにこのjavascriptの作者でもあるJohn Resigさんのサイトからjavascriptをダウンロードします。

retweet.jsのダウンロード

「retweet.js」こちらからダウンロードしていただけます。
http://ejohn.org/files/retweet.js

ダウンロード後、任意のフォルダにアップロードして下記ソースをヘッダーにを記載

<script src="http://~~~~~~.com/retweet.js"></script>

あとは、アクセス数を表示したい場所に以下を埋め込むだけ。

retweet.js 縦表示の場合

<a class="retweet vert self" href="<$MTEntryPermalink$>" target="_blank"><$MTEntryTitle$>をtwitterでつぶやく</a>

retweet.js 縦表示
縦表示の場合だとこういう感じで表示されます。

retweet.js 横表示の場合

<a class="retweet self" href="<$MTEntryPermalink$>" target="_blank"><$MTEntryTitle$>をtwitterでつぶやく</a>

retweet.js 横表示
横表示の場合だとこういう感じで表示されます。

あくまでも勝手な判断だけど、縦表示の方が良く見かけるかな?
簡単に調べて書いちゃったんで、問題があるかもしれないんで、使用の際は参考程度にお考えください。もちろん自己責任で 笑またムーバブルタイプ仕様のタグを入れて紹介しましたがワードプレスでもソースを変更してもらえれば使用できます。

要はhref="" にボタンを設置するページURL
a タグ内にアンカーテキストを記入するだけで良いって事です。

CSSでカスタマイズする事も可能みたいなので興味のある方は合わせてチャレンジしてみてください。

  • はてなブックマークに登録はてなブックマーク登録数
  • Yahoo!ブックマークに登録
  • Googleブックマークへ登録
  • この記事をクリップ!
  • ムーバブルタイプにtwitterからのアクセス数を表示する retweet.jsをPOOKMARK Airlinesに追加
  • この記事をBuzzurlにブックマーク
  • この記事をdeliciousにブックマーク
  • ムーバブルタイプにtwitterからのアクセス数を表示する retweet.jsをニフティクリップに追加