【AddToAny Share Buttons】SNS共有ボタンを設置するプラグインの使い方

 

 

「Twitter」をはじめ「Instagram」や「Line」などSNSユーザーの増加はとどまる所を知りません。

以前は「若者のツール」といったイメージでしたが、今では幅広い年齢層に受け入れられていますよね。

主要SNSでは数千万規模の月間アクティブユーザーを持っているため、マーケティングやWEB集客においても非常に魅力的なツールです。

 

さて、SNSから読者を獲得するには、サイトまたは記事が共有（シェア）される必要があります。

共有される確率を高めるためにも「SNSボタン」を設置しておくと良いでしょう。

 

 

SNSボタンとは、クリックするだけで記事を共有できるボタンのこと。

あらかじめ記事の前半や後半に配置しておくことで、記事を気に入ってくれた読者（SNSユーザー）が共有しやすくなります。

SNSボタンを効率よく設置するにはプラグインを導入するのがオススメです。

とくに「AddToAny Share Buttons」は最もポピュラーなSNS向けプラグインの一つ。

 

 

一度導入を済ませてしまえば、各記事に自動的にSNSボタンが設置されます。

今回はそんな「AddToAny Share Buttons」でSNSボタンを設置する方法をご紹介したいと思います。

 

インストールと有効化

まず、プラグインをインストールしてみましょう。

WordPressの管理画面にログインして「プラグイン」⇒「新規追加」と進んでください。

そして、画面右上の検索フォームにプラグイン名を入力します。

 

 

検索結果から「AddToAny Share Buttons」を見つけたら「インストール」⇒「有効化」と続けて実行。

管理画面の「設定」の中に「AddToAny」項目が追加されていれば、プラグインの導入は完了です。

 

 

ちなみにこの段階で、すでに記事内にいくつかSNSボタンが設置されているはずです。

これからSNSボタンを追加したり配置場所を変更したりしていきます。

 

標準（Standard）設定

AddToAny Share Buttonsの設定は大きく分けて２つです。

 

 

まずは、標準設定から見ていきましょう。

WordPress管理画面「設定」⇒「AddToAny」にアクセスします。

最初に表示されている画面（タブ）が標準設定です。

 

 

それでは上から順番に主な設定項目を解説していきます。

 

１．Icon Style（ボタンのサイズ・色）

 

「Icon Style」では、SNSボタンのサイズや色を指定します。

 

２．Share Buttons

記事内に設置するSNSボタンを選択します。

「サービスの追加/削除」をクリックすると、SNS一覧が開きます。

 

 

設置したいSNSをクリック選択すると、下図のように枠で囲まれます。

 

 

同じSNSをもう一度クリックすると、選択を解除します。

AddToAny Share Buttonsでは、なんと100種以上のSNSに対応しています。

とは言え、日本で利用されていないサービスがほとんどですし、あんまり記事にボタンを並べ過ぎても、かえって使いにくくなってしまいます。

 

 

そこで、日本でポピュラーなサービスに絞りましょう。

WEBコンテンツへ集客するなら以下のSNSボタンがオススメです。

 

 

３．ユニバーサルボタン

次に「ユニバーサルボタン」の設定を行います。

ユニバーサルボタンとは、AddToAny Share Buttonsで対応している全てのSNSボタンが収納されているボタンです。

 

 

「Share Buttons」で選択したボタンと一緒に配列され、カーソルで触れる（またはクリックする）とSNS一覧が開きます。

他のSNSユーザーでも共有できるようになり、またスペースの節約にもなりますね。

 

さて、ここで設定するのはユニバーサルボタンを「どのように表示するか」です。

デフォルト画像の他に、オリジナル画像やテキストに置き換えることが可能です。

デフォルトのままでも、シンプルでわかりやすいかと思いますので、問題なければ特に変更する必要はありません。

 

４．シェア・ヘッダー

ボタンが配置される段落の上に見出しを付けることができます。

 

 

読者にシェアを呼びかけるフレーズを入力しておくと良いかもしれません。

レイアウト的に見出しを付けたくない方は、未入力のままでOKです。

 

５．ブックマークボタンの場所

SNSボタンをサイト内のどのページに配置するか設定します。

どのようなコンテンツで集客を成功させたいかによって選択が変わってくると思います。

