ブログを書き始めてしばらく経った方は、
Twitterなどでの紹介・宣伝を考えはじめる方もいるでしょう。
Twitterカードをというものを設定し、
自分のブログをTwitterで紹介されている方が多いと思います。
CocoonではTwitterカードの設定は、
Cocoon設定の中で簡単に行うことができます。
しかし、せっかくTwitterカードを設定したのに、
変更や更新内容が反映されない!というトラブルも発生するようです。
本記事では、このTwitterカードの変更・更新に関して、
以下のような状態で困っている方に向けて、その解決方法をご紹介します!
- Twitterカードに表示される画像を変更・更新したのに、Twitterでつぶやいても
カードの画像が変わらない - 設定を何度も見直して画像を更新しているのにTwitterカードだけ反映されてない
- 各種キャッシュ削除をしたのに反映されない
- 上記を全て行ったのに反映されない!お手上げ状態!
当ブログでは、ブログ初心者の方に向けた悩み解決やノウハウを紹介しています!
ブログ開設初期の皆さんに向けて、
最低限に厳選した設定・すべきことを下記記事でも紹介しています。
Twitterカードの変更・更新が反映されない現象
CocoonでTwitterカードを設定する方法は、
Cocoon設定⇒OGPタブをクリックし画面下の方へ移動すると、


「Twitterカード設定」の欄があります。
ここで、「Twitterカードの有効化」欄で「Twitterカードタグの挿入」を選択します。


その下にある、「ホームイメージ」でTwitterカードに表示させる画像を設定します。
「画像のアップロード」のところで、カードに表示させたい画像を
選択・アップロードするようにしてください。
この手順でTwitterカードの画像を設定するのですが、
TwitterでブログURLを書いた投稿をしても、
表示される画像に選んだ画像が反映されない
という不具合に直面しました。
本来は、設定した画像とともに以下のように表示されるはずでした。
※サマリーでブログアイコンを表示しています


Twitterカードに設定した画像が反映されない主な原因としては、
- トップページにしている固定ページのアイキャッチ画像が未設定
- Twitterカードのキャッシュが残っている
- Cocoonのブログカードキャッシュが残っている
- 画像のアップロードミス
といったことがあるようです。
2つ目以降は割とよくあるトラブルで、解決策なども検索したらたくさん出てきます。
私の場合は、一番目のことが原因でした。
Cocoonを使っている方なら相当数あり得る現象だと思うのですが、
その原因と解決方法にたどり着くまでに相当苦労しました。
同じように困っている方に向けて、解決方法をご説明します!
Twitterカードがどうしても反映されないときの原因と解決法


Twitterカードがどうしても反映されない現象の原因
Twitterカードやブログカードのキャッシュ削除をしても反映されない現象の原因は、
と判明しました。
つまり、サイトURLから最初に入るトップページを固定ページにしている場合、
その固定ページにおける画像の優先度が原因です。
Cocoonでは画像の優先度は以下のようになっていて、
アイキャッチ画像 > SNS画像 > 記事内の画像 > ノーイメージ > OGP画像
固定ページで使っている画像がOGPよりも優先されてしまうため、
OGPで設定した画像が反映されないということでした。
私の場合は、
固定ページ(トップページ)で吹き出しとともに自分のプロフィール画像を使っていたため、
Twitterカードがいつまでたってもプロフィール画像のままでした・・・
固定ページのアイキャッチ画像設定方法
固定ページをトップページにしていて、
Twitterカードの変更・更新が反映されない場合は、
固定ページのアイキャッチ画像を設定しましょう!
固定ページのアイキャッチ画像設定方法は、
固定ページ右側の「投稿タブ」で下の方へスクロールすると、
「アイキャッチ画像」という欄がありますので、
そこでTwitterカードに表示したい画像をアップロードするようにしましょう。


Twitterカードの変更・更新が反映されない不具合の解決法まとめ
Twitterカードに自分の選んだ画像を表示させるために、
Cocoonでは設定の中の「OGPタブ」で設定します。
通常はここで設定するだけで反映されるはずなのですが、
反映されないトラブルに遭遇することがあるようです。
その際はキャッシュの削除などが一般的な解決方法ですが、
Cocoonではそれらを行っても全く反映されないといったトラブルがあります。
原因は、
「固定ページをトップページにしている際に、
固定ページでアイキャッチ画像を設定していないから」
解決方法は、トップページにしている固定ページで、
アイキャッチ画像を「Twitterカードに表示したい画像」にすることです。
私はこれで長時間の格闘の末、無事に解決することができました。