WordPress用：ソーシャルブックマークボタンの設置とブックマーク数を表示する方法
はてなやnewsingをのヘルプを見ると、MT用のソースはあってもWordPressのソースって書いてなくて、不親切だなぁと思い、
WordPress用の、各ソーシャルブックマークサービスのブックマークボタンと、ブックマーク数表示画像のソースをまとめました。
以下のソースをコピーして、WP内の記事ソースに貼り付けるだけです。
(「Design」→「Theme Editor」→「Single Post」)
＊注：ブックマーク数はブックマークがある場合のみ表示されます。ゼロの場合は表示されません。
はてなブックマーク
はてなブックマークボタン 
<a href="http://b.hatena.ne.jp/append?<?php the_permalink() ?>"><img src="http://d.hatena.ne.jp/images/b_entry.gif" alt="このエントリをはてなブックマークに登録" width="16" height="12" border="0" /></a>
はてなブックマーク数
<img src="http://b.hatena.ne.jp/entry/image/<?php the_permalink() ?>" />
Buzzurl
Buzzurlブックマークボタン 
<a href="http://buzzurl.jp/entry/<?php the_permalink() ?>"><img alt="このエントリをBuzzurlにブックマーク" src="http://buzzurl.jp/static/image/api/icon/add_icon_mini_08.gif" /></a>
Buzzurlブックマーク数
<img src="http://api.buzzurl.jp/api/counter/<?php the_permalink() ?>" />
Yahoo!ブックマーク
Yahoo!ブックマークボタン 
<?php echo '<a href="http://bookmarks.yahoo.co.jp/action/bookmark?t='.urlencode(the_title('','',false)).'&u='.urlencode(get_permalink()).'"><img src="http://i.yimg.jp/images/sicons/ybm16.gif" width="16" height="16" alt="Yahoo!ブックマークに登録" style="border:none;"></a>';?>Yahoo!ブックマーク数
<img src="http://num.bookmarks.yahoo.co.jp/image/small/<?php the_permalink() ?>" />
ライブドアクリップ
Livedoorクリップブックマークボタン 
<a href="http://clip.livedoor.com/clip/add?link=<?php the_permalink() ?>&title=<?php the_title(); ?>&jump=ref"><img src="http://parts.blog.livedoor.jp/img/cmn/clip_16_16_w.gif" alt="このエントリをlivedoorクリップに登録" width="16" height="16" /></a>
Livedoorクリップブックマーク数
<img src="http://image.clip.livedoor.com/counter/small/<?php the_permalink() ?>" />
del.icio.us
deliciousのブックマークボタン 
<a href="http://delicious.com/save" onclick="window.open('http://delicious.com/save?v=5&noui&jump=close&url='+encodeURIComponent('<?php the_permalink() ?>')+'&title='+encodeURIComponent('<?php the_title() ?>'),'delicious', 'toolbar=no,width=550,height=550'); return false;"><img src="http://static.delicious.com/img/delicious.small.gif" height="10" width="10" alt="Deliciousにブックマーク" /></a>deliciousのブックマーク数
<img src="http://labs.creazy.net/sbm/delicious/textimg/<?php the_permalink() ?>" />
newsing
Newsingは投票数のみを表示させるソースが見つからなかったので、Newsingにて配布されているMovableType用の投稿ボタンのソースをWordPress用に変更しました。
newsingのブックマークボタン（投票数入り） 
<iframe src="http://newsing.jp/newsingit?url=<?php the_permalink() ?>&title=<?php the_title(); ?>" scrolling="no" marginheight="0" marginwidth="0" frameborder="0" height="18" width="122" style="margin:0;padding:0;width:122px;height:18px;"></iframe>
newsingのブックマークボタン（投票数無し） 
<a href="http://newsing.jp/nbutton?title=<?php the_title(); ?>&url=<?php the_permalink() ?>"><img src="http://image.newsing.jp/common/images/newsingit/newsingit_s.gif" width="16" height="16" alt="このエントリをnewsing it!へ追加" /></a>
追記：＊このブログで採用しているvicunaのテンプレだと、上記のnewsingのソースではボタンをクリックして投稿ページに飛んだときにurlは自動で読み込んでくれるのですが、記事タイトルを読み込んでくれません。色々試しましたが知識薄でわかりません。解決策をご存知の方、コメントなどいただけると幸いです。ほかのテンプレは大丈夫のようですが、中には上手く動かないのもあるかもしれません。（コメントいただいたセルフSEO対策ブログのシロウトさん、ありがとう。）
ブックマーク数表示画像の調整
今回、各ソーシャルブックマークサービスのブックマーク数表示APIの多くはcreazy photographというサイトの以下の記事を参考にさせて頂きました。
各ソーシャルブックマークサービス（SBM）のブックマーク数画像表示APIを調べた
この記事には、ブックマーク数の表示画像の大きさを調整する方法も掲載されいます。
その際、各記事のURLを記入する箇所がありますが、その場所にはWordPressの記事URLを取得する以下のタグを記入して下さい。
<?php the_permalink() ?>
その他、不明な点はコメント欄↓へどうぞ。
参照記事
- SBSのブックマーク数画像表示APIを調べた : (creazy photograph)
- 主要なソーシャルブックマーク追加ボタンを付ける : (VIVABlog)
- wordpressにはてなとlivedoorのブックマークボタンを貼り付ける方法 : (sorarium)
- 自分のブログに「↑B」アイコンを表示する : (はてな)
- ブックマークアイコンの取り付け方 : (Buzzurl)
- ブログに「clip!」ボタンを設定しよう！ : (ライブドアクリップ)
- 各社ブログ向けYahoo!ブックマークのブログパーツ設置方法 : (Yahoo!ブックマーク)
- Save Buttons : (Delicious)
- ピックアップボタン設置方法 : (newsing)
タグ
Posted 2008-12-28 (Sun) 14:07
Last Updated 2009-06-27 (Sat) 0:30
Category: WordPressカスタマイズ
Comments
post a comment
target=”_blank”を使わずに、rel=”external”、rel=”external nofollow”で新しいウィンドウを開く方法 »
« RSS Feed購読者数を計測する方法+WordPressプラグイン
[...] <a href=”http://b.hatena.ne.jp/append?<?php the_permalink() ?>”><img src=”http://d.hatena.ne.jp/images/b_entry.gif” alt=”hatenabookmark” width=”16″ height=”12″ border=”0″ /></a><br /> ■ コードの貼り付けが完了したら保存して、同ディレクトリ内にアップロードで終了です。 phpに慣れない方は念のためバックアップをお勧めします。 以上ではてなブックマークアイコンの設置手順は終了です。 他、Buzzurl・del.icio.usやyahoo,livedoorクリップなどの設置は参考にさせていただいたサイト http://seofromusa.com/wordpress-customizazion/bookmark-counter/より設置方法をご覧ください。 [...]
[...] プラグインを入れる １．Nofollow Freeの有効化。（コメント欄のrel=”nofollow”タグを外すプラグインです。コメントwelcomeの姿勢を示します。） ２．Akismetの有効化。(コメント欄からnofollowタグを外すとスパムも増えるので、これで撃退。) ３．コンタクトフォームの有効化→コンタクトフォームページを作成 ４．FeedLoggerの有効化 ５．SBM Popular Entryの有効化（このプラグインは管理ページの投稿済み記事リストにブックマーク数を表示してくれます。ただし、ブックマーク数が正確でないので、あくまで管理用であり、記事へのブックマークボタンとブックマーク数は上記に紹介したソースを直接貼り付けます。） [...]
５．記事／ページのソースにブックマークボタンを貼り付ける
wordpress テーマを変えた。ブログパーツもいろいろくっつけた。…
wordpressのテンプレートを変更した。
デフォルトのテーマは見栄えがよくなかったのでiNoveに変更した。
英語圏のテーマなので文字が小さいと思うが、かっこいいとおもう。
テーマを変え….
本当にいろいろ参考になります。
早速利用させていただきました。
ありがとうございました。
Thank You!またどうぞ。
>上記のnewsingのソースはボタンをクリックして投稿ページに飛んだときに、
>urlは自動で読み込んでくれるのですが、記事タイトルを読み込んでくれません。
多分ですが・・・お使いのThemeのvicunaはデフォルトで
<title><?php bloginfo(’name’); ?></title>
となっている（はず）なのでnewsingのタグも
&title=<?php the_title(’name’); ?>
としておかないと読み込まないのではないかと思います。
既に試していたら分からないですね・・・すみません。
&title=<?php bloginfo(’name’); ?>
でした。すみません。
おお！賢い！
と思ってやってみましたが、出来なかった。。。
また何か思いついたら是非、書き込みお願いします。:)
気になったのでvicunaをDLしてnewsingのソースを入れてみたらやはりタイトルを読み込みませんね・・私が現在使用しているテーマでは清音さんの書いたソースで読み込みました。
原因はテーマに有るようですね。
結局解決法が分からないというオチ。
記事／ページのソースにブックマークボタンを貼り付ける
[...] その他、Buzzurlや、Yahoo!ブックマーク、newsingなどの設置方法は下記のリンクに紹介されています。パーマリンクの記述方法は同様に注意してください。 WordPress用：ソーシャルブックマークボタンの設置とブックマーク数を表示… [...]