SNSシェアボタンと関連記事を設置できるプラグイン「Shareaholic」

今回はSNSシェアボタンと関連記事の両方を設置できるワードプレスのプラグイン「Shareaholic」をご紹介させていただきます。

SNSシェアボタンも関連記事も、ユーザビリティを考慮し訪問者やページビューに関わる大事な要素となります。

ワードプレスのSNSボタン設置のプラグインはいくつか用意されていますが、どれがいいか悩むかと思います。

私なりに調べた結果、使いやすさ、機能の充実さなどが突出している「Shareaholic」が一番おすすめできると思いました。

このページでは簡単にSNSシェアボタンと関連記事を配置するまでの手順をご紹介させていただきます。

Shareaholicのここがおすすめ

Shareaholicがおすすめな理由は以下の通りです。
これだけのメリットがあるShareaholicを選ぶ理由は十分です。

簡単に設置できる

配置位置やデザインを指定するだけの簡単操作でSNSボタンを設置できます。

LINEが対応している

ShareaholicはLINEが対応している数少ないSNSシェアプラグインです。
多くの方が利用されているLINEの対応は必須です。

関連記事が表示できる

シェアボタンとは別に投稿記事の下などに関連記事を表示することも可能です。
訪問者をすぐに離脱させずに他のページへと誘導する方法として関連記事も欠かせません。

通常はテーマによっては搭載されてたり専用のプラグインなどを入れる必要のある関連記事も一緒に簡単に表示できるようになります。

また関連記事には広告の表示もでき、収益化が可能のようです。

無料登録で拡張機能が使える

メールアドレスとパスワードを設定するだけの簡単な登録で、より高度な設定が可能となります。（※任意）

Shareaholicのインストール方法

ワードプレス管理画面→「プラグイン」の「新規追加」で　Shareaholic　のキーワードで検索すると同名のプラグインが表示されます。

そこで「今すぐインストール」をクリックして「有効化」にしましょう。

＜2019年1月18日追記＞
「Shareaholic」は現在、一部機能を加えた「WordPress Share Buttons, Related Posts, Google Analytics – Shareaholic」に名前とロゴが変更されています。

検索されるときは同様に　Shareaholic　で表示されます。
なお次から説明する設置方法も同様にご利用できます。

「Shareaholic」でSNSシェアボタンの設置方法

ワードプレスにインストールして有効化することでダッシュボート内にShareaholicが追加されています。

まずはカーソルをあわせて一番上の「App Manager」を選択します。

App Managerの画面が表示されました。

「In-Page Share Buttons」の項目がページにシェアボタンを設定する箇所です。
ここでは作成した記事ページ下に配置することを前提としており、記事ページは「Post」が該当箇所になります。

記事の上に配置したい場合は「Above Content」、記事の下には「Below Content」にそれぞれチェックを入れ、編集したい方の「Customize」をクリックします。

カスタマイズ画面が表示されました。
「Post」以外のカスタマイズ画面も中身は共通です。

ここでは「Layout」タブの上部分を説明をします。

・THEME
ボタンのデザインを選択します。

・HEADLINE
シェアボタンの上に表示するメッセージを選択します。
「No Heading」は非表示です。
自分で文字を入力したい場合は、無料登録後の管理画面で入力できます。

・SHOW ‘MORE OPTIONS’ BUTTON
各シェアボタン端のオプションボタンの表示か非表示を選択します。

・POSITION・ALIGNMENT
組み合わせてシェアボタンの配置位置を選択します。

・LAYOUT
シェアボタンの表示を横か縦か選択します。

・SIZE
シェアボタンのサイズを選択します。

・COUNTER
シェアされたカウントのデザインを選択できます。
OFFは非表示です。

続いて「Layout」タブの下部分を説明をします。

・CUSTOM ICON COLORS
ONにすることによりシェアボタンの色を変更することができます。
※色で瞬時に訪問者がどのボタンかを認識する場合もあるので変更はあまり推奨しません。

・TOTAL SHARE COUNTS
シェアされたカウントのトータル表示をデザインできます。

その下の枠はプレビュー画面になり、実際に表示されるボタンです。
ここで不要なシェアボタンにカーソルをあわせて×をクリックすると表示されなくなります。

他のシェアボタンを追加したい場合はさらに下の検索覧からお好みのシェアボタンをクリックするとプレビューに反映されます。
プレビュー上でカーソルを合わせれば位置の変更も可能です。

最後に右下の「Save Settings」をクリックして完了です。

すると、記事ページの下に選択したSNSのシェアボタンが表示されました。
今回のように「Post」の「Below Content」でカスタマイズした場合は「全ての記事ページの下」にシェボタンが追加されます。

続いて「関連記事の設置方法」を紹介させていただきます。

「Shareaholic」で関連記事を設置する方法

ワードプレス管理画面の「Shareaholic」から「App Manager」を選択し、中央にある「Related Content」が関連記事を設定する箇所です。

ここでは記事ページの下に配置する前提で進めますので「Post」の「Below Content」にチェックを入れ、「Customize」をクリックします。

関連記事を設定する画面が表示されるので説明します。

・HEADLINE TEXT
関連記事の上に表示される「関連記事はこちら」など案内の文章を任意に入力します。

・Choose a Theme
関連記事の枠やデザインを選択します。

・Maximum Number of Posts
関連記事を表示する数を選択します。
「8 POSTS」は8個の記事が表示されます。

設定が終わったら右下の「Save Settings」をクリックすれば完了です。

関連記事が記事の下に設定した数で表示されました。
SNSシェアボタンを配置してればその下に表示されます。

画像のないページにも自動でサムネイルが表示されるようです。

※ページ内でアフィリエイト広告の画像が通常の画像より上に配置されてると欠落する仕様のようです。

Shareaholicをインストールすればこのように簡単にSNSシェアボタンや関連記事が設置できます。
ワードプレスをご利用されてる方は是非、この機会にインストールしてみてはいかがでしょうか。

考察TOPへ
HOMEへ