Google検索のサムネイルとは？
スマホやタブレットでGoogle検索をした時、サムネイルが表示されることがあります。
サムネイルが表示されるかどうかは、検索キーワードによっても異なるようです。
調べた感じでは、鍼灸・マッサージ・柔整・カイロプラクティック関係を検索すると出てきやすいです。
意図した画像を表示させるには
サムネイルが表示されているサイトのソースを確認＆グーグルからの情報を確認すると、自動的に画像が選ばれているようです。
意図した画像を表示させるには、２つの方法があるようです。
- HTML ページの
<head>セクションの PageMap データ を使用する thumbnailメタ タグを使用する
グーグルさんのヘルプ
気をつけて欲しいのは、上記の方法は「カスタム検索」の場合と書いてあります。
ただ、この方法で意図した画像が、検索結果に表示されたという結果があったので、やってみる価値はあると思います。
Cocoonでの方法
Cocoon設定 ＞ OGP でOGPをONにします。
OGPタグで指定している画像と同じ画像が出力されるように、tmp/header-ogp.phpをカスタマイズします。
オリジナル
修正後
tmp/header-ogp.php の61行目と77行目に下記を挿入します。
echo '<meta name="thumbnail" content="'.esc_url($ogp_image).'">';echo "\n"; // 追加
gistにも、書いておきました。
カスタマイズしたtmp/header-ogp.phpを子テーマにアップする
Cocoonが更新される度に操作するのは大変ですので、子テーマを利用します。
tmpディレクトリを作成
子テーマにtmpディレクトリを作成します。
FTPでディレクトリを作成してもいいですし、PCでtmpフォルダを作って、FTPでアップロードしても大丈夫です。
カスタマイズしたheader-ogp.phpをアップロードします
子テーマのtmpディレクトリにカスタマイズしたheader-ogp.phpをアップロードします。
くれぐれも、カスタマイズ前のものをアップしないでくださいね。
確認
投稿や固定ページを表示させて、右クリックしてソースを確認しましょう。
ソースにthumbnail メタ タグがあればOKです。
Cocoon子テーマ tmp-user/head-insert.php に書いても反映されない
実は、tmp-user/head-insert.php に追記すればいいと思ってやってみたのですが、できませんでした。
ちょっと面倒ですが、治療院のサイトをCocoonで運営されている方なら、やっておいた方が良いと思います。
