X（Twitter）カードが表示されないときに確認すること

2026.02.13 09:00

2026.03.16 13:32

ブログ記事をX（旧Twitter）でシェアしたとき、「あれ、カード出ない…」ってなったことありませんか。
自分はこれで何度もハマりました。画像が出ない、タイトルが違う、そもそもリンクだけのテキストになる、みたいな。

調べてみると、原因はだいたい決まっていて、OGPタグの設定ミスか、キャッシュか、画像の問題か、のどれかでした。
今回は自分がデバッグしたときに確認したポイントをまとめておきます。

そもそもXカードの仕組み
1. OGPタグが正しく入っているか確認する
2. 画像のサイズ・形式を確認する
- summary_large_image の場合
- summary（小さいカード）の場合
3. Card Validatorでの確認方法（2026年現在）
- サードパーティのOGP確認ツールを使う
- 実際にポストして確認する
4. キャッシュの問題と対処法
- キャッシュを更新する方法
5. WordPressプラグインでの設定ポイント
6. よくあるハマりパターン
デバッグの手順まとめ

そもそもXカードの仕組み

Xでリンクを投稿すると、Xのクローラーがそのページを読みに行って、HTMLの<meta>タグ（OGPタグ）から情報を取得します。
タイトル、説明文、画像、カードの種類などがここで決まります。

つまり「カードが出ない＝OGPタグに問題がある」か「クローラーがページを読めていない」か、のどちらかです。

1. OGPタグが正しく入っているか確認する

まず最初に確認したのはここでした。ページのソースを開いて、<head>の中に以下のmetaタグがあるかチェックします。

<meta property="og:title" content="記事のタイトル" />
<meta property="og:description" content="記事の説明文" />
<meta property="og:image" content="https://example.com/image.jpg" />
<meta property="og:url" content="https://example.com/page/" />
<meta name="twitter:card" content="summary_large_image" />

特に重要なのは以下の4つです。

og:title：カードに表示されるタイトル
og:description：カードに表示される説明文
og:image：カードに表示される画像のURL（絶対パスで、https必須）
twitter:card：カードの種類。summary（小さい正方形画像）かsummary_large_image（大きい横長画像）が一般的

ブラウザでページを開いて「ソースを表示」して、これらが出力されているか見てみます。
ここが抜けていたら、そもそもカードは表示されません。

2. 画像のサイズ・形式を確認する

OGPタグがあっても画像で引っかかることが多かったです。
Xの画像要件はこんな感じです。

summary_large_image の場合

推奨サイズ：1200 x 630px（アスペクト比 1.91:1）
最小サイズ：300 x 157px
最大ファイルサイズ：5MB以下
対応形式：JPG、PNG、GIF、WEBP

summary（小さいカード）の場合

推奨サイズ：240 x 240px以上（正方形）
最小サイズ：144 x 144px
最大ファイルサイズ：5MB以下

自分がハマったのは、画像が大きすぎるパターンでした。一眼で撮った写真をそのまま使ったら数MBあって、カードに画像が出ませんでした。
リサイズして1200px幅くらいにして、ファイルサイズを数百KBに抑えたら解決しました。

3. Card Validatorでの確認方法（2026年現在）

以前はX（Twitter）公式の「Card Validator」でプレビュー確認ができたのですが、2022年8月にプレビュー機能が廃止されました。
現在は https://cards-dev.x.com/validator にアクセスしても、以前のようなプレビュー表示はできません。

じゃあどうするかというと、代替手段がいくつかあります。

サードパーティのOGP確認ツールを使う

OGP Checker（web-toolbox.dev）：URLを入れるだけでOGPタグの内容とプレビューが確認できる
SocialPreviewHub（socialpreviewhub.com）：X向けのカードプレビューに特化
OpenTweet（opentweet.io）：ログイン不要でXカードのプレビューが見られる

自分はOGP Checkerをよく使っています。FacebookとXの両方のプレビューが一度に確認できるので便利です。

実際にポストして確認する

最終的にはこれがいちばん確実です。
テスト用のアカウントや、投稿後すぐ削除する前提で、実際にURLをポストしてカードが出るか見ます。
ただし一度ポストするとキャッシュが作られるので、修正後の確認にはちょっと注意が必要です（後述します）。

4. キャッシュの問題と対処法

これがいちばん厄介でした。
OGPタグを修正しても、Xにはすでにキャッシュが残っているので、すぐには反映されません。
Xのキャッシュは最大7日間保持されます。

キャッシュを更新する方法

URLにクエリパラメータを付ける（いちばん手軽）
URLの末尾に ?v=2 や ?20260315 のようなパラメータを付けてポストすると、Xは「別のURL」として認識して、OGP情報を新しく取得してくれます。これがいちばん確実で簡単でした。
7日間待つ
何もしなくても、最大7日でキャッシュは自動的にクリアされます。急ぎでなければこれでもOKです。
短縮URLを使う
bit.lyなどの短縮URLサービスで新しいURLを生成してポストするのも手です。Xからは別URLに見えるので、新しくOGPを取得してくれます。

