記事のサイドにShareボタンを設置…WordPressプラグイン『ShareBar』を入れてみた


2013-0216-152905

WordPressへの記事移動がだんだん本格化してきて、
ようやくこちらをメインブログにする算段も付いてまいりました。
近いうちに、fc2からWordpressへの移行に関するまとめ記事も作りたいですね。

さて、Wodpressプラグインで、TwitterやFacebookへの共有ボタンを
記事内にくっつけるものがいくつかあるのですが、
これはまだ別で、記事の左サイドや右サイドに追いかけるように
Shareボタンがついたボックスを表示するプラグイン『ShareBar』
なかなか面白そうだったのでこちらを入れてみました。

スポンサードリンク

 

ShareBar

ShareBarは、プラグインの検索画面からインストール可能です。

インストールして有効化すると、個別記事にこのようなボックスが表示されるようになります。
この中身のボタンや表示位置も、当然ながら設定可能です。
2013-0216-144815

設定してみる

インストールすると、設定メニューに「Sharebar」が追加されています。
2013-0216-144430

設定画面では、どの共有ボタンを表示するかが選択出来ます。
表示出来るのはDigg, Twitter, Facebook,Reddit,DZone…
2013-0216-144516

色々と種類がありますが、日本人的には主要なTwitterとFacebookぐらいがあれば
いいのかなという気もしますね。

この画面で、ボタンの表示/非表示、その他のSNSの共有ボタンの
追加もここから可能です。
背景が白色のボタンが表示(Enable)、灰色が非表示(Disable)の状態です。

表示場所の移動

このボックスを掲載する場所の変更ですが、
設定ページ上部の「Settings」から可能です。
2013-0216-145135

2013-0216-145235

左サイド/右サイド表示の選択は、
Display Options→Sharebar Position
から選択出来ます。
デフォルトは「Left」になっていました。

2013-0216-145256

記事からどれだけ横ピクセルを離すかは、
Display Options→Left(Right) Offset
から指定出来ます。

記事の左右カラムにメニューを置いている場合などは、
こんな感じでメニューと被ってしまうので、場所の調整が必要ですね。
2013-0216-150214

ボックスのサイズの調整

シェアボタンのボックスサイズの調整も可能です。

Customize→Sharebar Width
から横サイズの調整が出来ます。
縦サイズは、設置しているボタンの数で自動調整されるみたいです。
2013-0216-150440

ボックスの背景色や罫線色まで変更可能ですね。

サイドに表示できない環境では自動的に記事のトップに表示

解像度が小さい環境や、ウィンドウを小さくして表示しているなど、
記事のサイドのシェアボタンが見れない場合は、記事タイトルの下部に
自動的にシェアボタンを配置してくれるようになっています。
2013-0216-150934

これ、小さいことだけどすごい気が利いてますよね、
一応オプションで無効にも出来ますが、これは有効のままでいいんじゃあないかな。

Display Options→Display horizontal Sharebar if the page is resized to less than 1000px?
から設定出来ます。

注意点(2013/3/28追加)

このプラグインですが、Facebookの共有ボタンのところで
ちょっとおかしな動作をする部分がありました。
下記のページに、現象と対応方法を載せていますので
そちらもあわせて確認くださいませ。

先日導入したプラグイン『Sharebar』の動きが怪しかったので一部修正してみた | Tipstour

総括

インストールして設置場所を選択するだけで、
基本的な動作は問題なくこなせるようになるので、
気軽に入れられる点とデザインのさりげなさはかなりいい感じの
シェアボタンとして活用できるんじゃあないでしょうか。

スポンサードリンク

 

この記事が参考になったら、TipstourのFacebookページに『いいね!』をお願いします!

 

よろしければFeedlyもご登録ください!
follow us in feedly