ツイッターにリンクを張り付けて投稿した際に、普段ならツイッターカードが表示されるのになぜかその記事に限って表示されずに困ったことはありませんか？
Card validatorに表示されたエラーログはこれ。
ERROR: Fetching the page failed because the request timed out.
そしてわたしの場合、原因はプラグイン「Pz-LinkCard」にありそうでした。
そこで今回はツイッターカードが表示されない時の対処法！原因はプラグイン？と題して、ツイッターカードが表示されずCard validatorに先ほどのエラーログが表示されるときのわたしのケースの対処法をご紹介したいと思います。
目次
ツイッターカードとは？
ツイッターカードとは、ツイートに記事URLを入力するとアイキャッチ画像（サムネイル）やページタイトルなどが記載されたリンクが表示される機能です。
こんなやつですね！
ドラマ年下彼氏5話ロケ地はBIGHOPガーデンモール印西でした。西畑大吾くんがあーんされてたのはKEY’S CAFE。
6話で西村拓哉くんと小島藤子さんが座ってお喋りしてた場所も発見〜😆https://t.co/LihgrqQ1Tl
— さーち (@sear_chi) April 25, 2020
設定によって小さく表示されたり大きく表示されたりと大きさが変わります。
これからの季節、冷感マスクにはユニクロのエアリズムの素材の夏用マスクも気持ち良さそう😆
ハッカ油もナイスアイデア😇#ナツノマスクhttps://t.co/ymOPAJx6KS
— さーち (@sear_chi) May 14, 2020
Twitterカードの設定をしていないとツイートに記載したURLが文字で表示されているだけで、画像や記事タイトルは表示されません。
Twitterカードで表示させない場合はツイートのリンクを載せた時のインパクトが全然違います。
古いツイートではよくツイッターカードがないものもよく見られますね。
新しい記事を投稿しました: Mステ2月27日 嵐 Sakura full 大野くんのキメ顔(アップ) 口パク？Jr.時代(８時だJ)のニノと相葉くんが可愛い！トーク(翔くんにクッションのお土産)・演出・内容・感想レポート！ http://t.co/gcrg0vEMYP
— white (@cilWhite) February 27, 2015
本来はツイートにURLを入力すると自動でこれをやってくれるんですが、今回のわたしの場合はツイッターカードの表示設定をしているのにもかかわらずツイッターカードが表示されなかったことで悩んでいました。
ツイッターカードが表示されない問題の解決までの経緯
ツイッターカードが表示されない問題の解決までの経緯をひとつずつご紹介したいと思います。
まずツイッターカードが表示されないことに気が付いたのは、新しい記事を書いたことをしらせるツイートをしようとした時です。
いつものようにURLをコピペしたにも関わらずなぜかツイッターカードが表示されませんでした。
そこでCard Validatorを確認しに行きました。
Card Validatorでツイッターカードを確認してみる
ツイッターカードの調子が悪いときは「Card validator」のお世話になっています。
Card ValidatorはTwitterの公式サービスです。
Card Validatorに確認したい記事のURLを入力するとツイートのTwitterカードがどのように表示されるか確認することができます。
またキャッシュの削除もしてくれるのか、記事投稿後にアイキャッチ画像を差し替えてツイッターカードが古いままだったりする時に最新のツイッターカードに更新するためによく使っています。
使い方はCard Validatorを開いて、ツイッターカードを更新したい「URLを入力」し、「Preview card」ボタンをクリックします。
問題なく設定ができていれば、Card preview欄に最新の状態のTwitterカードが表示されます。
ですが今回のわたしの場合は、ツイッターカードが表示されない代わりに「Unable to render Card preview」と太字で表示され、Log欄にはエラーが表示されていました。
Card validatorに表示されたエラーログの意味は？
エラーのログにも種類があるみたいですが、わたしに表示されていたエラーログはこれです。
ERROR: Fetching the page failed because the request timed out.
翻訳：エラー：リクエストがタイムアウトしたため、ページの取得に失敗しました。
このエラーの対処法をグーグル先生に聞いてみたところ、『URLの末尾に「?abcdef」をつける』とか、『メタタグ』がどうとか、『HTTPSの時だけ発生する』といった話があがっていたのですが、なんとなくどれにも当てはまっていなさそうな気がしました。
そこでエラーログの意味を考えてみることに。
エラーログにはリクエストがタイムアウトとあるように、たしかにツイッターカードをつけようとしていた記事の読み込み速度が異常に遅かったんです（なぜか10秒くらいかかった）。
画像を過剰に貼り付けているわけではないし、どういうわけかわからないけど言われてみれば確かに重いな～という感じでした。
タイムアウトを避けるために記事の中身を一時的に消した
この時点では何が原因なのか気づいていなかったのですが、とりあえず記事を思いっきり軽くすればタイムアウトしなくなってツイッターカードが表示されるようになるのでは？という考えにいたりました。
そこでツイッターカードが表示されない記事内の画像やリンクがすべて消えるように大部分を一時的に削除し、もう一度Card validatorでどのように表示されるのかチェックしてみました。
すると狙い通り、ツイッターカードが正しく表示されているではないですか！
Card validatorでツイッターカードが正しく表示されていることを確認できたので、その後は一時的に削除していた記事を元に戻して無事解決しました。
※記事内容を元に戻してからツイートしてもそのツイッターカードは正しく表示されていました。
同じエラーログが出た人は、おそらくはこの方法で解決するケースもあるかと思います。
原因はプラグインPz-LinkCard？
結局のところ、ツイッターカードが表示されなかった原因は、「記事の読み込みがなぜか不自然に重かったから」といったところにありました。
なんでこんなに重かったのか、気になる部分が見つかりましたのでメモしておきたいと思います。
わたしは「Pz-LinkCard」というプラグインを使っています。
このプラグインは外部リンクをリンクカードで表示してくれるものです。
テキストリンクだと上な感じのリンクになりますが、「Pz-LinkCard」のプラグインを使うと下の感じのリンクで表示してくれます。
このプラグインを使ってユニクロのトップページへのリンクを貼ると、理由はよくわかりませんが読み込みが妙に遅く10秒くらいかかっていました。
「Pz-LinkCard」をつかったユニクロのリンクカードを消した場合、記事の読み込み時間が3秒ほどに改善しました。
Card validatorにはリンクカードで外部リンクを表示しても全く問題ないのに不思議！！
「Pz-LinkCard」はリンク先との相性もあるのかもしれません。
スポンサーリンク
ツイッターカードが表示されない時の対処法！原因はプラグイン？まとめ
今回はツイッターカードが表示されない時の対処法！原因はプラグイン？と題して、ツイッターカードが表示されずCard validatorに先ほどのエラーログが表示されるときのわたしのケースの対処法についてまとめました。
わたしの場合は記事の中身を一時的にごっそり消して、さきにツイッターカードをツイッターに反映させてから記事の中身を元に戻す、といった手順で解消しました。
もし同じようなケースでお困りな方は一応試してみてくださいね！
ただ、もしかしたら「Pz-LinkCard」で作ったリンクを消すだけでも解消できたのかもしれません。
今後似たようなケースが起きれば検証してみたいと思います。
それでは今回も最後まで読んでいただきありがとうございました！
