pipipipi.net

pipipipi.net

約7分で読めます

XやLINEでシェア画像が出ない・古いまま — OGP設定とキャッシュ更新の実践ガイド

XやLINEでシェア画像が出ない・古いまま — OGP設定とキャッシュ更新の実践ガイド

自分のブログや告知ページのURLをXやLINEでシェアしたら、画像が出ずにリンクだけの味気ない表示になった。あるいは、記事を更新して画像を差し替えたのに、SNS上ではいつまでも古い画像のまま——こうしたトラブルは珍しくありません。

原因は大きく分けて「そもそもページ側の設定が不十分」なパターンと、「設定は正しいのにSNS側のキャッシュが古いまま」なパターンの2つです。この記事では症状別に原因と対処法を整理します。

目次

症状1:画像がまったく表示されない

リンクを貼っても画像枠自体が出ず、タイトルとURLだけの表示になるケースです。主な原因は次の3つです。

og:imageタグが設定されていない

シェア画像はページの内側に埋め込まれたog:imageというメタタグで指定します。このタグ自体が抜けていれば、SNS側は表示すべき画像を認識できません。ページのHTMLソースを開いて、head内にog:imageタグがあるかをまず確認します。

画像URLが相対パスになっている

og:imageの値が「/images/thumbnail.png」のような相対パスになっていると、SNSのクローラーが正しく画像を取得できないことがあります。og:imageは「https://」から始まる絶対URLで指定するのが仕様上の前提です。当サイトのツールページでも、設定した画像パスを絶対URLに変換してから出力する作りにしています。相対パスのまま公開していないか確認してください。

SNSのクローラーがブロックされている

サーバー側のrobots.txtやアクセス制御で、SNSのクローラー(XならTwitterbot、Facebookならfacebookexternalhit等のユーザーエージェント)を締め出していると、画像もページ情報も取得できません。汎用的なbot拒否設定を入れている場合は、シェア用クローラーが除外されていないか見直します。

症状2:画像を更新したのに古いままSNS上に残る

ページ側のog:imageは正しく新しい画像を指しているのに、Xでは差し替え前の画像が表示され続けることがあります。これはほとんどの場合、ページ側ではなくSNS側のキャッシュが原因です。

Xにはかつて公式のカードプレビュー確認ツール(Card Validator)がありましたが、プレビュー表示機能は2022年に廃止されており、2026年時点で公式の強制再取得ツールはありません。同様にLINEにも公式のキャッシュクリアツールは用意されておらず、有志が使っていた非公式ツールも2025年半ば以降に停止したと報告されています。

つまり「ボタン一つでキャッシュを消す」公式手段が今はどちらのSNSにも存在しない、というのが実情です。代わりに次のような回避策が使われています。

  • URLの末尾にダミーのクエリパラメータ(例:“?v=2”)を付けて共有する。SNS側は別URLとして扱うため、新規にページ情報を取得しにいく
  • 一度シェアしてしまった投稿・メッセージ自体は、後から画像だけ差し替えることはできない。古い画像のまま固定される。新しい画像を反映させたい場合は、投稿や送信メッセージを削除し、クエリパラメータを変えたURLで新たに投稿し直す必要がある

Facebook(Instagram含む)については、開発者向けのSharing Debuggerというツールが引き続き提供されており、URLを入力して「もう一度スクレイピング」を実行すればキャッシュを強制更新できます。X・LINEとの対応の差として覚えておくとよいでしょう。

症状3:画像は表示されるが上下や左右が切れる

画像自体は表示されるものの、意図した構図と違う位置でトリミングされてしまうケースです。これはSNS側がシェアカードの表示枠(多くは横長)に合わせて画像を自動的に切り抜くために起こります。

対処の基本は次の2点です。

  • 画像サイズは1200×630px前後、横縦比でおよそ1.91:1を目安にする。これが多くのSNSで安全に収まる標準的な比率
  • 文字やロゴ、人物の顔など見せたい要素は、画像の中央付近(全体のおよそ8割以内)に収める。四隅・端ギリギリに配置すると、クロップで切れやすい

なお、og:image:widthとog:image:heightのメタタグが未設定だと、SNS側が画像サイズを把握できないまま最初の取得を行い、初回シェア時だけ画像が空白になることがあります。可能であれば画像のサイズ情報も併せて出力しておくと安定します。

設定を確認する・見え方を試す

原因の切り分けには、自分でHTMLソースを1つずつ確認するより、ツールでまとめて確認する方が早く確実です。

OGPチェッカーは、URLを入力するとog:imageをはじめとするOGPメタ情報を取得し、Facebook・X・Slack・Discord・LINEでの表示イメージをまとめてプレビューできます。og:imageの有無や画像サイズが推奨値(1200×630px)を満たしているかも自動で判定されるので、症状1・症状3の原因切り分けに使えます。

投稿本文側の見え方(Xでの文字の折り返し位置や「さらに表示」が出る境界など)を事前に確認したい場合は、SNS投稿プレビューでリアルタイムに確認できます。画像とあわせて投稿全体の見え方を事前チェックしておくと、公開後の手戻りを減らせます。

まとめ

症状疑うべき原因
画像が全く表示されないog:image未設定・相対URL・クローラーのブロック
更新したのに古い画像のままSNS側のキャッシュ(X・LINEには公式の強制更新ツールなし)
画像の一部が切れる縦横比が1.91:1から外れている・要素が端に寄っている

X・LINEともにキャッシュを即座に消す公式手段がない以上、「最初から正しいog:imageを設定しておく」「一度シェアされた投稿の画像は変えられない前提で運用する」の2点が実務上の落としどころです。公開前にOGPチェッカーで一度確認しておくことをおすすめします。

関連記事