ブログ運営

【全ページ画像付き解説】Twitterカードが表示されない時の解決法

困っている人
せっかくツイッターにブログ記事を載せようとおもったのに、ツイッターカードが表示されないんだけど!

エラー画像

あるある!ぼくも最初エラーになって焦ったんだよね!
考えられる原因と、解決方法を探っていくよ!
秋山

Twitterカードって何?という人は

ブログ初心者向け!-Word-pressを始める-全手順-完全解説!←この記事の「wordpressの準備」のところに説明があるよ!

では、対処が単純な順に解決方法を探っていきましょう。

まずは、エラーログを見よう

エラーログを参照する

twitterのカード表示を見るために、card validatorにアクセスしアドレスを入力(①)します。
次に、エラーのログを見ましょう(②)

エラーログ一覧とその原因

エラーログの種類はどれですか?

アイキャッチ画像がない場合

INFO:  Page fetched successfully
WARN:  No metatags found

対処法①へ

All in One SEOのディスクリプション場合が長すぎる場合

ERROR: Required meta tag missing (twitter:text:description)

対処法②

All in One SEO 設定ミスの場合

INFO:  Page fetched successfully
INFO:  20 metatags were found
INFO:  twitter:card = summary_large_image tag found
INFO:  Card loaded successfully

対処法③へ

【対処法①】アイキャッチ画像が設定されていない場合

アイキャッチ画像がない場合

INFO:  Page fetched successfully
WARN:  No metatags found
秋山
このエラーはアイキャッチ画像が設定されていない時に出るよ

対処法①

1.ワードプレスにアクセスする

2.ブログの「投稿一覧」から記事を選ぶ

3.「アイキャッチ画像」を設定する

まず、ワードプレスのダッシュボードにログインしましょう。

そして、左側のメニューから「投稿一覧」を選びます。

投稿一覧を選ぶ

記事投稿の右側に「アイキャッチ画像」の項目があると思います。

項目右側の「▼」をクリックして「アイキャッチ画像を設定」にて設定しましょう。

アイキャッチ画像

アイキャッチ画像を作っていない人は、無料でおしゃれな画像を作れるcanvaで作成してみましょう。

 

これでアイキャッチ画像を設定すれば、ツイートに表示されます。

(少し反映に時間がかかる場合があるようです)

 

【対処法②】All in One SEOのディスクリプションが長すぎる場合

ディスクリプション

All in One SEOのディスクリプション場合が長すぎる場合

ERROR: Required meta tag missing (twitter:text:description)
秋山
このエラーは、記事の説明(ディスクリプション)が「100文字以上」の場合に発生するエラーだよ!

ディスクリプションとは、ブログの内容を簡単にまとめた説明文です。

対処法②

1.記事の説明(ディスクリプション)の文字数を減らす

投稿する記事の下に、All in One SEOの設定項目「説明」があると思います。

ここの文字数を100字未満にすると解決します。

参考

他のエラー原因として、記事の冒頭に画像を貼ってあると発生するようです。

ぼくも実際に経験したとき、1行文字を入れたら解決しました!(2019.9.30追記)

【対処法③】All in One SEO 設定ミスの場合

設定ミス

All in One SEO 設定ミスの場合

INFO:  Page fetched successfully
INFO:  20 metatags were found
INFO:  twitter:card = summary_large_image tag found
INFO:  Card loaded successfully

秋山
このエラーはAll in One SEOの画像設定がおかしいと出るエラーだ!

はい、ぼくが1番手こずったエラーがこれでした。

エラーログは全てグリーン(成功)なのに、なぜか画像が出ません。ググってもなかなか原因が特定できませんでした。

 

これ、実はプラグインの「All in One SEO」の設定ミスでした。

対処法③

1.「All in One SEO」の「ソーシャルメディア」設定へ

2.「画像設定」を「アイキャッチ画像」にして変更保存

対処法としては簡単なのですが、なかなか原因が見つけられなかった…

 

まず、ワードプレスメニュー左側の「All in One SEO」から「ソーシャルメディア」を選びます。

ソーシャルメディア

 

この設定の中にある「画像設定」が「デフォルト画像」になっていませんか?

エラー原因

これがエラーの原因でした。

 

「デフォルト画像」から「アイキャッチ画像」に変更です。

アイキャッチ画像

これで1番下の変更を保存ボタンをクリックすれば解決です。

しばらく時間が経ってから確認すると、twitterカードが表示されるはずです。

秋山
これ、ぼくもやりました!気づいたらいつのまにかブログ自体が表示できなくなってました。

これは原因が「ネームーサーバーがデフォルトに戻された」ことが原因でした。

原因

google search consoleの設定中、知らずにネームサーバー設定をデフォルトに戻していた!

「お名前.com」のドメイン設定はこちらでやり方が確認できます。

もし、ブログ自体が消えていたら、まずはドメインかサーバー設定を確認してみましょう。
 

対処法を行ったら「更新作業」を忘れずに

対処法を行ったら「更新作業」を忘れずに

悩める人
更新作業?…そんな難しそうなことできないかも。
大丈夫!30秒で終わる作業だよ。
秋山

設定を変えたら、ブログのトップページURLをコピーしましょう。

そして、card validatorにアクセスしてコピーしたURLを貼り付けて「Preview card」をクリック。

更新作業

1番最初にこのサイトを使った時にした作業ですね。

なので、誰でもできます。

 

 

 

以上で、解決できたでしょうか?

 

もしだめなら↓からコメントにて問い合わせてください。追記していきます!

-ブログ運営
-, , ,

Copyright© あきやまぶろぐ , 2020 All Rights Reserved Powered by AFFINGER5.