ワードプレスのSEO対策に!Google検索結果にサムネイルをさせる方法



SEO対策というか、単純に検索結果でサムネイル表示されてると目を引きますよね。

主にサムネイルが表示されるのはスマホでの検索時ですが、やはり、目を引く分CTRのアップを狙えます。

今回はGoogleに効率的にサムネイルのありかを知らせる方法を紹介します。

meta タグを使ってサムネイル画像をGoogleに指定する

metaタグって言うのは、htmlに慣れている人でもあまり積極的に使う事が少ないタグです。

そもそものmetaタグの役割としては、人間にわかるように表示するためのものではなく、機械(ブラウザやbot)に対して、WEBサイトのページの概要を示したり、著者を知らせたりするもので、読者やワードプレスのライトユーザーの目に触れる機会はほとんどありません。

基本的には、ワードプレスの場合、ほとんどのテーマテンプレートで必要最低限のmetaタグを出力するように組み込まれています。

次項で、ご自身のワードプレステーマが検索結果サムネイル用のmetaタグを出力しているのか調べる方法を紹介します。

自分のワードプレステーマがサムネイル用のmetaタグを出力しているか確認する方法

Google Chromeのデベロッパツールを使います。(別にchromeじゃなくてもOK)

①metaタグの有無を調べたいページで[F12]を押します。

②「Elements」タブの中で[Ctrl + F]を押して検索窓を起動

③検索窓に「<meta」と入力して右側の矢印で一個ずつ見ていきます。
※スペースを使った複合的な検索が出来ないので注意

④「<meta name="thumbnail" ~」から始まるタグがあればOK。

サムネイル表示用のmetaタグがない場合の出力方法

header.phpを編集して、各記事でアイキャッチとして使われている画像を検索結果のサムネイル用画像として指定したmetaタグを出力します。

header.phpに記述するパターン

header.php の <head>~</head> に囲まれた位置に上記コードを貼り付けてください。

処理内容としては、ワードプレス上のページが「ホーム」「カスタムホーム」「固定ページ」の場合は「https://あなたのドメイン.com/logo.png」で指定されたURLの画像をサムネイルとして使います。

投稿ページに関しては、アイキャッチとして指定されている画像を検索結果用のサムネイルとして使います。

つまり、コード中「https://あなたのドメイン.com/logo.png」の位置はご自身のサイトロゴのURLなどに変更する必要がありますのでご注意ください。

functions.phpに記述するパターン

処理内容は同じですが、functions.phpに記載することもできます。

何れか使いやすいほうを選択してください。

検索結果のサムネイル表示にはばらつきがある。

当サイトでは、もちろん全記事ページにサムネイルの指定をしています。

が、実際に表示されるかどうかはGoogleの気分次第。

設定してからインデックス内容が変更されるまでの時間差があるのかもしれませんが、現状このサイトの検索結果はサムネイル表示されているページとそうでないページが存在します。

検索順位はもちろんですが、目を引いてクリックを促してサイトに訪れてもらうことも非常に大事です。(CTRを上げると言います)

ワードプレス初心者の方には少し難しいかもしれませんが、一度作業してしまえば永続的に効果がありますので、是非挑戦してみてください。