web-dev-qa-db-ja.com

Facebook sharer.php、複数のog:imageタグを持つ方法

可能性のある複製:
Facebook Sharerはどのように画像を選択しますか?

Facebookのsharer.phpサービスを使用して、サイト上のページを共有しています。現在、これはうまく機能していますが、ユーザーに複数のサムネイルを選択する方法を見つけるのは難しいです(sharer.phpページは複数の画像のUIを提供しているので、どういうわけか可能です)。

現在、このメタタグがあります。

<meta property="og:image" content="http://www.mysite.com/myimage.jpg" />

これを行う方法を示唆するものは見つかりませんでした。誰にもアイデアはありますか?

22
codinginthevoid

しばらくの間、複数の画像を使用しています。次のように複数のog:imageメタタグを使用します。

<meta property="og:image" content="http://www.example.com/image01.jpg">
<meta property="og:image" content="http://www.example.com/image02.jpg">

既に共有されている(1つのイメージで)ページは、debugger/linterにリンクをロードすることで更新できます: https://developers.facebook.com/tools/debug/

デバッガ/リンターは、すべての画像のプレビューをnot表示します–最後の画像のみを表示します(以下に、どの画像をプルしたかを記載します)スルー)しかし、それは動作します。

28
Eddie

私は同じ問題でここに来ました。掘り下げた後、複数のog:imageタグを使用できることがわかりました。

Facebook Developers から、og:imageの下:

PNG、JPEG、GIF形式をサポートしています。 複数の画像をページに関連付けるために、複数のog:imageタグを含めることができます。

スパイダーがキャッシュするときに新しい画像がメタに追加されたことをFacebookが認識するまでに時間がかかる場合があることに注意してください。 [いいね!]ボタンを使用して既に共有しているリンクまたはステータスにコピーしたリンクは、この影響を受けます。

編集:OGタグを変更したにも関わらず、Facebookで同じ画像が表示されない場合は、おそらくFacebookがキャッシュしたためです。その場合は、Facebookの OG Debugger here を使用してタグを確認してください。

17
Workman

私はこれを解決する方法を見つけました。メタ情報ではなく体に画像を追加し、次のように非表示にします。

<body> ...

<img src="http://image1" width="41" height="41" border="0" alt="text describing the image" style="visibility:hidden" /><br/>

<img src="http://image2" width="41" height="41" border="0" alt="text describing the image" style="visibility:hidden" /><br/>

etc ... </body>

Og:imageプロパティが指定されていない場合、サムネイルが本文から取得され、非表示であっても機能することを読んで、ちょうど私に来ました。おそらく、幅や高さなどを削除して整理することもできますが、なぜ両方がそれで時間を無駄にするのか、とにかく非表示になったときに、切り取って貼り付けて非表示にしました。

お役に立てれば。

1
Stuart