この記事が気に入ったらいいね!

みなさまこんにちは!

最近はずっと家族旅行の記事を書いていたのですが、久しぶりにこのブログもイジろうと思い、かねてからやりたかった記事の最後に付ける「この記事が気に入ったらいいね!しよう」のボタンの取付をしようと思い立ちました!

このボタンを実装する方法はこの記事を書いている時点で大きく以下の3つがあると思います。

  • 1.手書きやコピペで直接コードを書いて実装する
  • 2.この記事が気に入ったらいいね!プラグインを使う
  • 3.VA Social Buzzプラグインを使う

他にも方法はあるのかもしれませんが、パッと思いつくのはこの辺りだと思います。

1の方法はまなしばさんのブログ「ままはっく」で公開されているので、この方法が元祖で一番メジャーなものだと思います。

■まなしばさんのブログ
FacebookページいいねやTwitterフォロワーが倍増!バイラルメディア風オリジナルSNSボタンの設置方法【WordPress】

次に2.はまなしばさんのコードとアイデアを元に作られたWordPressプラグイン「この記事が気に入ったらいいね!プラグイン」です。

これはソースの書き換えを行う事無く、プラグインで実装できるお手軽な方法ですね。

■プラグインページ
この記事が気に入ったらいいね!プラグイン

ただし、このプラグインは上記のサイトからプログラムをダウンロードしてから、WordPressに読み込む必要があります。

そして、今回僕が試した方法はVA Social Buzzのプラグインを使う方法です。

なぜVA Social Buzzを選んだかというと、コードはあまりいじりたく無かったのと、デザインが「この記事が気に入ったらいいね!プラグイン」よりも好きだったという理由だけですw

しかーし!このVA Social Buzz、設定もめちゃくちゃ簡単なんですが、僕が実装するとなぜか肝心の「いいね!」ボタンが表示されないという罠に陥りまして、、、、原因は分かってしまうとめちゃくちゃ簡単な事なので、記事にするのも恥ずかしいぐらいのレベルなのですが、僕と同じくらいのうっかりさんがいるかもしれないので、ここに記録しておきますw

VA Social Buzz

VA Social Buzzは非常に良く出来たプラグインで、設定も超簡単です。

まず、WordPressにログインして、「プラグイン」→「新規追加」に進みます。
検索ボックスに「VA Social Buzz」を入力して検索をするとすぐに見つかりますので、これをインストールして有効化します。

VA Social Buzzの検索結果
※一通りの検証が終わった後にキャプチャーを撮ったので、画像はすでに有効になってます^^;

プラグインを有効にすると、「設定」→「表示設定」の中にVA Social Buzzの設定画面が追加されます。

WordPress管理画面

設定と言っても非常にシンプルで、FacebookページのユーザーネームとTwitterのユーザーネームを入れるだけです。

VA Social Buzzの設定画面

その他の項目はデフォルトのままでも変えても良いですし、FacebookアプリIDも空欄のままでOKです。

普通の人はこれで設定完了!記事の最後の所に「この記事が気に入ったらいいね!」のボタンが表示されるはずなのですが、僕の場合は、、、、

いいね!ボタンが非表示

えええええええーーーー!!!肝心の「いいね!」ボタンが無いやん!!!

ここが泥沼の第一歩でした、、、、

ソースいじりも別プラグインも試してみる!

いいね!ボタンが表示されなかった事で、僕は「このプラグインと僕の環境の相性が悪いんかなぁ〜」と思ってしまい、「おっしゃ!じゃあ他の方法で実装しよう!」と思い立ちました。

そこで、ページ上部でも紹介したまなしばさんのソースをコピペさせていただいたり、「この記事が気に入ったらいいね!プラグイン」を入れてみたりしましたが、どの方法をやってもいいね!ボタンが表示されません!!!

こうなったら他のプラグインが干渉している可能性も考え、その他のプラグインを全部無効にしますが、やはりボタンが表示されません。。。

ええい、ままよ!!

テスト環境に初期状態のWordPressにVA Social Buzzだけを入れてチェック!!!

いいね!ボタンが非表示

、、、、やはりボタンは表示されません。。。

テスト環境なので、なんらかのコードやプラグインの影響も関係ありませんし、サーバーのなんらかの問題の可能性も無い。。。

ここまで来てやっと僕は気付くのです。「これって何かの設定の問題よね。。。」

いいね!ボタンが表示された!

ボタンが表示されなかった時点で設定を疑えばいいのに、その他の所を攻めて行って、かなり大回りしてここの行き着きましたw

原因は設定にありました。

「Facebookページのユーザーネーム」の所に、僕は何を思ったのかFacebookページではなく、個人ページのURLを書いてしまっていたのです!

facebook個人ページURL

そりゃあ「いいね!」も押せないし、ボタンも表示されないはずですよね!!w

これまでFacebookページは作っていなかったので、これも良い機会だと思い、Facebookページも新規で作りましたw

facebookページURL

そして、このFacebookページのURLでVA Social Buzzの設定をやり直します。

vasocialbuzzの正しい設定

すると、、、、

この記事が気に入ったらいいね!

あっさりボタンが表示されました!!!w

いやぁ、初期状態のWordPressを用意して検証するとこまでやって、オチがそこかい!!!!って感じですが、ホントもうどうしようもなくお恥ずかしいですw

今回の一件で得た事はこの一連の「この記事が気に入ったらいいね!」のいいね!ボタンはちゃんとFacebookページのURLで設定しないとボタンすら表示してくれないという事ですねw

こんな記事でもどなたかのお役に立てるとうれしいです♪

もし「役に立ったよ!」という方がいらっしゃれば、↓の「いいね!」ボタンをポチっとしていただけると幸いです☆

この記事が気に入ったら
いいね ! しよう

Twitter で