次のURLをFacebookに貼り付けると、アニメーションGIFを共有できます。これは映画でもフラッシュでもありません。Facebook 現在はgifをサポートしています これらの回避策はありません。クリックすると一時停止でき、一時停止中は「GIF」が丸で表示されます。
http://giphy.com/gifs/hot-funny-cartoon-fBEDuhnVCiP16
そのページのメタタグから何を複製しても、Facebookに自分のページからアニメーションGIFを共有させることはできません。そのページのコード全体をコピーして自分で提供することさえしました(Changing <link rel="canonical"
および<meta property="og:url"
私のURLと一致する)。
Open Graph Object Debugger 実際のGiphyページと私のレプリカの両方で同じ結果が得られます。興味深いことに、Object Debuggerのプレビューは、両方のページの古いスタイルのFlashムービーです。ただし、GiphyのURLをFacebookに貼り付けると、gifが表示されます。私のレリカにはFlashが表示されます。
GiphyはFacebookから特別な扱いを受けていますか?何か違うことをする必要がありますか?
リンクがステータスとして貼り付けられると、Facebookフィードにアニメーション(およびループ)GIFとして表示される.htmlファイルを作成することができました。私のhtmlページでは、ヘッダーで次のメタタグを使用しています。
<meta property="og:site_name" content="Site Name">
<meta property="og:url" content="url to GIF on web">
<meta property="og:title" content="Title of GIF page">
<meta property="og:description" content="Some description">
<meta property="og:type" content="video.other">
<meta property="og:image" content="Same as og:url above">
<meta property="og:image:width" content="800">
<meta property="og:image:height" content="400">
これに取り組んでいたときに問題が発生したのは、og:url
プロパティでした。これらのメタタグが含まれている.htmlファイルではなく、GIFを直接指す必要があります。また、og:image
はog:url
と同じである必要があります。
幅と高さのプロパティが必要かどうかはテストしませんでした。
GiphyAPIチームのプロダクトマネージャーはこちら。特別な扱いはありません。 Facebookでバグをファイリングするのは永遠にかかります。
Flashタグはレガシーであり、クリーンアップする必要があります。 FBは現在GIFをサポートしており、vegashackerによる回答は基本的に正しいです。
答えが逃した重要なポイント、GIF画像(クリックされた場合)をGIFリンク自体ではなく所属する記事にリダイレクトさせる方法は?
重要な部分は次のとおりです。
<meta property="og:image" content="url/to/image.gif">
<meta property="og:url" content="url/to/image.gif">
<meta property="og:url" content="url/to/article">
2つのog:url
タグを追加します。最初のものは、GIF画像のURLを指すog:image
と同じである必要があります。 2つ目は記事のURLです。
実際、私は彼らのソースコードを見ました、そして私は彼らが実際にビデオを見せていると99%確信しています。 this gif の場合、ページに関連付けられているオープングラフメタタグがいくつかあります。
<meta property="og:type" content="video">
<meta property="og:image" content="http://media.giphy.com/media/H2ANZTOXVepbO/giphy-facebook_s.jpg">
<meta property="og:image:width" content="480">
<meta property="og:image:height" content="270">
<meta property="og:video" content="http://giphygifs.s3.amazonaws.com/swiphy20141103.swf?api_hostname=&gif_url=https%3A%2F%2Fmedia.giphy.com%2Fmedia%2FH2ANZTOXVepbO%2Fgiphy.gif&giphy_height=297&video_url=http%3A%2F%2Fmedia.giphy.com%2Fmedia%2FH2ANZTOXVepbO%2Fgiphy.mp4&giphyWidth=400&path=%2Fgifs%2Fstar-wars-80s-the-muppet-show-H2ANZTOXVepbO&destination_url=http%3A%2F%2Fgiphy.com%2Fgifs%2FH2ANZTOXVepbO&giphyHeight=297&gif_id=H2ANZTOXVepbO&mode=embed&giphy_width=400">
<meta property="og:video:secure_url" content="https://giphygifs.s3.amazonaws.com/swiphy20141103.swf?api_hostname=&gif_url=https%3A%2F%2Fmedia.giphy.com%2Fmedia%2FH2ANZTOXVepbO%2Fgiphy.gif&giphy_height=297&video_url=http%3A%2F%2Fmedia.giphy.com%2Fmedia%2FH2ANZTOXVepbO%2Fgiphy.mp4&giphyWidth=400&path=%2Fgifs%2Fstar-wars-80s-the-muppet-show-H2ANZTOXVepbO&destination_url=http%3A%2F%2Fgiphy.com%2Fgifs%2FH2ANZTOXVepbO&giphyHeight=297&gif_id=H2ANZTOXVepbO&mode=embed&giphy_width=400">
<meta property="og:video:type" content="application/x-shockwave-flash">
<meta property="og:video:width" content="470">
<meta property="og:video:height" content="297">
そしてそれらのほとんどはビデオタグです。これらのタグは、gifではなくページに関連付けられています。ストレートgif画像を共有すると、アニメーション化されません。
これを確認するために、ページを Facebook URLデバッガー に接続すると、これを確認できます。謎はありません、 これはフラッシュビデオとして共有されます 。
私はFacebookデバッガーでしばらくこれに取り組んでいて、swfを投稿する方法を見つけましたが、ちょうど今日、アニメーションGIFも正常に投稿しました。
リンクを貼り付けただけです https://www.example.com/my.gif FacebookデバッガーにURLが見つからないと表示されましたが、アプリID番号が表示され、先に進んで投稿しました。すべての人が見るための私のタイムライン:)したがって、それを達成するためのhtmlやタグはありませんが、サーバー上のgifファイルへの安全なリンクです。
埋め込まれたhtmlを介してそれを達成する方法を私は決して考えませんでした!