先日クライアントから「Google検索結果の記事タイトルの横にサムネイル画像を出したい」という質問がありました。検索結果のリッチスニペットというものなんですが、サムネが出ていると、どのようなページ・記事なのか連想することができるので、マッチしている場合クリック率の向上が見込めるので、効果的なSEO対策になると思います。しかも比較的簡単に設定することができるので、この記事をご覧の方はぜひお試しください。
具体的な方法は、本記事でも紹介しますが、Googleの「Programmable Search Engine ヘルプ」ページに載っています。サムネイル画像だけでなく、他にもカスタマイズできるので、以下のリンクから確認してみてください。
Google検索結果にサムネイル画像を表示させる手順
方法としては、3つのパターンがありますので、自分に合った方法を選択して実装してみてください。実装したら、ブラウザのデベロッパーツール（F12）でコード検索をして、きちんと出力されているか確認してみてください。
PageMap を使用する
PageMapのコードを<head>セクションに追加して、サムネイル画像を指定できます。こちらの方法は、サムネイル画像ファイルと幅・高さまで指定できます。他にもアクションやカスタム属性など、細かい指定をしたい場合に使用すると良いと思います。
<!--
<PageMap>
<DataObject type="thumbnail">
<Attribute name="src" value="http://www.example.com/recipes/applepie/applepie.jpg"/>
<Attribute name="width" value="100"/>
<Attribute name="height" value="130"/>
</DataObject>
</PageMap>
-->thumbnail メタ タグを使用する
こちらが一番シンプルな方法で、metaタグを<head>セクションに追加するだけです。単純にサムネイルを表示させたい場合に使用すると良いと思います。
<meta name="thumbnail" content="http://example/foo.jpg" />
functions.phpを使ってthumbnail メタ タグを使用する
WordPressを使用している場合は、一つひとつのページにPageMapやMetaタグを手動で入れるのではなく、functions.phpで設定しておくことで、全てのページでアイキャッチ画像をサムネイルとして出力することが可能です。
functions.phpは「外観」>「テーマファイルエディター」から編集可能です。
本ブログは「swell」を使用していますが、swellだけでなく他のテーマでもfunctions.phpを編集することができるのでご安心ください。稀に管理画面からfunctions.phpの編集できない場合があります。その場合は、プラグインを使うか、FTPソフトでダウンロードして編集してみてください。
// アイキャッチをthumbnailメタタグとして出力
add_action( 'wp_head', 'add_meta_to_head' );
function add_meta_to_head() {
echo '<meta name="thumbnail" content="' .wp_get_attachment_url( get_post_thumbnail_id() ). '" />';
}※functions.phpを編集する際は、十分に気をつけてください。間違ってしまうとWordPressが機能しなくなってしまいます。その場合は、WordPress管理画面に入ることができなくなることもあるので、FTPソフト等でテーマフォルダにあるfunctions.phpをダウンロードして、修正したファイルを上書きアップロードすると元に戻りますので、焦らずに復旧作業してください。（そもそも管理画面で編集するのは危険なので、ローカルで編集・確認してからアップロードしたほうが安全です。）
まとめ
「Google検索結果にサムネイル画像を表示させる方法」はとても簡単ですが、結構忘れがちな部分かなと思います。私自身もお客様から質問されるまで、本ブログで実装していなかったので、記事を書きながら実装しました。このメタタグ自体は実装すると、検索結果にすぐ反映されます（下記スクショが実装後の検索結果です）。
また、質問や他のSEO対策など聞きたいことがあれば、DMやお問い合わせフォームからお気軽にメッセージいただければと思います。
本サイトはWordPressテーマ「SWELL」を使用しています
– シンプルなのに、高機能 –
ブロックエディター完全対応のWordPressテーマ。
圧倒的な使い心地を追求し、SWELLは日々進化しています。
