スマホ検索結果にサムネイルを出す方法をグーグルが言っていたので実装してみた。

ども中の人です。

頭の中でずっとお客さんのサイトが検索からクリックされたらいいなぁ・・・

どうすれば、クリックされるかなぁ・・

と思っていたところに、検索結果にサムネイルを表示させ方という事が書いてあったのでそれを実践してみました。

 

グーグルが言っているページがこちら

 

サムネイルの指定
検索結果に表示するサムネイル画像は、カスタム検索の結果ページの URL について、より詳しい情報をユーザーに提供するために有効です。デフォルトでは、サムネイル画像として使用できる画像が自動的に表示されます(このデフォルト動作は、コントロール パネルの [デザイン] ページで無効にできます)。

サムネイル画像と 2 つのアクションを示す Google カスタム検索リッチ スニペット

サムネイル画像は以下の方法で指定できます:

HTML ページの <head> セクションの PageMap データ を使用する
thumbnail メタ タグを使用する

サムネイルの指定 - カスタム検索 ヘルプ
検索結果に表示するサムネイル画像は、カスタム検索の結果ページの URL について、より詳しい情報をユーザーに提供するために有効です。デフォル

ホントにグーグルさん本当に言ってる・・・・・

 

という風に天下のグーグル先生が、言っているので、ダメ元で、当サイトにも実装してみました。

ただ、スマホという記述は無いのですが、まぁスマホでも同様の感じで反応してくれたらいいなぁ・・・

というレベルで思って下さい。

 

 

ちなみに、このサイトはワードプレスで作られてありますので、シリウスや、ほかのCMS、ムーバブルタイプなどでは、そのままは使えませんのでご了承ください。

 

ただ、基本的には、ページ毎に、サムネイルを指定するメタタグを表示するだけなので使われてあるサイト作成、CMSの仕様に合わせて行っていただければ可能です。

 

 

ワードプレスのテーマに書き込む!

ほとんどのワードプレスのテーマでは、テーマファイルの中にheader.phpというファイルが内包されていると思いますので、その編集ページを開いて、そこに2回の工程を行うだけで検索結果にサムネイル出して送れー!!

という事ができるようになります。

 

注意。必ずしも検索結果にサムネイルが表示されるわけでは無いので、気休め程度かもしれません。

ただ、やっておく事はやっておきたいという方はいいかもしれません。

 

弊社は、モルモットとして自社サイトに実装してその過程を紹介できたらという気持ちで設定します!!

 

ワードプレスの外観>テーマの編集>header.phpをクリック

このサイトは、Cocoonという有名なテーマをベースに構築しています。

 

なので、親テーマと、子テーマとして使っている方や、親テーマだけで使用されているなどあるとおもいます。

 

今回の検索結果にサムネイルを表示させようとする場合は、親テーマに書き込むことになります。

 

ワードプレスの外観テーマの編集header.phpをクリック

開いたら、<metaなんとかっていうのが並んでいる所のどこかに改行を入れて

下記をコピペします。

 

コピーして使用してください。

<?php if ( is_home() || is_front_page() ) : ?>
<meta name=”thumbnail” content=”●●.jpg” />
<?php else: ?>
<?php if ( is_single() ) : ?>
<meta name=”thumbnail” content=”<?php the_post_thumbnail_url(‘medium’); ?>” />
<?php else: ?>
<?php endif; ?>
<?php endif; ?>

 

次に、●●.jpとなっているところを、変更予定のサイトの中にある画像URLに置き換えてください。

この●●.jpというのは、トップページ用のサムネイル画像になります。

そして保存してください。

一応、この作業を行う前に、メモ帳にコピーを取っておくか、別タブにてコピー用を置いておくなどをしておくと、しくじった後にも、そこから復旧できたりします。

 

あと、一応書いておきますが、この変更に関しては、自己責任の上で行ってください。

テーマにもよりますが、うまくいかないという場合もあり得るかもしれませんので・・・

 

設定したら確認しましょう。

トップページを開いて右クリックでソースを開くでソース画面を表示してみてください。

 

<meta name=”thumbnail” content=”https://aaaa.net/サムネイル画像.jpg” />

というような感じの項目(メタタグ)が表示されて居たら成功です。

 

この時に、

 

  • トップページ
  • 記事ページ

 

の2つで同様のチェックを行ってください。

 

さぁこれで、わくわくクリックアクセスアップ大作戦が終了しました!

おいネーミングやばすぎだろ

 

 

とはいっても、そう簡単にグーグルさんはサムネイル表示してくれませんので、出てたらラッキーだな程度に思っておいた方がいいかも?

ではまた。