【Cocoon】トップページが固定ページのOGP画像表示設定

【Cocoon】トップページが固定ページのOGP画像表示設定、木のこちゃんとイボテン

wordPressのテーマCocoonを利用しています!初心者の私にも利用しやすくとってもオススメです!

Cocoonでは仕様でSNSシェアで利用するOGP画像表示の優先度が決まっています、それを知らずに設定していた為最初は画像が想定通りに反映しない事態に。

微妙につまずきやすいポイントなのでその際参考にしたサイトと共に設定方法を紹介します!

スポンサーリンク

OGP画像表示の優先度とは

Cocoon公式フォーラムで確認

Cocoon公式サイトのフォーラムに質問と解説がありました。

アイキャッチ画像とSNS画像に異なる画像を設定すると、SNS画像が優先でした。

そのため、

SNS画像 > アイキャッチ画像 > 記事内の画像 > ノーイメージ > OGP画像

となっているようです。

TOPが固定ページの場合のOGP画像の設定に関して | 不具合報告 | Cocoon フォーラム Ikumiさん投稿より引用

つまり、

  • 「Cocoon設定」のOGP画像より、投稿や固定ページ設定の画像が優先される
  • 投稿ページ・固定ページ共に同じ優先度

より詳細な設定方法は

上記Cocoonフォーラムでわかりやすく解説していたIkumiさんのサイトで、より詳細な設定方法が解説されています。

「Cocoon設定のOGP画像」は優先度が低い

「Cocon設定」→ OGP → ホームイメージ「画像のアップロード」
で設定した画像は、優先度が低いという事ですね。

「Cocoon設定」のOGP画像のアップロード

投稿ページ・固定ページ共に同じ優先度

投稿ページ・固定ページ共に同じ優先度なので分けて考える必要はないそうです。
表示順に気を付けて設定しましょう!

OGP画像表示の設定方法

固定トップページのOGP表示設定

私のサイトはトップページは固定ページです、例にするとこの様になります。
SNS画像を設定しておけば間違いないですね。

【Cocoon】トップページが固定ページのOGP画像設定、SNS画像

SNS画像を設定していない場合

また、SNS画像を設定していない場合はアイキャッチを設定していればその画像がOGP画像になります。

【Cocoon】トップページが固定ページのアイキャッチ画像

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

さらにアイキャッチ画像を設定していない場合は記事内の画像がOGP画像になります。

OGPの表示確認方法

OGPの表示確認したいけどSNSシェアするのも気が引けるし、どうしたらいいの?!

という方、私もまさしく同じでした。
その場合下記のサイトが大変便利でオススメです。

OGPデバッガー・シミュレーターサイト

URLを入力するとそのページのOGPの表示確認が出来ます。
また、画像をアップロードして確認もできます。

対応SNS
  • Facebook
  • Twitter
  • はてなブックマーク
  • LINE

最後に

いかがでしたでしょうか、簡単にまとめてみましたが疑問は解消されましたでしょうか。

この記事が作品紹介等は別にして、ブログ記事として初投稿になります。

今後もWordPressでつまずいて解決した事など、まとめていきたいとおもいます。
末筆ではございますが、今後とも「はじめの森」をどうぞ宜しくお願いいたします。

タイトルとURLをコピーしました