シーサーブログをフェイスブックでシェアするときに「サムネイル」を表示する方法

シーサーのブログサービスを利用しているのですが、ある日フェイスブックでブログをシェアしようと思ったら、サムネイルが表示されませんでした…。表示されても、私が出したいサムネイルではなく、適当な画像が選択されてしまう(-_-;ｳｰﾝ

フェイスブックでシェアするときに、サムネイルは命です。

記事と関係ないサムネイル（たとえばブログのピクトやタイトル画像など）が出るとか、サムネイルが出ない、なんてことは許容できません (￣▽￣;)!!ｶﾞｰﾝ

結論から言うと、シーサーブログの設定で、「OGPタグ追加」で「追加」を選択するだけでした。どんなにググってもこの解決法が出てこなかったので、このブログでご紹介します。

なんでグーグル検索で見つからなかったのでしょうか…みなさん、こんなことではつまずかないのでしょうか…

OGPタグの設定方法は、次のとおりです。

1）管理画面左の「設定」をクリック

2）右下の「外部連携」をクリック

次の画面下にある

3）「OGPタグ追加」の「追加」をマークする

4）保存する

これだけです（＾▽＾）／

これをすることによって部分に自動的にOGPタグが追加されます。

このOGPとは、オープニングラフプロトコルというもので、タイトル、ディスクリプション、イメージ（サムネイル）、タイトル、などを指定するためのmetaタグです。

この画像は、「スマートフォンサイト制作ブログ」さんからキャプチャでお借りしてきました。詳しくは、このサイトをご確認ください。

ただ、このOGPタグはヘッド部分に書き込まなければなりません。

普通、ブログの各ページのヘッド部分なんていじれなじゃないですか…

試しに、普通に記事部分に貼ってみたのですが、もちろん結果はNG…

シーサーに問題があるのか、フェイスブックがまた急に何か変えたのか…

でも、ほかのブロガーさんのシーサーブログは、問題なくフェイスブックにサムネイルが出ていました。

どんなにググっても、解答らしきものが見つかりません。アメブロについてはいくつか記事があったのですが、なぜかシーサーはない…ああでもない、こうでもないと試していて、やっとシーサーブログには、このOGPを自動生成させるサービスがあることに気づきました。

このあとの大事な作業は、フェイスブックのデバッカーページでデバックすることです。

使い方はかんたん。ページのURLを入れて、デバックするだけ。

ここでOGPがキチンと入っているかを確認できます。

デバッガーについての記事を読むと、「この作業をするだけでサムネイルが表示されるようになる」という方が多数いらっしゃいました。

私は、この作業だけで解決しなかったので悪戦苦闘したわけです。

ところが、ここでもつまずきました…

ハッキリとは言えませんが、たぶん、キャッシュが残っていたんですね。

ソースを確認すると、ヘッド部分に「おぉ〜！入ってる〜！！」

OGPのメタタグは自動生成されているのに、なぜサムネイルは出てこない？？？

FireFoxのキャッシュを消してみたり、リロードしてみたり、挙句の果にはいちどブログ記事を消して新しくコピペで記事を生成したり…などとやっているうちにやっとできました。

告白しますと、私がゴニョゴニョと解決できないでいたところ、システムをしている主人が見かねてやってくれました…