Facebookで「いいね!」「シェア」されたときのサムネイル画像を指定する方法

自分のブログをシェアしたり、されたときにあまり表示されて欲しくない画像がサムネイルで表示されたりすることがありますが、その画像を意図的に指定する方法があるようです。

OGP (Open Graph Protocol)といわれるものを、<head>~</head>に追加することでできるようで、以下の一行を加えるだけでできます。

<meta property="og:image" content="http://指定したい画像のパス" /> 

今回、指定した画像はこれ↓

 

でも、上記だけでは内部的に情報不足で、Facebookにおいては下記6つが必須なようです。

<meta property="og:title" content="その記事のタイトル" />
<meta property="og:type" content="blog" />
<meta property="og:image" content="http://指定したい画像のパス" />
<meta property="og:url" content="http://シェアするURL" />
<meta property="og:site_name" content="サイト名" />
<meta property="fb:admins" content="1234567890"/>

最後のfb:adminsの設定でfacebookのユーザID

 

以下のサイトでは、シェアした際にFacebookが取得する情報をあらかじめ確認をすることや、足らない情報などを表示することができます。

Link

https://developers.facebook.com/tools/debug

 

OGP (Open Graph Protocol)については以下のサイトが参考になります。

Link

301 Moved Permanently

http://ogp.me/

PAGETOP