24
18

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Facebookのシェアをしたときに初回のみ画像が表示されない

Last updated at Posted at 2016-01-04

ゲームの結果みたいに動的にHTML生成してシェアさせようとしたときになぜかog:imageを設定しているのにシェア画面に画像が表示されない。しかも表示されないのは初回のみで、2回目以降は表示される。
ブログ記事とかなら初回のみ自分でシェアをテストすれば問題ないんだけど、ゲームの結果みたいに動的に生成したページをシェアしたいときはユーザーが必ず初回シェアをすることになるので、これでは困る。

…と思って調べたら同じようなことで悩んでいる人がいた。
http://stackoverflow.com/questions/27913369/facebook-open-graph-no-image-first-time (英語)
結論からいうと、og:image:widthog:image:heightを指定すれば良い。

<meta property="og:image" content="http://example.com/image" />

これを

<meta property="og:image" content="http://example.com/image" />
<meta property="og:image:secure_url" content="https://example.com/image" /> 
<meta property="og:image:width" content="640" /> 
<meta property="og:image:height" content="442" />

こうする。
幅と高さは実際の画像サイズに合わせてください。

24
18
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
24
18

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?