こんにちは、yujiです。
このブログでは、WordPressを使ったブログ運営について詳しくまとめています。
SNSで記事をシェアしたときに、画像がCocoonのままになってしまいます。好きな画像を表示するにはどうすればいいの？
現在SNSからのブログ記事へのアクセスは、欠かすことのできない流入経路になっています。
しかしSNSで記事をシェアしたときに、以下のようにCocoonのデフォルトの画像で表示される場合があります。
このように、SNSでのブログ記事のシェア画面がCocoonになっており、設定したアイキャッチ画像が表示されていません。
LINEなどでも同様にCocoonの画像が表示されます。
この記事では、こういったSNSシェアで表示される「OGP画像」の設定方法を解説します。
▶【年収7ケタ突破】ブログの収益化の仕組みをすべて解説
▶【無料で本を聞くアプリ】オーディオブックで年間100冊読む方法
▶【初公開】独学で英会話が上達する『5つ』のシンプルな勉強法
▶【実証済み】未経験者の僕が、独学でプログラミングを習得できた勉強法
OGP画像を設定する方法
OGP画像とは？
OGPとは「Open Graph protocol」の略称。
FacebookやTwitterなどのSNSでシェアされた際に、そのページのタイトル・サムネイルなどを正しく表示させる仕組みです。
SNSなどでページを共有したとき、通常の投稿ページならアイキャッチ画像が反映されますが、トップページの場合は「OGP画像」が表示されます。
✔表示されるサムネイル
【通常のページ】アイキャッチ画像
【トップページ】OGP画像
ちなみにOGP画像には画質制限もあります。詳細は以下の通り。
✔OGPの画質制限
・Facebookは最低600×315ピクセル
・Twitter は最低300×157ピクセル
こういった画質が推奨されているので、サムネイルにはこれ以上の画質のものを使います。
OGP画像の設定方法
リンク共有先でのページの印象はサムネイル画像で決まります。つまり、アクセス数にも大きくかかわると思うので、きちんと設定しておくことをおすすめします。
まずは「Cocoon設定」から「OGP」をクリック。
一番下に「ホームイメージ」があるので「選択」をクリックすると、「メディアライブラリ」が表示されます。ここから設定したい画像を選択します。
「画像の選択」をクリックで、元の画面に戻ります。
「変更をまとめて保存」でOGP画像の設定は完了です。
続いて、変更した画像が実際に反映されているか確認します。
OGP画像が反映されているか、確認する
設定が終わったら、OGP画像が変更できているかを確認するためシェアデバッガーでFacebookページのキャッシュをクリアします。
サイトURLを入力し「新しいスクレイピング情報を取得」をクリックします。
シェアされたときのサムネイルのプレビューを更新できます。先ほど設定した画像になっていることが確認出来たらOK。
実際にFacebookで共有してみると、先ほど設定し直したOGP画像が表示されています。
LINEでも変更できました。これでOGP画像の確認が完了です。
サムネイルはサイトや共有したいページの顔でもあるので、うまく利用すれば自分のサイトの情報や印象を相手に正しく伝えることができます。
是非、これを機にOGP画像を設定してみてください！
OGP画像を変更した場合も同じです
ちなみに、OGP画像を変更したときも同様の手順で画像キャッシュをクリアできます。
✔画像キャッシュのクリア方法
▶Facebook…シェアデバッガー
▶Twitter…カードバリデーター
それぞれのサイトでOGP画像の変更が可能です。
この記事が少しでもお役に立てたら幸いです。最後まで読んでいただき、ありがとうございました！
▶【その画像の著作権、大丈夫ですか？】おすすめの『安心のフリー素材サイト』9選
▶【年収7ケタ突破】ブログの収益化の仕組みをすべて解説
▶【無料で本を聞くアプリ】オーディオブックで年間100冊読む方法
▶【初公開】独学で英会話が上達する『5つ』のシンプルな勉強法
▶【実証済み】未経験者の僕が、独学でプログラミングを習得できた勉強法
コメント