サイト移転しました → GLOSSY

  • 最終更新日:
  • 投稿者: @signpostme

WordPressでFacebookのいいねボタンが正常に動作しない場合の対処法

前回から気になっていたWordPressにFacebookのいいねボタンを配置した時のカウント数の表示がおかしい問題ですが、今回のテーマで修正することが出来ました。WordPressでいいねボタンを使用するときの注意点をメモします。

個別ページのカウント数がトップページのカウント数になっていた問題

個別ページではいいねボタンのカウント数が「0」ではなければいけませんが、トップページのカウント数がそのまま反映されている問題が発生していました。

この問題の対処法としては、「いいねボタンのタグを編集する」、「OGP設定を行う」、「Facebookサーバーに残っているキャッシュをクリアする」です。以下で詳しく解説します。

1. いいねボタンのタグを編集する

fb-like-btn-01

こちらのページでいいねボタンを作成したあと取得できるコードの一部を以下のように変更します。

<div data-href=”<?php the_permalink(); ?>” data-layout=”standard” data-action=”like” data-show-faces=”true” data-share=”true”></div>

上記の赤文字の部分をこのように変更すれば、WordPressの個別記事のURLが自動的に入ってくるので、個別ページごとにいいねボタンのカウントが行われるようになります。前回のテーマの状態ではこの赤文字の部分がトップページのURLのままだったのでカウント表示がバグっていたという単純な理由です。

WordPressでいいねボタンを使用するときは忘れずに変更しましょう。

2.OGP設定を行う

Facebookのウォールに表示される情報を編集します。

<head>内に<meta>タグとして設定します。必ず設定しておきましょう。

なお、個別記事の場合は<meta property=”og:type” content=”article“/>としたほうが良いみたいです。

例 :

<meta property=”og:type” content=”article”/>
<meta property=”og:url” content=”http://www.gl0ssy.net/?p=3815″/>
<meta property=”og:site_name” content=”Glossy : Enjoy Web Life.”/>
<meta property=”og:title” content=”WordPressでFacebookのいいねボタンが正常に動作しない場合の対処法”/>
<meta property=”og:description” content=”前回から気になっていたWordPressにFacebookのいいねボタンを配置した時のカウント数の表示がおかしい問題ですが、今回のテーマで修正することが出来ました。”/>
<meta property=”og:image” content=”http://www.gl0ssy.net/wp-content/themes/glossy3/img/glossy.png”/>
<meta property=”og:locale” content=”ja_JP”/>

3. Facebookサーバーに残っているキャッシュをクリアする

今までの設定を行った後、新しく書いた記事はいいねボタンのカウントが正常に動作するのですが、設定する以前の記事はカウントがトップページのカウントのままでした。

これは、Facebookのサーバーにキャッシュが残ってしまっているからとのこと。

Facebookが提供している「Open Graph Debugger」にてページを再キャッシュすれば解決できます。このツールは、OGPの設定が正常に行われているか確認するためのツールです。意外とよく使うのでブックマークしておきましょう。

Open Graph Debugger

再キャッシュの手順ですが、上記のページヘアクセスしてテキストボックスに再キャッシュしたいページのURLを入力してデバッグします。

スクリーンショット 2014-02-27 10.41.23

これだけで大丈夫です。

ページを確認してみると、いいねボタンのカウント数が「0」に戻っているはずです。(反映には時間がかかることがあります。)

初心者のうちは見落としやすいので注意!

記事をシェアしたいときにいいねボタンを押せないのは不便なので、しっかり設定しておきましょう。

基本的には手順.1を行ったあとに手順.3を行えばカウントは正常になりますが、この際もう一度OGPに関して見なおしてみるのはいかがでしょうか。

新着記事を見る

TOP