これはfacebook側というよりはホームページ側のテクニックです。
ホームページをfacebookでシェアするとホームページに載っている写真が表示されますよね。
このホームページに沢山写真があると何が表示されるかわかりません。
facebookは何等かの基準で選択しているとは思うのですが。
これだと、せっかくホームページをシェアしてもらっても変な図形がfacebookに載ったら嫌ですよね。
で、今回はシェアされる時に表示する写真をホームページ側で指定する方法です。
これはOGP( オープングラフプロトコル）というもの使います。
「使う」と言っても、メタタグを記述するだけです。
主なものは以下になります。
<meta property="og:title" content="ページタイトル"/>
<meta property="og:description" content="ページの説明"/>
<meta property="og:image" content="http://～シェアされたときに表示する画像のURL"/>
<meta property="og:url" content="http://～ページのURL"/>
<meta property="og:type" content="ページ種別"/>
<meta property="og:site_name" content="サイト名"/>
og:title（必須）
ページのタイトルを記述します。
facebookのタイムラインでは、大きな文字で表示されます。
og:description（推奨）
ページの説明文を記述します。
タイトルの下に表示されます。
og:image（必須）
シェアされた時に表示する画像のURLです。
フルパス(http://から）で指定する事を推奨します。
ページ内の写真ではなく、自分が保有する他サイトの画像画像も指定できますが、やらない方が良いと思います。
シェア記事をクリックしたら別のページが出てきた、変なリンク踏んだ！ととられかねません。
バズ系のシェア記事が良く使っています。
og:url（必須）
ページのURLです。
説明文の下に表示されます。
og:type（必須）
ページの種別を指定します。
原則として、以下の中から選択します。
activity, sport, bar, company, cafe, hotel, restaurant
cause, sports_league, sports_team, band
government, non_profit, school, university, actor
athlete, author, director, musician, politician, public_figure
city, country, landmark, state_province
album, book, drink, food, game, product, song
movie, tv_show, blog, website, article
og:site_name（必須）
サイトの名称を設定します。
OGPを記述するとどの写真を表示するかを決められますが、写真の縦横比（アスペクト比）などにより、思ったように表示されない事が多々あります。
そのような場合はシミュレーターを使用して、画像の縦横の長さを調整します。
OGPを記述した結果どのようにfacebookに表示されるかをシミュレートするサイトは以下になります。
http://ogimage.tsmallfield.com/
最終的にはfacebookのデバッガーで確認します。
https://developers.facebook.com/tools/debug/og/object/
