Woot.com でページの1 つを共有しようとすると、サムネイルに 3 つのオプションが表示されます。最初は og:image で指定されたものですが、残りの 2 つはページのナビゲーション領域に含まれるサムネイルからランダムに選択されたようです。
デバッガーは役に立たないようです。og:image で指定されたものだけが表示されます。
何か案は?
Woot.com でページの1 つを共有しようとすると、サムネイルに 3 つのオプションが表示されます。最初は og:image で指定されたものですが、残りの 2 つはページのナビゲーション領域に含まれるサムネイルからランダムに選択されたようです。
デバッガーは役に立たないようです。og:image で指定されたものだけが表示されます。
何か案は?
サイトのソースを確認すると、2つのog:imageタグが配置されているように見えますが、サイトのFacebook共有者にはまだ1つのサムネイルしか表示されていません。
<meta property="og:image" content="http://d3gqasl9vmjfd8.cloudfront.net/3f0c6be3-29b1-4241-bd13-af61613f6dee.jpg" />
<meta property="og:image" content="http://d3gqasl9vmjfd8.cloudfront.net/4ccb33cb-13b7-457c-a425-2ed7a305a758.jpg" />
絶対的な制御が必要で、ソースを変更できるように思われる場合は、Facebook共有者のリンクを変更することをお勧めします。このページでは、現在次のように表示されています。
http://www.facebook.com/sharer.php?u=http://www.woot.com/offers/cuisinart-14-pc-non-stick-cookware-set-5&src=sp
次のように、必要な画像のソースを共有URLに直接追加できます。
http://www.facebook.com/sharer.php?s=100&p[url]=http://www.woot.com/offers/cuisinart-14-pc-non-stick-cookware-set-5&p[images][0]=http://goo.gl/ehi4d
繰り返しになりますが、これにより直接制御できますが、ヘッダーコードの代わりに小さな共有ウィジェットコードを変更する必要があります...幸運を祈ります。
Facebook の共有スクリプトは、常に複数の画像から選択できるようにユーザーに提示しようとしていると思います。最初にヘッダー内の og:image タグを検索し、次にページのコンテンツに移動して、共有基準を満たす画像を選択します (つまり、画像は少なくとも 50px x 50px で、最大アスペクト比が 3:1 である必要があります)。 、および PNG、JPEG または GIF 形式で)。
したがって、表示する 3 つの画像を手動で選択する場合は、ヘッダーに og:image タグを 2 つ追加するだけです。そのページでデバッガーを再度実行すると、目的の結果が得られます。
http://developers.facebook.com/docs/opengraphprotocol/によると
og:image - グラフ内のオブジェクトを表す画像 URL。画像は少なくとも 50 ピクセル x 50 ピクセルである必要がありますが、可能な限り最高のユーザー エクスペリエンスを得るには、最小 200 ピクセル x 200 ピクセルが推奨され、1500 ピクセル x 1500 ピクセルが推奨されます。画像の最大縦横比は 3:1 です。PNG、JPEG、GIF 形式をサポートしています。複数の og:image タグを含めて、複数の画像をページに関連付けることができます。(注: 画像のサイズは 5 MB 以下である必要があります。)
あなたの問題に関して、これは、Open Graph 画像として複数の画像を設定できることを示しています。特定の画像のみをオプションとして提供したい場合は、それぞれ独自の「og:image」を持つ 3 つの画像を提供することをお勧めします。
現在、次のものがあります。
meta property="og:image" content="http://d3gqasl9vmjfd8.cloudfront.net/750d2708-65b0-42d6-bf1e-a4e0f8f2b79c.jpg" />
次のように置き換えることができます。
meta property="og:image" content="http://d3gqasl9vmjfd8.cloudfront.net/750d2708-65b0-42d6-bf1e-a4e0f8f2b79c.jpg.jpg" />
meta property="og:image" content="http://d3gqasl9vmjfd8.cloudfront.net/sameimagenewname.jpg" />
meta property="og:image" content="http://d3gqasl9vmjfd8.cloudfront.net/sameimagenewname2.jpg" />
これにより、望ましくない画像が使用されるという問題が解決されます。