【WordPress】Pocketボタンを設置するために「Sharebar」プラグインを導入してみた

とあるネット記事に、後で読むサービス「Pocket」を利用している人の数は、無視できないくらい多いですよーいう内容が書かれていました。そこで、私もブログにPocketのボタンを設置したいと思い、Sharebarというプラグインを導入してみました。

Pocketへ送っている人ははてブする人より多いかも

これはPocketボタン設置するべきだな！と思い、少し調べてみました。

一番最初に思いついたのは、現在使用している「WP Social Bookmarking Light」プラグインにPocketボタンが対応していればその設定変えるだけだな！と思いました。が、残念ながら対応していませんでした。

なので、別の方法を考えます。

いろいろ調べた結果、自分でSNSボタンを設定できる「Sharabar」プラグインを導入することにしました。が、自分で設定できる＝自分でSNSボタンのコードを探してくる必要があるということです。とりあえず、私が設定した際に参考にしたサイトをご紹介します。

もともと設定されていたので、コード探しはしていません。

[browser-shot width=”200″ url=”http://b.hatena.ne.jp/guide/bbutton”]はてなブックマークボタンの作成・設置について

このページで手順に沿って作業すれば、コードが生成されます。

[browser-shot width=”200″ url=”https://developers.google.com/+/web/+1button/”]+1 Button – Google+ Platform — Google Developers

これも手順に沿って選択すれば、コードが生成されます。

ここのEvernote用コードをお借りしています。が、ちょっと他のボタンとテイストが違うので、できれば揃えたいのですが、いったんこのままで。

[browser-shot width=”200″ url=”http://getpocket.com/publisher/button”]Pocket for Publishers: Pocket Button

ここでコードを入手しましょう。

SNSボタンの種類によってサイズにばらつきがあるため、少し大きめのサイズを指定しておく必要があります。

▼プラグインの設定から、「Settings」を選択したところ。「Sharebar Width」の値を適当な値に調節しましょう。私は90にしています。

同様に、各SNSボタンの幅も必要に応じて設定しましょう。

▼Facebookの例。widthの値を80にしています。

また、Editした後に反映されないことが時々あります。そんなときは、以下の作業を。

▼「All」で全てのSNSボタンにチェックを入れた後、「Enable」を選択して「Update」ボタンを押下しましょう。

あと、私は「WPTouch」というプラグインでスマホ対応していますが、その場合はこのSharebarプラグインでの表示には対応していないみたいです。なので、引き続き「WP Social Bookmarking Light」プラグインも併用しています。

▼これで、こんな感じにスクロールしても追随するSNSボタン設置ができました！

見ている方に便利に使ってもらうために今回の設定をやってみました。皆さんも興味があればどうぞ。

WordPressプラグインについては以下の記事も参考に。

[catlist search=”WordPress プラグイン” numberposts=5 id=-210]