自分は「クエリパラメータ方式」をよく使っています。記事URLに ?v=2 を付けるだけなので、いちばん手軽です。

5. WordPressプラグインでの設定ポイント

WordPressの場合、OGPタグを手動で書くよりもSEOプラグインに任せるのが楽です。
代表的なプラグインでの設定箇所をまとめます。

All in One SEO（AIOSEO）の場合

管理画面の「All in One SEO」→「ソーシャルネットワーク」→「X（Twitter）」タブを開く
「Twitterカード」を有効にする
デフォルトのカードタイプを「大きな画像付きの概要（summary_large_image）」に設定
デフォルトの投稿画像ソースを「アイキャッチ画像」に設定
変更を保存

記事ごとに個別設定したい場合は、投稿編集画面の下部にある「AIOSEO設定」→「Social」タブから、X向けのタイトル・説明文・画像を個別に指定できます。

Yoast SEOの場合

「SEO」→「ソーシャル」→「Twitter」タブで、カードタイプを設定
投稿ごとの設定は、投稿編集画面のYoastメタボックスの「ソーシャル」タブから

SWELL（テーマ）の場合

SWELLなどの高機能テーマにはOGP出力機能が内蔵されていることがあります。
その場合、SEOプラグインのOGP機能と重複しないように気をつける必要があります。OGPタグが二重に出力されると、Xが正しく読み取れなくなることがあるんですよね。

確認：OGPタグが重複していないか

プラグインとテーマの両方がOGPを出力すると、同じmetaタグが2個出てしまいます。
ページのソースを確認して、og:titleやtwitter:cardが複数出力されていたら、どちらか一方をオフにすればOKです。

6. よくあるハマりパターン

自分が実際にハマったものや、よく見かけるパターンをまとめます。

og:imageが相対パスになっている

これが意外と多いです。

<!-- NG: 相対パス -->
<meta property="og:image" content="/wp-content/uploads/image.jpg" />

<!-- OK: 絶対パス（https） -->
<meta property="og:image" content="https://example.com/wp-content/uploads/image.jpg" />

Xのクローラーは相対パスを解釈できないので、https://から始まる絶対URLにする必要があります。

httpsではなくhttpになっている

サイトをSSL化しているのに、OGPの画像URLだけhttp://のままになっているケースです。
Xはセキュリティ上の理由でhttp://の画像を取得しないことがあります。
WordPressの「設定」→「一般」のサイトURLがhttps://になっているか確認してみてください。

画像ファイルが大きすぎる

5MBを超える画像はXに読み込まれません。
一眼レフの写真やPNG形式の大きな画像をそのまま使っていると、引っかかりやすいです。
1200px幅にリサイズして、JPGなら200〜500KB程度に収めるのが安心です。

アイキャッチ画像が設定されていない

WordPressでSEOプラグインを使っている場合、OGP画像のソースが「アイキャッチ画像」になっていることが多いです。
記事にアイキャッチを設定し忘れると、og:image自体が出力されないことがあります。
これ、意外と気づきにくいんですよね。

robots.txtやnoindexでクローラーをブロックしている

Xのクローラー（Twitterbot）がページにアクセスできないと、OGP情報を取得できません。
robots.txtでブロックしていないか、ページにnoindexタグが入っていないか確認してみてください。

# robots.txt でこうなっていたらNG
User-agent: Twitterbot
Disallow: /

サーバーの応答が遅い

Xのクローラーはタイムアウトが短めなので、サーバーの応答が遅いとOGP情報を取得できずにカードが表示されないことがあります。
共有サーバーでアクセスが集中しているときなどに起きやすいです。

デバッグの手順まとめ

カードが表示されないときは、以下の順番で確認するとスムーズです。

ページのソースを開いて、OGPタグ（og:title, og:description, og:image, twitter:card）が出力されているか確認
og:imageのURLが絶対パス・httpsになっているか確認
画像のサイズが要件を満たしているか確認（5MB以下、推奨1200x630px）
サードパーティのOGPチェックツールでプレビューを確認
OGPタグが重複出力されていないか確認
robots.txtやnoindexでクローラーをブロックしていないか確認
修正後はクエリパラメータを付けてキャッシュを回避

だいたいこの流れで原因が見つかります。
自分の経験上、いちばん多かったのは「画像が大きすぎる」と「キャッシュが残っている」の2つでした。

OGPの設定はちゃんとできていたのに反映されなくて、「なんで！？」ってなったとき、だいたいキャッシュが原因でした。
クエリパラメータを付けるだけで解決するのを知ってからは、だいぶ楽になりました。

今回は以上です！