SNSツールにおけるOGP画像のキャッシュの削除方法をいくつかご紹介します。WEB担当者様であれば、SNSツールでのOGP画像について、一度は困ったことがあるのではないでしょうか?
「サイトをローンチした際に、OGP画像を変更したのに更新されない・・・」
「サイト更新時に、OGP画像を変更したが新しいOGP画像が変わらない・・・」
SNSにおけるTwitterやLINE、FacebookでのOGP画像やサムネイル画像が思うように更新されなかった時、第一に確認すべきは「キャッシュの削除」です。OGP画像に限らず、WordPressで設定したアイキャッチ画像(OGP画像)で設定した画像やタイトルが、シェアされたSNS上(Twitter/LINE/Facebook)できちんと反映されない理由の多くは、各SNS上のサーバーでキャッシュが残っている場合がほとんどのケースです。
本記事では、SNSツール内に残るキャッシュデータを更新する「キャッシュクリア方法」をわかりやすくご紹介します。
- OGP画像とは何ですか?
- 【TwitterのOGP画像削除方法】Twitter Developer Platform|Card validator
- 【FacebookのOGP画像削除方法】Facebook for Developers|Facebookシェアデバッカー
- 【LINEのOGP画像キャッシュ削除方法】PagePoker
- 【LinkedInのOGP画像キャッシュ削除方法】Post Inspector
- OGP画像設定時のパスの注意点
OGP画像とは何ですか?
OGP画像とは、SNSでWebページを共有する際に表示される画像のことを指します。サムネイル画像やアイキャッチ画像のことをOGP画像のことを指していることが一般的です。
OGP(Open Graph Protocol)は、Facebookが開発したプロトコルで、Webページのタイトルや説明文、URLなどを指定することができます。OGP画像は、その中の1つで、Webページの内容を表す画像として、SNS上で表示されます。
例えば、TwitterやFacebookでリンクを共有する場合、OGP画像が自動的に抽出され、サムネイル画像として表示されます。OGP画像を設定することで、共有されたWebページを目立たせ、認知度を高めることができる画像のことを指します。
【TwitterのOGP画像削除方法】Twitter Developer Platform|Card validator
https://cards-dev.twitter.com/validator/
Twitterおよび「X (エックス) 」でシェアされたサムネイル画像・OGP画像のキャッシュクリア方法のご紹介です。
Twitterのアカウントを利用してログインした後、開発者向けサイトにある「Card validator」の機能を利用すれば「Twitter Card」のデバックを行うことができます。※2022年11月現在 Twitter Developer PlatformではOG画像のキャッシュ削除はできなくなったようです。
Unable to render Card previewと表示され、プレビュー画像が見えなくなってしまっております。
引用:https://twittercommunity.com/t/card-validator-preview-removal/175006
上記、Twitterからのアナウンスによると「Twitter Developer Platform」でのプレビュー機能を削除し、実際のアプリからの投稿でOGP画像/サムネイル画像の確認をして欲しいという発表がございます。現状では、Twitter上でのOGP画像のキャッシュは最大7日残るともいわれております。
対策としては、bit.lyなどの短縮URLサービスを用い、対象URLを短縮URL変換へさせ、生成後のURLをTwitterアプリで投稿します。投稿によりTwitterのカードクローラーがサイトを再訪することで、クローラーが更新を行うヒントを得れると説明しています。
他にも、Twitterカード用の画像のURLが同一のまま差し替えられた場合、キャッシュの更新が上手くいかない可能性があります。その場合にはページのHTMLで記述しているTwitterカードの画像のURLにパラメータを加えると同じようにクローラーにヒントを与えることができるので、Twitterカードの更新ができそうです。
引用:Twitter、Card Validatorからプレビュー機能を削除。カード情報のキャッシュは最大7日
https://gihyo.jp/article/2022/08/twitter-card-validator-preview-removal
【FacebookのOGP画像削除方法】Facebook for Developers|Facebookシェアデバッカー
https://developers.facebook.com/tools/debug/
シェアデバッガーでは「OGP」のメタタグを再取得することができます。「OGP」のメタタグが正しく記述されていれば、最新のOGP情報が表示されます。
【LINEのOGP画像キャッシュ削除方法】PagePoker
https://poker.line.naver.jp/
2021年頃までは対応出来ていなかったLINEキャッシュの削除もできるようになりました。TwitterやFacebookではキャッシュ削除の方法は存在していたこともあり、LINE公式サイトからの掲載は待望の機能です。
「input URL」に該当URLを入力し、Languageを選び、「Clear Cache」にチェックを入れ登録するだけで、最新のOGP情報が表示されます。
【LinkedInのOGP画像キャッシュ削除方法】Post Inspector
https://www.linkedin.com/post-inspector/
世界最大級のビジネス特化型SNSである「LinkedIn」でもOGP情報のキャッシュ削除をすることができます。指定のURL入力欄に対象URLを入力し「Inspect」をクリックし、検査をしてもらいましょう。
OGP画像設定時のパスの注意点
OGP画像の設定でog:imageの設定したけれども、反映されないという時もあるかと思います。
解消する方法として、下記の方法が考えられますので、ご共有させていただきます。
①OGP画像のパスは相対パスではNG
NG:相対パスとなってしまっている
meta property="og:image" content=".../2021/10/ogp.png/
OK:絶対パスとなっている
meta property="og:image" content="https://ccg-wheads.jp/wp-content/uploads/2021/10/ogp.png/
TwitterとFacebookでは相対パスで記載されていると反映されないことがあるので、ご注意ください。
まとめ
OGP画像(アイキャッチ画像)のキャッシュ削除・meta情報の更新方法はいかがでしたでしょうか?
「サイトやキャンペーンをローンチ・更新した際にOGP画像が変わらない!」というお悩みの際には是非、お試しください!