たまーに、アイキャッチを設定してちゃんとog:imageタグにも反映されているのに、 Facebookのシェアボタンを押すと違う画像が出たりする。 なーんでだろうなあ、と思ったのだがやっと原因がわかった。 最低でも200x200ピクセルの大きさの画像が必要らしい。 Facebookにはデバッグツールというものがあります。 グラフAPIとか、エンジニアがよく使うツールなのですが、 ここにURLを入力するとそのサイトのタグを解析してくれます。 fbdebug2 ここで、og:imageの画像サイズが小さい場合下記のようにWarningが出力されるのです。 「og:image could not be downloaded or is too small」と。 説明文を見る限り、200x200ピクセル無いと 別の画像を勝手に使ってしまうと。 広告の画像なんかシェアされても困りますな。 なお、画面の下の方に実際にシェアボタンを押した際どんな風に出力されるかも表示されます。 他のmetaタグの情報も表示されるし、canonicalURLとかも見れるので、 たまには確認するのもいいかも。 GoogleのWebマスターツールとかもしかり。 そんなわけで、og:imageに出す画像サイズは200x200ピクセル以上にしましょうね。 基本wordpressはアイキャッチがog:imageになるはず。 それともこれAll-in-one-SEOとかテーマ側でやってくれてるのかな？ あと、先日ブロフェスで確かnarumiさんがタイトルとか変えたらここに入力しないと キャッシュが残ってしまうとか言っていたので、 アイキャッチやタイトルを変更したら忘れずにここに入れるようにしましょ。 だからトップページをシェアされた時自分のブログロゴを出力させるには、 ロゴも200x200にしないといけないのか。 今のロゴは縦サイズそんなに無いし、今度やっておこうっと。