FacebookのOGP設定でエラーが出た時の確認事項

FacebookのOGP設定に挑戦してみたのですが、何度やってもデバッガーで「Warnings That Should Be Fixed」「Errors That Must Be Fixed」などのエラーコードが……。最終的には何とか解決できましたが疲労困憊です。

一つ一つ確認していく中で「設定時にこういうミスに陥りやすいのかな」と思う部分があるので、備忘録的に記事にしておきます。同じ状況に陥った人の役に立てばより幸い。

エラーの確認方法

FacebookのOGP設定が正常に行われているかは下記のリンクからチェックできます。

Debugger

 URLを記入して、仮に「Warning~」や「Error~」という文言があったら修正を必要とする箇所があるということです。

以下からは実際に自分が陥っていたミスと解決方法をまとめておきますので、エラーや警告が出て困っている方は宜しければ参考にしてください。

1.コードとプラグインで二重のOGP設定をしていないか

OGPの設定方法は二種類あり「HTMLコードを記入する方法」と「プラグインで設定する方法」があります。OGPを設定できる代表的なプラグインは「All in One SEO Pack」や「Open Graph Pro」などがあります。

自分は「All in One SEO Pack」を使用しているのですが、そっちでOGP設定をしているのにも関わらず、さらにheader.phpにOGP設定コードを記述するというミスをしていました。これだと結果的に二重で設定をしていることになってしまうので、当然エラーの原因となってしまいます。

どちらかの設定を解除しなければならないということですが、個人的にはプラグイン側を解除することをオススメします。プラグインでのOGP設定は不具合も多く、Facebook側で何らか仕様の変更があった際に柔軟に対応することも難しいです。

またプラグインはサイトを重くする原因にもなりやすいので、コードの記述で済ませられる部分はそうする、というのが鉄則だと思っています。

All in One SEO Packの場合はメニューの「Feauture Manager」から「Social Meta」をDeactivateにします。そうした後にコードで設定をすれば競合は回避できます。

screenshot_150-min

画像のようになっていれば「Social Meta」はオフになっている。

2.アプリIDを使っているのに、コードが個人ID用になっていないか

OGP設定をするには個人用IDとアプリ用IDのどちらかが必要になっています。

例えば個人用IDを使用する際はコードの記述は以下の通り。

アプリ用IDを使用する際は以下のようになります。

同じように見えますがadminsと記述されている場合は個人用IDを、app_idと記述されている場合はアプリ用IDを使用しなければならないのがわかると思います。

もうわかると思いますが、自分はアプリ用IDを使用していたにも関わらず、上記の個人用IDの方のコードを使用していました……。「admins」を「app_id」に置き換えたところ、あっさりとエラーを吐かなくなりました。

他サイト様が掲載してくれているコードをまるまるコピペして使用したからこそのミスですね。自分で考えてやらないとこうなるという戒めになりました。

初歩的なミス過ぎて同じ状況になった人はいないかもしれませんが、一応確認してみるといいかもしれません。

3.画像サイズは最適か

設定コードの中には「アイキャッチ画像がない場合」や「トップページや固定ページの場合」に表示する画像リンクを設定する箇所があります。

その時に表示する画像サイズは200×200px以下だとエラーになってしまいますので、サイズはそれ以上にするように気を付けましょう。

画像サイズは1200×630pxぐらいが推奨されているようですが、表示されるサイズは結局470 × 394pxにリサイズされます。どうせリサイズされるのなら小さいサイズを使用するほうが負荷も少なくていいと思うので、自分は470×394pxの画像を用意して設定しています。

デバッグ画面ですが、表示はこのような感じになります。

screenshot_151-min

画像形式は表示が綺麗なPNGがオススメです。画像によってはPNG形式は結構容量を食う場合があるので、事前に圧縮をしておくと良いと思います。

まとめ

以上が僕が陥っていたミスです。初歩的すぎて「そりゃどのサイトにも載っていないわな」という感じですね。

ただ単純な部分こそ見落としがちになるのが人間だと思うので、この記事もそういった人の手助けになれば幸いだと思います。

SNSでもご購読できます。