cakephp パンクズリスト [SEO効果抜群の google serp 対応版]

googleserpとは

SERP というのは検索エンジンの検索結果を表示するページのこと。
上記写真のようにgoogle検索結果のパンクズリストを
日本語で表示させることによって確実なSEO効果が得られる。

今回はcakephpでやってみよう。

下準備。以下のファイルを作って下さい。

○/elements/breadcrumb.ctp

/*
追加方法 各ビューにて
$html->addCrumb('ラーメン一覧','/raumen/');
$html->addCrumb('担々麺','/raumen/tantanmen/');
*/
if(!isset($this->breadcrumb)){
$this->breadcrumb = array();
}

foreach($this->breadcrumb as $v) {
$html->addCrumb($v[0],$v[1]);
}

//現在のページをリンク無しで追加
if(isset($title_for_layout)){
$html->addCrumb($title_for_layout,'');

if(!isset($separator)){
$separator = " > ";
}
if(!isset($top)){
$top = "トップ";
}
$crumbs = $html->getCrumbs($separator,$top);
}

if($this->params['url']['url'] != '/'){

if(isset($crumbs)){
  echo $crumbs;
}
}

htmlヘルパーを書き換える

563行目あたりの getCrumbs を以下のように変更

function getCrumbs($separator = '»', $startText = false) {
   
    if (!empty($this->_crumbs)) {
        $out = array();
        if ($startText) {
            $out[] = '<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="/" itemprop="url"><span itemprop="title">'.$startText.'</span></a></span>';
        }

        foreach ($this->_crumbs as $crumb) {
            if (!empty($crumb[1])) {
                $out[] = '<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="'.$crumb[1].'" itemprop="url"><span itemprop="title">'.$crumb[0].'</span></a></span>';
            } else {
                $out[] = '<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><span itemprop="title">'.$crumb[0].'</span></span>';
            }
        }
        return join($separator, $out);
    } else {
        return null;
    }
}

表示例

まず、表示例から。

トップ > 現在のページ

トップ > ユーザー一覧 > 現在のページ

といった具合に表示される。

使い方

breadcrumb.ctp をパンクズリストを表示したい場所（layoutがおすすめ）に読み込む

コントローラーでタイトルがセットされている場合は自動的に

トップ > 現在のページ

が表示される。

階層を追加したい場合

適当なviewで

<?php
//パンクズリスト追加
$html->addCrumb('ユーザー一覧','/users/all/');
?>

とやれば ユーザー一覧 が追加され、

トップ > ユーザー一覧 > 現在のページ

と表示される。
パンクズはいくつでも追加できる。

表示されるHTMLソース

・1階層

<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="/" itemprop="url"><span itemprop="title">トップ</span></a></span>
     >
    <span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><span itemprop="title">現在のページ</span></span>

・多階層

<span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="/" itemprop="url"><span itemprop="title">トップ</span></a></span>
   >
  <span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="/users/all/" itemprop="url"><span itemprop="title">ユーザー一覧</span></a></span>
   >
  <span itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><span itemprop="title">現在のページ</span></span>

と、SEO効果抜群の google serp対応パンクズリストが表示される。

テストは以下のURLでできます。

http://www.google.com/webmasters/tools/richsnippets

うまく表示されないんだけど・・・

安心してください。
googleにはこう記載があります。

ページからの抜粋は、ここで現れます。
我々があなたのウェブ・ページからテキストを示すことができない理由は、
テキストがユーザーが入力する問合わせに依存するからです。

要は検索したキーワードによって表示がURLのみの場合があるということですね。