「投稿」がメインコンテンツである場合は、最初の項目以外はチェックを外しておきましょう。

また、記事内のどの箇所に設置するかメニュ―から指定できます。

 

 

「上部」「下部」「上部＆下部」から選択します。

個人的には、コンテンツを読み終わった読者をシェアへと誘導しやすい「下部」がオススメです。

 

６．メニューのオプション

 

チェックを入れると、ユニバーサルボタンをクリックで開けるようになります。

カーソルが触れると開くようにしたい場合は、チェックを外しておきましょう。

以上で「標準（Standard）設定」での主な作業は完了です。

最後に「変更を保存」を忘れずに押しましょう。

 

Floating設定

次に「Floating設定」です。

Floating設定では、主にSNSボタンの固定表示を実行します。

固定表示とは、画面をスクロールしても表示が動かない状態のことです。

 

 

ページのどの箇所を閲覧していてもSNSボタンが表示されるため、読者の目にとまるチャンスが増えます。

ただし、読者にとっては少し鬱陶しい機能でもあるため、必ずしもシェア数が伸びるとは限りません。

では、固定表示を導入したい場合は、設定画面先頭のタブから「Floating」を選択しましょう。

 

 

Floating設定は以下の二段階構成になっています。

 

 

スマホだけ固定表示したい方は、縦ボタン項目は飛ばして「横ボタン」のみ設定すればOKです。

あるいは、両方のデバイス利用者にたくさんシェアしてもらいたい！という方は、両方設定しておく必要があります。

 

縦ボタン ーPC画面に固定表示

それでは、まず「縦ボタン」の主な設定を見ていきましょう。

 

① ブックマークの場所

 

SNSボタンをブラウザ画面の左右どちらにドッキング（固定）させるか選択します。

 

 

コンテンツのレイアウトに合う方を指定すると良いでしょう。

 

② レスポンシブ化

次は縦ボタンを「非表示」にする条件を選択します。

読者のストレスを緩和する上で、以下のような場面で縦ボタンを隠す配慮も大切です。

※複数選択可

 

 

③ 位置

 

固定表示する位置を指定します。

閲覧画面の上端からどのくらい隙間を空けるか指定します。

 

 

④ オフセット

 

こちらは閲覧画面の左端または右端からどのくらい間隔を空けるか指定します。

 

 

「位置」「オフセット」はともに、ページを上下にスクロールしても、画面との距離を維持し続けます。

 

⑤ アイコンサイズ

 

SNSボタンのサイズを指定します。

デフォルトのままで丁度良いと思います。

 

⑥ Background

 

縦ボタンの背後に色を付けます。

デフォルトは「Transpalent（透明）」ですが「Custom」を選択すると色を指定できます。

 

 

サイトのデザインによってボタンが見ずらい場合には、背景色を挟むことで見やすくなります。

 

横ボタン ースマホ画面に固定表示

「横ボタン」設定では、閲覧画面の下端にSNSボタンを固定表示します。

 

 

スマホのような小さい画面に適した表示方法ではありますが、コンテンツの邪魔にならないよう配慮が必要です。

 

① ブックマークボタンの場所

「左寄せ」「右寄せ」「中央寄せ」の３つのパターンから選択します。

 

 

できるだけ記事のテキストや画像に重ならない位置がベストです。

 

② レスポンシブ化

 

横ボタンを非表示にする条件を指定します。

※複数選択可

 

 

③ 位置

 

「ブックマークボタンの場所」設定で「左にドッキング」「右にドッキング」を選択している時、閲覧画面の（左右の）端からどのくらい隙間を空けて設置するか指定します。

 

 

④ オフセット

 

閲覧画面の末端からどのぐらい隙間を空けて設置するか指定します。

 

 

スマホのような小さい画面だとスペースに余裕がないため「位置」「オフセット」ともに「０」のままが良いと思います。

 

⑤ アイコンサイズ

ボタンの大きさを指定します。

デフォルトのままでOKです。

 

⑥ Background

 

横ボタンの背景色を決めます。

デフォルトは「Transparent（透明）」ですが「Custom」で好きな色に変更できます。

 

 

SNSボタンをより目立たせたい場合などに効果的です。

 

「AddToAny Share Buttons」のおさらい

 

 

関連記事

・【WordPress】コメント機能を高める拡張プラグイン おすすめ10選