花粉症の鼻水を緩やかに止めてくれるらしい、べにふうき緑茶の販売サイト
を作っていた時の事。
face bookのイイね！ボタンをつけて試しにイイね！してみたら、トンデモ画像がサムネールとして表示されちゃいましてね。
←こいつが出てきた（笑
基本的にはランダムらしいんですが、これはヒドい。
イイねしてくれた人に申し訳ない。
色々調べてみたところ、
どうやら、OGPというプロトコルで制御できるらしく
head内にmetaタグで画像を指定してあげると任意の画像にできることがわかりました。
ただし！
今回カラーミーショップというASPサービスを使って作ったもんだから
肝心のmetaタグが自由に書けないってゆーね。
チーン。
とりあえず、ここをクリックするとfbにキャッシュし直して結果を見せてくれる模様。
ありがたい。
http://developers.facebook.com/tools/debug
※英語が読めなくても下まで眺めれば大体の事は把握できるので説明は割愛。
ものは試しでbody内にmeta書いてデバック試したところ、
思いっきり赤地で警告出て認識してくれません。
きえぇぇぇぇ。
発狂しても仕方ないので、地道に色々やってみた解決法を以下レポート。
■何がキャッシュの対象になるかを特定してみる。
・ソースとして存在している
・それほどおっきくない(100px位)
・場所的にはイイねボタンより後ろの画像？
・コメントアウトされていない。
つまり、こういうこと？
■metaタグ編集ができなくても、外観を変更せずFBに任意の画像をキャッシュさせる方法。
１：読み込ませたい画像を100px～250pxくらいの正方形でつくる。
２：現在キャッシュされている画像のすぐ前にそいつを配置。
３：cssで画像を隠す！
スタイルシート： .hoge { display:none; }のクラスを作って
HTML： imgタグで class="hoge" を指定するだけ！
４：デバックしてウマー
これで、バッチリ任意の画像をfbにキャッシュさせることができました！
思いつくのに3日もかかったー！
なんでこんな簡単なことに気づかなかったんだろうと自己嫌悪w
アメブロなんかでも似たような壁にぶち当たる方がいるやもしれません。
試してみてください！