Cocoon画像がソーシャルブックマーク先のサムネに表示された時の解決方法

物事

 

Cocoon画像がソーシャルブックマーク先のサムネに表示される。

タイトル通りですが、私が陥った状態です。

 

結論としては、下記のどちらかの方法で解決します。

・Cocoon設定のOGPタグでホームイメージを変更

・記事にサムネイル画像を設定

 

詳細についてお話しします。

 

スポンサーリンク

 

状況説明

私はWordPressにCocoonのテーマを入れて記事を作っています。

そして、ソーシャルブックマークの1つである「はてなブックマーク」で自分の記事を見てみたところ、サムネがCocoon画像になっていました。

他の記事も見てみると、全てがCocoon画像ではなく、いくつかは記事内の画像がサムネに表示されています。

 

どういうことなんだろう?そもそも、Cocoon画像をアップした覚えもない。

そして、記事内容との関係を考えると、Cocoon画像はちょっと困る。

 

そこで、解決方法を色々調べました。

 

問題点

問題点は下記の3つです。

 

1.記事にサムネイル画像を設定していない

Cocoon画像がソーシャルブックマーク先のサムネに表示されている記事には、サムネイル画像が設定されていませんでした。

サムネイル画像が設定されていない場合、後述のOGPのホームイメージが適用されるようです。

 

2.記事内で「メディアを追加」による画像を使っていない(インスタやツイッターなどの埋め込みしか使っていない)

記事内の画像がソーシャルブックマーク先のサムネに表示されている記事には、「メディアを追加」で入れた画像が使われていました。

どうやらこの画像がサムネイル画像として認識され、ソーシャルブックマーク先のサムネに表示されているようです。

なお、インスタやツイッターなどの埋め込みで入れた画像はサムネイル画像として認識されないようです。

つまり、記事内で「メディアを追加」による画像を使っていない(インスタやツイッターの埋め込みしか使っていない)場合、後述のOGPのホームイメージが適用されるようです。

 

3.OGPのホームイメージの設定不足

まず、OGPとは「Open Graph Protocol」(オープン・グラフ・プロトコル)の略称です。

何かというと、ツイッターなどのSNSでシェアされた時、そのページのタイトルとか概要とかサムネをきれいに表示させる仕組みです。

簡単に言い換えれば、「シェアされた時にリンクをきれいに見せるよ」っていうイメージのやつです。

次に、OGPのホームイメージとは、本来はサイトのトップページのイメージ画像ということです。

ただ、記事にサムネイル画像を設定していない、かつ、記事内で「メディアを追加」による画像を使っていない(インスタやツイッターの埋め込みしか使っていない)場合、このホームイメージに設定された画像がソーシャルブックマーク先のサムネに表示されるようです。

そして、このホームイメージにはデフォルトでCocoonの画像が設定されています。

 

 

以上の結果、Cocoon画像がソーシャルブックマーク先のサムネに表示されてしまったということです。

同じような状態の方は確認してみてください。

 

スポンサーリンク

 

解決方法

解決方法は下記の2つです。

 

1.OGPのホームイメージの設定

ソーシャルブックマーク先のサムネに表示されているCocoon画像はOGPのホームイメージに設定された画像です。

そのため、ここの画像を他に変えれば、Cocoon画像は表示されなくなります。

ちなみに、設定の変更がソーシャルブックマーク先に反映されるには1日くらいの時間がかかるようです。

 

2.サムネイル画像の設定

記事全てにサムネイル画像を設定すれば、ソーシャルブックマーク先のサムネにもその画像が反映されます。

もちろん、記事内で「メディアを追加」による画像を入れて、サムネイル画像扱いさせるだけでも良いです。

 

OGPのホームイメージ変更は必須

記事にサムネイル画像を設定したから、OGPのホームイメージはCocoonのままでいい。

そう思ってはいけません。

 

繰り返しになりますが、OGPのホームイメージとは、本来はサイトのトップページのイメージ画像ということです。

つまり、OGPのホームイメージを変更していないと、サイトのトップページをシェアした時に表示されるサムネはCocoon画像になるということです。

 

サイトがCocoonに特化した内容ならいいかもしれません。

ですが、ほとんどの方は違うと思うので、サイトにあった画像への変更を行いましょう。

Cocoonの公式からもそのようなお触れが出ていますよ。

 

まとめ

Cocoon画像がソーシャルブックマーク先のサムネに表示された時の解決方法は下記の2つ。

・Cocoon設定のOGPタグでホームイメージを変更

・記事にサムネイル画像を設定

 

また、今回の問題解決に関わらず、OGPのホームイメージを変更していない場合は必ず変更しよう。

 

という感じですね。

 

関連記事
物事
明日話したい話題

コメント

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