パンくずリストをプラグイン無しで作る

2021年02月25日   コメントを残す

今回はプラグイン無しでパンくずリストを作ったので、備忘録としてメモしておきます。

作成にあたって、とても分かり易い解説がされている下記サイトを参照いたしました。(感謝!)

WordPress】パンくずリストをプラグイン無しで自作する方法

オリジナルゲーム.com【WordPress】パンくずリストをプラグイン無しで自作する方法」参照

作成手順は、

  1. 作業前に変更するファイルのコピーを取っておく(※これ、大事です)
  2. functions.phpにコードを追記する
  3. パンくずを表示させたいファイルにコードを追記する
  4. style.cssでスタイルを整える
  5. category.phpとtag.phpの二重表記を修正(必要があれば)

2.functions.phpに追記したコード

「【WordPress】パンくずリストをプラグイン無しで自作する方法」に掲載されている完成版を、まるっきりコピーして使用させていただきました。

// ===========================
// = パンくず =
// ===========================
function mytheme_breadcrumb() {
    	//HOME>と表示
    	$sep = '>';
    	echo '<li><a href="'.get_bloginfo('url').'" >HOME</a></li>';
    	echo $sep;
     
    	//投稿記事ページとカテゴリーページでの、カテゴリーの階層を表示
    	$cats = '';
    	$cat_id = '';
    	if ( is_single() ) {
    		$cats = get_the_category();
    		if( isset($cats[0]->term_id) ) $cat_id = $cats[0]->term_id;
    	}
    	else if ( is_category() ) {
    		$cats = get_queried_object();
    		$cat_id = $cats->parent;
    	}
    	$cat_list = array();
    	while ($cat_id != 0){
    		$cat = get_category( $cat_id );
    		$cat_link = get_category_link( $cat_id );
    		array_unshift( $cat_list, '<a href="'.$cat_link.'">'.$cat->name.'</a>' );
    		$cat_id = $cat->parent;
    	}
    	foreach($cat_list as $value){
    		echo '<li>'.$value.'</li>';
    		echo $sep;
    	}
     
    	//現在のページ名を表示
    	if ( is_singular() ) {
    		if ( is_attachment() ) {
    			previous_post_link( '<li>%link</li>' );
    			echo $sep;
    		}
    		the_title( '<li>', '</li>' );
    	}
    	else if( is_archive() ) the_archive_title( '<li>', '</li>' );
    	else if( is_search() ) echo '<li>検索 : '.get_search_query().'</li>';
    	else if( is_404() ) echo '<li>ページが見つかりません</li>';
    }

3.パンくずリストを表示させたいファイルに追記するコード

<div class="mytheme_breadcrumb">
    <?php mytheme_breadcrumb(); ?>
       </div>

パンくずリストを表示させたいファイル
  ・single.php
  ・category.php
  ・tag.php

コードを追記する位置は各ファイルの<div id=”content” role=”main”>の下になります。<div>のクラス名は任意。

4.style.cssでスタイルを整える(一例:2021/03/27修正しました)

/* パンくず */
.mytheme_breadcrumb li {
    font-size: 90%;
    display: inline-block;   
}

5.category.phpとtag.phpの二重表記を修正

私が使っているテンプレートでは、カテゴリーとタグページに元々パンくずが表示されていたので、二重表記になってしまいました。スタイルを統一するために
category.phpとtag.phpのコードを一部削除しました。

category.phpで削除したところ

&lt;h1 class="archive-title">&lt;?php printf( __( 'Category Archives: %s', 'twentytwelve' ), '&lt;span>' . single_cat_title( '', false ) . '&lt;/span>' ); ?>&lt;/h1>

tag.phpで削除したところ

&lt;h1 class="archive-title">&lt;?php printf( __( 'Tag Archives: %s', 'twentytwelve' ), '&lt;span>' . single_tag_title( '', false ) . '&lt;/span>' ); ?>&lt;/h1>

コメントを残す

お名前は必須項目です。

CAPTCHA


画像を添付できます(JPEGのみ)