パン屑リストを表示させよう【コピペ即SEOアップに効果的!】

ぱんくず

皆さんもパン屑リストを表示させてSEOもユーザビリティも向上

システムエンジニア(SE)かっきーです。

皆さんのサイトにはパン屑リストはついていますか。
パン屑リストは単にサイトの構造を見やすくするだけではなく、SEOも向上させてくれます。

またユーザ目線で考えた際もサイト内を回ってもらえる確率がかなり上がります。
今回はこのパン屑リストを表示させたいと思います。

パン屑リストとは

パン屑リストはご存知でしょうか。

パンくずリスト(breadcrumb list)は、ウェブサイト内でのウェブページの位置を、ツリー構造を持ったハイパーリンクの一覧として示すもの。
英語では単に“breadcrumbs”または“breadcrumb navigation”というのが一般的である。
wikipedia

記事ページの上にある、現在のサイト内の場所を示してくれるものです。

パンくずの作成

パンくずリストを表示させるには「get_the_category();」関数をしようします。
これはあらかじめWordpress側で持っている関数です。

「get_the_category();」の引数

get_category_parents(現在のカテゴリー,リンクの有無,’カテゴリー間の文字’);の引数が用意されています。

現在のカテゴリー:カテゴリーをIDで指定
リンクの有無:TRUEでカテゴリーページへのリンクを表示
カテゴリー間の文字:>などの文字を指定

関数の具体的な使い方

下記のように記載してあげることにより、始めのhomeからパンくずが表示されます。

<?php $postcate = get_the_category(); ?>
<ol>
<li><a href="<?php echo home_url(); ?>">ホーム</a> > </li>
<li><?php echo get_category_parents($postcate[0]->term_id,TRUE,' > '); ?></li>
</ol>

function.phpの編集

まずfunction.phpを編集していきます。
function.phpを編集する際は以前紹介した【Code Snippets】の使用を」おすすめします。
では早速行ってみましょう

function the_bread( $query = true ){
 
    if( is_archive()){
        $cate = get_queried_object();
    }else if( is_single() ){
        $cate = get_the_category();
        $cate = $cate[0];
    }
    $queried_object = get_queried_object();
    $current = array( "name"=>$cate->name , "term_id"=>$cate->term_id );
    $parents = array();
     
    echo '<ol class="bread clearfix" itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb">';
     
    if( is_home() ){
        //トップページの場合にはリンクを表示させない
        echo '<li>ホーム</li>';
    }elseif( is_search() ){
        $search_query =  get_search_query();
        echo '<li><a href="' . home_url() . '/" itemprop="url"><span itemprop="title">ホーム</span></a> > </li><li>「'. $search_query .'」の検索結果</li>';
    }elseif( is_page() ){
        //固定ページの処理
        echo '<li><a href="' . home_url() . '/" itemprop="url"><span itemprop="title">ホーム</span></a> > </li>';
         
        if( $parent_ID = $queried_object->post_parent ){
             
            while( $parent_ID ){
                $parent = get_post( $parent_ID );
                array_unshift($parents , $parent);
                $parent_ID = $parent->post_parent;
            }
             
            foreach( $parents as $parent ){
                echo '<li><a href="'. get_permalink( $parent->ID ) .'" itemprop="url"><span itemprop="title">'. $parent->post_title .'</span></a> > </li>';
            }
        }
         
    }else{
        //それ以外のページの処理
        echo '<li><a href="' . home_url() . '/" itemprop="url"><span itemprop="title">ホーム</span></a> > </li>';
         
        while( $cate->parent ){
            //ひとつ上の階層のカテゴリデータを配列$parentsの先頭に格納
            //下からカテゴリ階層を遡るのでデータは常に先頭に格納する必要がある
            $cate = get_category( $cate->parent );
            array_unshift($parents , $cate);
        }
         
        //$parentsの内容を表示
        foreach( $parents as $parent ){
            echo '<li><a href="'. get_category_link( $parent->term_id ) .'" itemprop="url"><span itemprop="title">' . $parent->name . '</span></a> > </li>';
        }
         
        //現在表示されているカテゴリの表示
        if( is_archive()){
            echo '<li>'.$current["name"].'</li>';
        }else if( is_single() ){
            echo '<li><a href="'. get_category_link( $current[" term_id"]="" )="" .'"="" itemprop="url"><span itemprop="title">'. $current["name"] .'</span></a> > </li>';
        }
    }
    echo '<li>'.$queried_object->post_title.'</li>';
    echo "</ol>";
}

パンくずリストの表示

パンくずリストを表示させたい箇所に記述します。

<?php the_bread(); ?>

これだけで完了です。

記事の文章作成や、Wordpressサイトのカスタマイズで
お困りではありませんか?
ライティングレシピでは、文章コンサルとWordpressサイトのカスタマイズを承っております!

文章コンサル
●文章力をあげてスキルアップしたい
●SEOを意識した文章を書きたい
●ライター目線で文章が書けるようになりたい

Wordpressサイトのカスタマイズ
●憧れのサイトのようにしてみたい
●不具合を修正したい
●デザインを理想通りに変更したい

少しでも当てはまる項目があるなら、いつでもお気軽にご相談くださいませ。 ココナラ満足度100%で、提案力には自信があります!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です