FacebookにURLを投稿する際に、うまく画像が表示されなかったり、思っていた画像と違ったものが表示されることってありますよね？
「OGP」という設定ができているサイトであれば設定通りの画像が表示されるんですが、処理がうまくいかなかったり、変更したのにキャッシュが残ってしまっていて画像が新しいものに切り替わらないという現象が起きてしまうんです。
そんな時のために、「デバッガー」というツールの使い方について解説します。
Facebookのデバッガー
FacebookへURLを投稿する際のURLやタイトルの表示は「OGP」というもので制御してまして、それがちゃんと設定できているかどうかをチェックするツールが「Open Graph Debugger」、通称「デバッガー」です。
Facebookに投稿する時、こんな具合に記事のタイトルなどは表示されるものの画像が表示されないっていうことがあると思います。
そんなときに下記のデバッガーにアクセスして、正しい表示ができるようにチェックしましょう。
使い方は簡単で、該当する記事のURLを入力して、右側の「デバッグ」ボタンを押すだけ。
そうするとこんな具合にちゃんと設定されているかどうかが表示されます。ここでエラーが表示されたら指示に従ってエラーを修正しましょう。真ん中あたりの「もう一度スクレイピング」ボタンを押して解決することもありますので、こちらも何度か押してみてください。
デバッガーでやることはこれだけ。改めてまとめると
- URLを入力する
- デバッグボタンを押す
- エラーが出てたら修正
- 画像が出てなければ「もう一度スクレイピング」を試してみる
といった感じです。
これで画像が表示されるようになりました。
Twitterで画像やタイトルの変更を反映させるには？
今回紹介したのはFacebookでの作業手順でしたが、Twitterでも同じようにURL付き投稿をする際にタイトルや画像が更新されないことがあります。
Facebookでのデバッガーにあたる、「Card Validator」というTwitter公式のツールが用意されており、詳細は下記のページにまとめてます。気になる方はチェックしてみてください。
最後に
今回紹介した方法は、キャッシュを削除して正しい表示にしていまして、画像を変更した際にも有効な方法です。
Facebookへシェアする際にうまく表示されてないと思ったらお試しください。