目立つフォローボタンをWordPressに設置!SMBToolbarの使い方

ーーブログ内に目立つフォローボタンを設置したい
ーーオシャレなフォローボタンでフォロワーを増やしたい

そういう人におススメしたいのが Social Media Follow Buttons Bar ( SMBToolbar )というプラグイン

これを使うとオシャレで目立つフォローボタンを記事内に自動的に設置できます。

TwitterやFacebookやGoogle+はもちろん、マイナーなSNSにも対応済みです。

本当に使い勝手がいいので、ここではSMBToolbarを使って記事内にフォローをボタンを自動・手動設置する手順について詳しく解説していきます。

Social Media Follow Buttons Barの導入手順

このプラグインを使うと例えば次のようなフォローボタンが記事の最後に表示されます

↓フォローボタンの設置例
Social Media Follow Buttons Barでサイドバーに設置されるフォローボタンの例

大き目のボタンなので目立ちやすいのが特長。ではこういうボタンを表示するためにプラグインの導入・設定をしていきましょう。

1. プラグインのインストール

まずメニューから「プラグイン」ー>「新規追加」を開き、新規追加画面が開いたらプラグイン検索欄に「Social Media Follow Buttons Bar」と入力

しばらくすると検索結果の一番上に次のプラグインが表示されるので「今すぐインストール」ボタンを押してください。

Social Media Follow Buttons Barをインストール

ちなみに手動インストールする場合は次ページからzipでのダウンロードも可

https://ja.wordpress.org/plugins/social-media-buttons-toolbar/

インストールが完了すると「今すぐインストール」ボタンが「有効化」ボタンに変わるので、それもクリックして有効化するのも忘れずに

有効化が終わったら次にフォローボタンの設定をしていきます。

2. フォローボタンの設定

フォローボタンの設定画面はメニューから「設定」ー>「Social Media Follow Buttons」をクリックして開くことが可能

WordPressメニューから「設定」ー>「Social Media Follow Buttons」をクリック

画面が開いたら次の手順でフォローボタンの追加やオプション設定をしていきましょう。

フォローボタンの追加

設定画面を開いたら次のように各SNSのボタンがずらずらと表示されている設定項目が真っ先に目に入るはずです。

WordPress記事内に設置するSNSボタンの選択画面

フォローボタンを追加するにはそのSNSの名前にチェックを入れましょう。

記事内に設置したいSNSボタンを選択

TwitterやFacebok、Youtube、Google+などはもちろん、あまり日本では名前を聞かないSNSにも対応しているようです。

とりあえず自分が持っているSNSアカウントがチェックできるなら片っ端からチェックしていきましょう。

ボタンリンクの設定

フォローボタンが追加されたら次は「Button links」と表示された項目の下に自分のSNSアカウントのURLを入力してください。

フォローボタンのURLを入力

ここに入力したURLが各フォローボタンを押したときに飛ぶ先のURLになります。

各種オプションの設定

フォローボタンのリンクURLを入力し終わったら画面下の「Display options」から表示の仕方やデザインなどが変更可能です。

特に設定しておいた方がいいオプションは次の通り

まず全ての投稿ページでフォローボタンを表示するために「Show on Posts」の状態を「Yes」を変更

この設定をしておかないとフォローボタン自体が表示されないので必ず有効にしておきましょう。

そしてもしフォローボタンをクリックしたとき別タブで開きたいなら「Open in New Tab」の状態も「Yes」に変更

もし別タブで開かない場合、そのまま離脱されてしまうことになるので別タブで開く設定は有効にしておくといいですね。

そうしたら次にボタンのサイズ上下左右マージン(余白)を各オプションから調整

ここはブログのデザインや好みに合わせて好きなように変更してください。

そして最後にフォローボタンの上に表示される説明文を「Caption」のテキスト欄に入力

ここは「フォローする」と入力しておけばフォローボタンだと分かりやすくなるはずです。

以上の設定が終わったら「Live Preview」でボタンのプレビューを確認し、問題なければ「Save changes」ボタンを押して設定を保存

以上でフォローボタンの設定は完了です。

3. フォローボタンが表示されるか確認しよう

最後にフォローボタンが記事の終わりに表示されるか確認しましょう。

次のように適当なページを開いて記事終わりにフォローボタンが表示されていればOKです。

ちなみに記事最後に他のウィジェットや関連記事を表示していてもフォローボタンが優先して本文下に表示されます。

以上がSMBToolbarを使ったフォローボタンの設置手順

デザインがきれいなだけはなく、一度設定しておけば記事の最後に自動的にフォローボタンを設置してくれる機能も地味に便利です。

手動でフォローボタンを設置するには・・・

このプラグインは次のような場所への手動でのフォローボタン設置にも対応しています。

  • サイドバーのウィジェット内
  • 記事内などの好きな場所

これらの場所で設置する方法は次の通り

サイドバーへのフォローボタンの設置

サイドバーに設置する場合、ウィジェット画面からテキストウィジェットを探してください。

そしてフォローボタンを設置したい場所にドロップしたら、次のように本文に [smbtoolbar] と入力

これでサイドバーに次のようなフォローボタンが表示されます。

サイドバーに設置されたフォローボタンの例

PCからのアクセスが多い場合はサイドバーにもフォローボタンを設置するとフォローしてくれる人が増えるかもしれません。

任意の場所にフォローボタン設置

もし記事内の途中でフォローボタンを表示したい場合、

その記事の編集画面で挿入したい場所に次のショートコードを書くだけです。

[smbtoolbar]

あるいは自分でテーマファイルを編集していて、任意の場所にフォローボタンを設置したなら次のPHPコードを呼び出せばOK

<?php echo do_shortcode("[smbtoolbar]"); ?>

もしカスタムテンプレートなどを作ってフォローボタンを表示する場合は、こちらの方法を使うのが確実です。

まとめ

フォロワーを増やすには役に立つ記事を更新するのは当然ですが、ブログ内からSNSに流入経路を作る・増やすことも大事です。

それなら小さいフォローボタンより大きなボタンの方がクリックされる確率は高いので、目立つボタンを作るのに「Social Media Follow Buttons Bar」は役立つことでしょう。

フォロワーを増やしたいという方は是非導入してみてください。

ちなみにこの記事にもフォローボタンを設置してあるので、よければフォローお願いします。m(_ _)m

フォローする
The following two tabs change content below.

フク郎

昔はプログラミングに熱中していたが、ブログとWordPressに興味を持ち始め今はサイト・ブログ作りが生きがい。自分の「好き」をブログに変えたい、情報発信したい人に役立つWordPress術・サイト構築術を発信中。一日一歩楽しんでブログ構築できるように読みやすい&楽しい記事作りを心がけています。Twitterアカウントはこちら ⇒ フク郎@Fukuro-Press