[WordPress]SEO的にもちょびーっとだけ有利なリッチスニペットを用いたパンくずリストの作り方

で行えます。 まとめ このような、リッチスニペットを使ったパンくずリストは、それさえ使えばアクセスがアップするというものではありません。 けれども、Googleに正確にブログの階層構造を伝えておくのは、良いことはあれ、決して悪いということはないと思います。

WordPressを今年の1月から使い始めたので、もうすぐで6ヶ月になります。

WordPressを使ってみて、なんだかんだで、使いやすいし、楽しいしではまってしまいました。最近では、自分でテーマを作ったりしてみています。

それで、昨日は「パンくずリスト」を作成したので、コピペで利用できるようにして載せておきます。

photo by surlygirl

スポンサーリンク
レクタングル(大)広告

パンくずリストとは

パンくずリストとは、サイトの階層をユーザーが把握して移動できるようにするための一連のリンク(パンくず)です。

このブログで言えば、ページ上部にあるこんなやつのことです。

寝ログパンくずリスト

こう書くことで、読者に今読んでいる記事の位置を把握してもらうことができます。

それとともに、SEO的にはGoogleの検索結果に以下のように表示されるので、検索ユーザーにも、ページ内容がさらにわかりやすく伝わります。

Google検索結果パンくずリスト

ちなみに、パンくずリストが設定されていないページの場合は以下のように、ただのURLで表示されます。

Google検索結果URL表示

このようなGoogleにも認識してもらいやすいパンくずリストを設定するには、リッチスニペット使って非構造化マークアップすることが Googleでも紹介されています。(普通に作成するだけでもGoogleはパンくずリストとして読み取ってくれることもありますが、リッチスニペット使った方が確実です。)

参考 リッチ スニペット – パンくずリスト – ウェブマスター ツール ヘルプ

Google推奨の、マークアップの書き方としては、microdataを用いた方法と、RDFaがあるのですが、今回は、microdataを用いました。

あと、パンくずリストは、「複数パンくずリスト」という手もあるのですが、GoogleのMatt Cutts(マット・カッツ)氏が1つで十分と言っているので1つにしました。SEO的にも複数あっても、最初の一つしか採用しないようですし。

でも1つで間に合うならそれで十分で、ほとんどの人がそうやっているし、それが普通のやり方だ。僕たちも、1つのパンくずリストを勧める。

複数のパンくずリストを1つのページに設置することはSEOにおいて問題ないか? | 海外SEO情報ブログ

コピペで使えるパンくずリストの作り方

今回作成した、Wordpressテーマにパンくずリストを載せる方法です。

作成する手順は以下です。

  1. 手軽に呼び出して何度も使えるようにbreadcrumbs.phpファイルを作成する
  2. パンくずリストのコードを書く(コピペ)
  3. WordPressテーマ内からbreadcrumbs.phpをテンプレートとして呼び出す(コピペ)
  4. style.cssでスタイルを整える(コピペ)

breadcrumbs.phpファイルの作成

これは普通に、「breadcrumbs.php」というファイルを作成します。

パンくずリストファイルの作成

パンくずリストのコード

breadcrumbs.phpに以下のコードを貼り付けます。

参考 パンくずの構造化マークアップをしよう | サイトフレームワークノート

WordPressテーマから呼び出す

single.phpやarchive.phpなどから、以下のコードを用いてパンくずリスト(breadcrumbs.phpファイル)を呼び出します。

スタイルシートの記入

最後にstyle.cssなどに以下のようなスタイルを書き込んで終了です。

作成されるパンくずリスト

これで作成されたパンくずリストはこんな感じになります。

作成されたパンくずリスト

HTMLソースはこんな感じになります。

パンくずリストの構造をチェックするには、Google Structured Data Testing Toolなどで行えます。

まとめ

このような、リッチスニペットを使ったパンくずリストは、それさえ使えばアクセスがアップするというものではありません。

けれども、Googleに正確にブログの階層構造を伝えておくのは、良いことはあれ、決して悪いということはないと思います。

『[WordPress]SEO的にもちょびーっとだけ有利なリッチスニペットを用いたパンくずリストの作り方』へのコメント

  1. 名前:名無しさん 投稿日:2016/02/27(土) 17:53:16 ID:08b3e967d

    WordPressテーマから呼び出す
    のコードで”<"が抜けてますよ

  2. わいひら 名前:わいひら 投稿日:2016/02/27(土) 20:32:37 ID:b49faa0e1

    ご指摘ありがとうございます!
    修正させていただきました。