ブログのアイキャッチ画像がX（旧Twitter）で表示されない問題に悩んでいませんか？この記事では、その問題を簡単に解決する方法をご紹介します。
アイキャッチ画像の重要性
アイキャッチ画像は、読者の関心を引き、記事の内容を視覚的に伝える重要な要素です。Xで適切に表示されない場合、記事の魅力が半減してしまいます。
Card Validatorでカード情報を更新する方法
XのCard Validatorを使ってキャッシュを更新し、正確なメタデータが表示されるようにします。以下の手順で設定を確認しましょう：
- Card ValidatorにURLを入力
- 「Preview Card」ボタンをクリック
- 表示内容を確認し、必要に応じて修正
Card validatorではTwitterのキャッシュ更新ができます
Card URLにブログ記事のURLを入力してPreview cardをクリックしてアイキャッチ画像が表示されればOKです。
表示されない場合の追加対策
この場合、ブラウザのキャッシュの削除が有効なことが多いです。古いデータが優先されているケースで、更新が反映されないことがあります。
ブラウザキャッシュのクリア: 表示が更新されない場合、ブラウザのキャッシュをクリアすることが推奨されます。
Safariの場合
キャッシュを空にする
Chromeの場合
その他の設定→その他のツール→閲覧履歴を消去
その他のブラウザの場合
同様に設定などから、キャッシュまたは閲覧履歴を消去 でOKです。
再度Card Validatorでカード情報を更新してみてください。
Card validatorのプレビュー機能は廃止に
２０２２年７月頃からCard validatorのプレビュー機能が廃止になったようです。
そのため何度試してもプレビューは表示されず、Unable to render Card previewと表示されます。
でも、よく見るとLogの表記にINFO: Card loaded successfully（カードのロードは成功）と表示されればちゃんと反映されるようです。
私もプレビュー表示されませんでしたが、少し待っていたところ反映されていました。
まとめ
Xでのアイキャッチ画像表示問題は多くの場合、キャッシュが原因となります。対策をおこなっていきましょう。
