設置するソーシャルブックマークを変更してみた。
以前は、ポッフアップで SMB ボタンがまとめて表示される 「 AddToAny: Share/Bookmark/Email Button 」 というプラグインを使用していたのだが、やはり各々のボタンが個別に表示された方が利便性があるのではないかと思い、プラグインを変更した。

今回、使用してみたのは 「 WP Social Bookmarking Light 」 （↑ 記事上部に配置してあるブックマークが 「WP Social Bookmarking Light」）

管理画面で選択したソーシャルネットワーク, ソーシャルブックマークのボタンを、ブログ記事の先頭か末尾に自動で追加してくれて、ブックマーク数の表示も可能だ。

はてなブックマークや Facebook、Google Buzz、Twitter など国内外の代表的なサービスにはほぼ対応しており、管理画面での設定もドラックアンドドロップで、ボタンの選択が簡単にできるようになっている。

• ダウンロードはコチラから↓
  WP Social Bookmarking Light （WordPress.org）
• プラグインWEBサイトはコチラ↓
  ninxit.blog

導入方法は、

１．ダウンロードしたファイルを解凍し、Pluginフォルダにアップロードして、管理画面からプラグインを有効化。もしくは、管理画面からプラグイン ＞ 新規追加で「 WP Social Bookmarking Light 」で検索し、インストールしてプラグインを有効化。

２．設定 ＞ 「 WP Social Bookmarking Light 」 下図画面で各種設定を行う。

◆配置の設定

• 位置 ： 記事の上下どちらにボタンを配置するか。
• 個別記事のみ ： 「No」 を選択すると、トップページに表示することができる。
• ページ ： ページにボタンを表示するかどうか。
• 上下の間隔 ： ボタンの上下の余白。
• 整列 ： ボタンを左寄せ右寄せどちらにするか。

◆ボタンの選択

表示したい項目を右から左へドラッグアンドドロップする。削除する場合は、各項目の右側 「×印」をクリックする。

◆設定タブ

選択したサービスによって個別の設定タブが追加される。下図画面は Twitter の設定タブ。
配置したボタンの右側に大きな余白ができてしまう場合は、「 width 」 で修正する。

３．設定が完了したら、「設定を保存」ボタンをクリック。

４．表示位置の修正

使用しているテーマの CSS によっては、配置されたボタン位置の高さが揃わなかったり、各ボタンの間隔が開き過ぎたりするので、CSS で表示位置の修正をする。

当サイトの場合、はてなブックマークの表示位置が下がってしまっていたので、使用しているテーマの CSS で下記のように修正した。

[HTML]#content .wp_social_bookmarking_light div .hatena-bookmark-button-frame {
margin-top: -7px !important;
}[/HTML]

 

※ 配置するボタンの順序を入替えることによって、高さや余白の問題が解決する場合もあるので、CSS で修正する前に、ボタンの順番を入替えてみるといいかも知れない。