WordPress ブログの悩み

【Twitterカードが表示されない】修正/確認方法を簡潔まとめ

この記事で解決する悩み

  • 急にTwitterカードが表示されなくなって困った…
  • 何でこんなことに…どうすれば修正できるの?
  • Card validator使ったらエラーが出ている…
  • お手上げ…だれか助けて…
しょうだい
わかる!ストレスフルだよね!

Twitterカードが表示されない状況を解決した方法を紹介します。

この状況に陥ると「記事を書きたいのにTwitterカードの不具合が気になってはかどらない!」、「Twitter集客がメインだったのに全然うまく機能しない!」みたいな気持ちに支配されてモヤモヤした生活を送ってしまいますよね。

しょうだい
この記事解説で90%は解決すると思うよ

では、さっそく結論から話します。

Twitterカード不具合の修正/確認方法はこれ

  1. Card validatorで正しい表示になっているか確認する
  2. Card validatorで古いキャッシュを削除してみる
  3. キャッシュ削除で治ったならこれで解決
  4. そもそもLOGにエラー出ているならWordPerssを確認
  5. 「プラグインを最新に更新してない」がよくあるミス
  6. プラグインを最新に更新したあとCard validatorで再確認
  7. だいたいこれで修正できる
  8. これでも修正できない場合は直近の作業を振り返ってみる

たいていのバグはCard validator(カードバリデーター)でTwitterカードのキャッシュ情報を更新すると解決します。それがだめだった場合は②WordPerssブログのプラグイン更新忘れをチェックしましょう。

しょうだい
1つずつ順番に解説するね

 

 

①Card validatorでTwitterカードのキャッシュを更新する方法

Twitter公式サービスとして「Twitterカードの表示の確認/更新をチェック」するCard validator(カードバリデーター)というサイトがあります。Card validatorにログインして次の手順を行ってください。

しょうだい
超簡単な作業だよ

TwitterカードにしたいブログURLを「Card URL」に入力し「Preview card」をクリックする

card validatorにTwitterカードにしたいURLを入力する

上図のように、TwitterカードにしたいURLを入力欄に打ち込みます。

入力が完了したら「Preview card」をクリックして下さい。

 

Twitterカードが正しく表示されるまで「Preview card」をクリックしてみる(キャッシュ更新)

card validatorでURLを入力し「Preview card」をクリックする

確認順序

①上図の赤エリアに正しくTwitterカードが表示されているか確認

②Twitterカードが表示したい見た目になっていればOK

③上図のようにアイキャッチ画像を設定したのに表示されていない場合は「Preview card」(緑エリア)を再度クリックしてみる

④「Preview card」をクリックするとキャッシュを更新するので最新のTwitterカード表示に切り替わるはず

⑤今回Logは緑の表示なので問題なし

⇒古いキャッシュが邪魔している状態なので「Preview card」をクリックしてキャッシュ更新すればOK

 

正しく表示されたらこんな画面になる(例)

Twitterカードが正しく表示された

キャッシュが古かっただけであればこんな感じにTwitterカードが表示され問題は解決です。

Twitterでツイートしてみましょう。

しょうだい
次はLogにエラーが出ている時の修正方法を解説するね

 

②WordPerssブログのプラグインを最新に更新する方法

カードバリデータでエラー発生(フェッチできない)

 

 

 

このようにLogに「ERROR: Failed to fetch page due to: HttpConnectionTimeout」と出る場合はWordPerssブログのプラグインをチェックしてみましょう。

この場合、古いキャッシュが邪魔しているのではなくてプラグインが邪魔している可能性が高いです。

しょうだい
ということで、WordPerssブログの管理画面に移動しよう

 

ダッシュボード「更新」をクリック

プラグインの更新忘れを確認する

 

「プラグインを更新」をクリックする

「プラグインの更新」をクリックする

切り替わった画面で「プラグインを更新」をクリックすれば完了です。

やることは超シンプル、これだけです。

しょうだい
あとは一定時間待ったあともう一度Card validatorから正しく表示されているか確認してみよう

メモ

プラグインを更新してもうまく表示されない場合は、「表示されなくなった直前のブログ更新で普段と異なる何かをしなかったか」を思い返してみましょう。直前で新しい取り組みをしていた場合、それが不具合の原因の可能性かもしれないのでいったんリセットしてみましょう。

 

③Twitter側の不具合の可能性だってある

キャッシュが古いわけでもなく、プラグインも最新で何も問題がなさそうな場合は「Twitterアプリのバグ」を疑ってみましょう。

こちらから修正する行動は起こせませんが、Twitter側の問題だと理解できれば無駄な作業をしなくて済みます。

Twitterのキーワード検索を利用して他アカウントでも同じ悩みを発信している人がいないかチェックしてみましょう。

しょうだい
同時期に同じ悩みがたくさんあればTwitterバグの可能性があるよね

 

【体験談】苦しみ嘆いているツイートでもどうぞ

最後に悩んでいる時期の私のTweetをどうぞ。

しょうだい
誰でも壁に衝突するから気休めに読んで

内心は「なんでうまくいかないだよぉー!!!」

Twitterにつぶやいてる時点で内心抑えきれてないですよね 笑

しょうだい
↑おやすみと言いつつも眠れてないよ

問題が解消したらものすごく喜んでますね笑

喜びを抑えているつもりでしたが喜びが抑えきれてない…。

しょうだい
みんな悩みつつブログ作ってるから頑張ろう

 

【備考】Twitterカード設定を簡単に操作できる有料テーマ紹介

ちなみにTwitterカードって4種類の表示方法があるのをご存誌ですか?

Twitterカードの種類はこの4つ

  1. Summary Card
  2. Summary Card with Large Image
  3. App Card
  4. Player Card

私はSummary Card with Large Imageで設定しているので上図のような大きな画像で表示されます。

有料テーマを利用していれば超簡単にTwitterカードを設定できおすすめです。おすすめのテーマはAFFINGER5です当サイト(副業サラダ)が利用している有料テーマなので同じように設定したい方は購入を検討してみても良いかと思います。(解説記事も参考にどうぞ↓)

ブログ初心者だからこそ有料テーマに頼るべき
個人ブロガー必見!稼げる有料WordPerssテーマ5選
副業におすすめ!稼げるワードプレス有料テーマ5選を比較評価&解説

続きを見る

 

以上「【Twitterカードが表示されない】修正/確認方法を簡潔まとめ」でした。

 

  • この記事を書いた人

やのしょうだい

副業サラダ管理人。"ブログ副業"を中心に副業で稼ぐ方法を紹介しています。頑張る会社員さん、将来が不安な大学生さん、自由を求めるフリーターさんのサポートサイト。"好き"と"得意"で収入を作ろう。埼玉県在住の2児のパパです。FXトレーダー10年目🌊🏄💹

-WordPress, ブログの悩み