[WordPress] 『AddToAny Share Buttons』プラグインでSNSシェアボタンを簡単設置。LINEボタンもあってオススメ!

2016年10月16日
follow us in feedly

これまでサイトに設置するSNSのシェアボタンは各SNSのAPIを利用して自作していましたが、仕様変更によるメンテナンスが面倒になってきたので、いくつかのWordPressプラグインの中から『AddToAny Share Buttons』を選んで使ってみました。

AddToAny Share Buttons

AddToAny Share Buttonsの特徴

このSNSシェアボタン設置プラグインの特徴は、

表示デザインに癖がない。
アイコンにカウント数が表示されない。
アイコンサイズがカスタマイズできる。
SNSボタンの種類が豊富でLINEもある。
追尾型のフローティングボタンが設置できる

こんな感じです。

デメリットになりそうなのは、「アイコンにカウント数が表示されない。」ですが、個人的には読み込みに時間がかかるカウント数を表示したくないので、このプラグインは逆に最適。

では設置方法をまとめる前に実際に設置イメージをどうぞ。

img_addtoany3

記事の前後にSNSシェアボタンを設置、そして右サイド固定で追尾型のフローティングSNSシェアボタンを設置しています。

AddToAny Share Buttonsの設定方法

WordPress管理画面のプラグイン新規追加から「AddToAny Share Buttons」を検索してインストール→有効化。

「設定」に追加された「AddToAny」の設定画面から説明します。

Standard設定

設定画面は英語ですが、簡単なので心配ご無用。

img_addtoany

Icon Sizeでは表示するアイコンサイズを「Large」「Small」「Custom」3パターンから選べます。サイトに合うように好みで設定してください。私は「Large」を選択。

Standalone Buttonsから表示したいサービスが選べます。「サービスの追加/削除」をクリックすると次の画像の通り100種類以上のアイコンが現れます。日本では利用者の多いLINEがあるのが嬉しいところ。

img_addtoany1

Universal Buttonはユーザー自らシェアしたいサービスを選択できるボタンが設置できます。私は「なし」で。

Sharing Headerにテキスト入力することでシェアボタンの前にタイトルが入ります。この辺はお好みで。設定しなくてもOKです。

ブックマークボタンの場所では記事の前、後、前後など選択できるようになっています。

その他にも固定ページやアーカイブページに表示するかどうかなど細かい設定が可能です。

設置場所を設定したら、そこから下は未設定でOKです。変更を保存しておきましょう。

Floating設定

続いて、追尾型のフローティングボタンの設定。

img_addtoany2

Vertical Buttonsで垂直方向のボタンを設定

ブックマークボタンの場所は右サイド、左サイド、もしくは「なし」から選択。

Responsivenessにチェックを付けると、設定した画面サイズ以上で表示となります。

Positionで画面上からの表示位置を調整。

Offsetで左右からの表示位置を調整。

Horizontal Buttonsで水平方向のボタンを設定

こちらはスマホ向けの表示設定になりますね。

上記Vertical Buttonsの設定で980pxよりも画面の横サイズが大きければ表示するように設定しているため、980pxよりも小さい画面ではこちらの設定が反映されるように設定できます。私は

ブックマークボタンの場所では右寄り、左寄り、もしくは「なし」から選択。私は「なし」で。

Positionで左右からの表示位置を調整。

Offsetで下からの表示位置を調整。

最後に「変更を保存」して完了です。

シンプルなデザインでSNSシェアボタンを簡単設置。オススメです。

follow us in feedly

関連記事

福岡でホームページ制作を依頼するなら【ハブワークス】

ホームページ制作・リニューアル・スマートフォンサイト制作・ECサイト制作は福岡のハブワークスまでお気軽にどうぞ。WEBサイト制作後の修正・更新・SEO対策もお任せください。リーズナブルな料金設定でサービスをご提供いたします。

webサイト制作・修正に関するお問合せ・ご相談・お見積りはお気軽にどうぞ