【Google・Yahoo】検索結果にパンくずリストを表示させる最も適切な方法【構造化データマークアップ】

ホームページにパンくずリストを導入することはユーザーの利便性を考えると必須の項目になります。構造化マークアップを適切に行うと、Google、Yahooの検索結果にパンくずリストを表示することができます。

 

パンくずリストの必要性

パンくずリストに関してはGoogleが公開している『検索エンジン最適化スターターガイド』の10ページ目、【ナビゲーションをわかりやすくしよう 】の項目において、ユーザーの利便性がアップすると掲載しております。

 

検索結果に表示されるパンくずリスト

下記は当ブログの検索結果です。Google、Yahooともに指定したパンくずリストが表示されています。

Google検索結果

Google検索結果

Yahoo検索結果

Yahoo検索結果

 

検索結果にパンくずリストを表示させるための構造化マークアップ

検索結果にパンくずリストを表示させるためには<head>内に下記のように記述いたします。ここではGoogleが推奨している『JSON-LD』を採用します。詳しくは下記記事をご参照ください。

Google サーチコンソールから解るWEB管理者が施すべきSEO対策【構造化データマークアップ】

記述例

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    {
      "@type": "ListItem",
      "position": 1,
      "item": {
        "@id": "https://deco8.net",
        "name": "deco8 blog"
      }
    },
    {
      "@type": "ListItem",
      "position": 2,
      "item": {
        "@id": "https://deco8.net/category/dtm/",
        "name": "DTM"
      }
    },
    {
      "@type": "ListItem",
      "position": 3,
      "item": {
        "@id": "https://deco8.net/category/dtm/sale/",
        "name": "セール情報"
      }
    },
    {
      "@type": "ListItem",
      "position": 4,
      "item": {
        "@id": "https://deco8.net/web/google-search-console-seo/",
        "name": "2017 BLACK FRIDAY DTM関連セール情報まとめ【音源・プラグイン】"
      }
    }
  ]
}
</script>

WORDPRESSの場合

プラグイン『Markup (JSON-LD) structured in schema.org』で簡単に設定することが可能です。

プラグインをインストールするとナビゲーションに『Schema.org 設定』が表示されるのでこれをクリック。

Schema.org 設定

設定画面、『Breadcrumb』の『編集』をクリックします。

Breadcrumb

『Enabled』にチェックを入れ、『変更を保存』をクリックすれば完了です。

Enabled

 

構造化データマークアップのチェック

設置が完了したら構造化データマークアップが正しく記述出来ているか、『Google 構造化データテストツール』でチェックすることをお勧めします。

 

以上で設定完了です。