どうも長嶺です。

ケイイチさん!
ケイイチさんのブログ記事の下にある「この記事気に入ったらいいねしてね!」ってやつ、僕のワードプレスにも入れたいんですけどどうすればいいですか?

こんな質問をクライアントからもらいました。

・・・ん~?

記事の下の・・・?

・・・あぁ!

↑これの事ですね。

俗に言うバイラルメディア風シェアボタンってやつです。

残念ながら、僕は有料ワードプレステーマ『ハミングバード』に標準で付いている機能を使ってこのシェアボタンを設置しているので、使っているテーマが違う彼には同じものを導入することが出来なかったわけですが、実は便利なプラグインがあるので今日はそれをご紹介しましょう!!

※2017年8月22日追記。
現在はハミングバードの次テーマである「ストーク」を使用しています。同系列なのでハミングバードと同じようにシェアボタンがつきます。

VA Social Buzzでバイラルメディア風シェアボタンを簡単設置!

ほんの少し前まで、このシェアボタンを設置するためにはCSSをいじる必要があったみたいですが、半年ほど前に便利なプラグインが作られています。そのプラグインがVA Social Buzzです。

このプラグインを設置して、簡単な設定を行うと

こんなボタンが記事の下に設置できます。

では、その導入方法をご紹介しましょう。

VA Social Buzzの設置方法

VA Social Buzzをインストールする

まず、ワードプレスの編集画面を開き、「プラグイン」をクリックし、次に「新規追加」をクリックしてください。

そして右側にある検索窓に「VA Social Buzz」と入力して検索。

そうするとこのようにVA Social Buzzが検索できるので、インストールして有効化してください。
この時点ですでにあなたの記事の下にはバイラル風シェアボタンが現れているはずです。

しかし、このままではFacebookページや、Twitterと連携が出来ていないので正常に稼動してくれません。次にその設定を行いましょう。

VA Social BuzzにFacebookとTwitterを設定する

次に、「設定」の「表示設定」をクリックして、VA Social Buzzの設定記入欄を探します。

この場所が記入欄です。それぞれ記入していきましょう。

テキストや背景色も変えることが出来るので、自分のサイトにあった雰囲気にすることも出来ます。このような部分に「自分らしさ」を演出できると、シェアしてもらえる可能性が大きくアップしますので、いろいろ考えてみると面白いですよ^^。

この記入が終われば、これにてVA Social Buzzの設定はおしまいです。

しかし、ひとつ厄介なのは「Facebook App ID」の入力だと思います。
「そんなのシラネーヨ!!」なんて人が多いのではないでしょうか?正直僕も最初そう思いました。笑

次に、このFacebook App IDの取得方法を解説します!

Facebook App IDの取得方法

まずは、Facebook App ID取得を行うブラウザでFacebookにログインしてください。

そのログインをした上で、

https://developers.facebook.com/

こちらのページにアクセスして「マイアプリ」にカーソルを合わせるとメニューが開きますので「新しいアプリを追加」をクリックしてください。
(※Facebookのログインが出来ていない場合「ログイン」と出てきます)

次にこの画面が出てきますので、「ウェブサイト」を選択。

次にこのような画面が出ます。(下の青いバーには僕の前に作ったFacebook Appが出てきています)
ここには、Facebook Appの名前を入れます。どんな名前でもいいので適当に決めちゃってください。

僕はワードプレス用のアプリだったので「wp」にしました。笑
そんなに悩む必要ないところです。ノリで決めちゃいましょう!!

名前を入力したら「新しいFacebookアプリIDを作成」をクリックしてください。

次にこの画面が出てくるはずです。

アドレスを入力した次の「これは別のアプリのテストバージョンですか?」は『いいえ』のままでOKです。カテゴリーは適当にインスピレーションで選んでください。

そして、アプリIDを作成をクリックすればID作成は完了です!

半角数字15桁からなるIDが発行されていますので、そちらをVA Social Buzzの設定に入力しておきましょう。

これで、あなたの記事にもバイラルメディア風のシェアボタンが出来上がっているはずです。

よい記事を書いて、ガンガンシェアしてもらいましょう!!

この記事も役に立ったらぜひシェアしてくださいね^^

Follow me!