WordPressでプラグインを使わずパンくずリストを設置する

WordPressでパンくずを設置する際にプラグインを使ってもいいのですが、パンくず程度であればプラグインを使わずに簡単に設置できるので紹介&自分用にメモ。

以下、functions.phpに記述。

// パンくずリスト
function breadcrumb(){
	global $post;
	$str ='';
	if(!is_home()&&!is_admin()){ /* !is_admin は管理ページ以外という条件分岐 */
		$str.= '<div id="breadcrumb">';
		$str.= '<ul>';
		$str.= '<li><a href="' . home_url('/') .'" class="home"><span>HOME</span></a></li>';
		
		/* 投稿のページ */
		if(is_single()){
			$categories = get_the_category($post->ID);
			$cat = $categories[0];
			if($cat -> parent != 0){
				$ancestors = array_reverse(get_ancestors( $cat -> cat_ID, 'category' ));
				foreach($ancestors as $ancestor){
					$str.='<li><a href="'. get_category_link($ancestor).'" ><span>'. get_cat_name($ancestor). '</span></a></li>';
									}
			}
			$str.='<li><a href="'. get_category_link($cat -> term_id). '"><span>'. $cat-> cat_name . '</span></a></li>';
			$str.= '<li><span>'. $post -> post_title .'</span></li>';
		} 
		
		/* 固定ページ */
		elseif(is_page()){
			if($post -> post_parent != 0 ){
				$ancestors = array_reverse(get_post_ancestors( $post->ID ));
				foreach($ancestors as $ancestor){
					$str.='<li><a href="'. get_permalink($ancestor).'"><span>'. get_the_title($ancestor) .'</span></a></li>';
									}
			}
			$str.= '<li><span>'. $post -> post_title .'</span></li>';
		}
		
		/* カテゴリページ */	
		elseif(is_category()) {
			$cat = get_queried_object();
			if($cat -> parent != 0){
				$ancestors = array_reverse(get_ancestors( $cat -> cat_ID, 'category' ));
				foreach($ancestors as $ancestor){
					$str.='<li><a href="'. get_category_link($ancestor) .'"><span>'. get_cat_name($ancestor) .'</span></a></li>';
				}
			}
			$str.='<li><span>'. $cat -> name . '</span></li>';
		}
		
		/* タグページ */
		elseif(is_tag()){
			$str.='<li><span>'. single_tag_title( '' , false ). '</span></li>';
		} 
		
		/* 時系列アーカイブページ */
		elseif(is_date()){
			if(get_query_var('day') != 0){
				$str.='<li><a href="'. get_year_link(get_query_var('year')). '"><span>' . get_query_var('year'). '年</span></a></li>';
				$str.='<li><a href="'. get_month_link(get_query_var('year'), get_query_var('monthnum')). '"><span>'. get_query_var('monthnum') .'月</span></a></li>';
				$str.='<li><span>'. get_query_var('day'). '</span>日</li>';
			} elseif(get_query_var('monthnum') != 0){
				$str.='<li><a href="'. get_year_link(get_query_var('year')) .'"><span>'. get_query_var('year') .'年</span.</a></li>';
				$str.='<li><span>'. get_query_var('monthnum'). '</span>月</li>';
			} else {
				$str.='<li><span>'. get_query_var('year') .'年</span></li>';
			}
		}	

		/* 投稿者ページ */
		elseif(is_author()){
			$str .='<li><span>投稿者 : '. get_the_author_meta('display_name', get_query_var('author')).'</span></li>';
		}	
		
		/* 添付ファイルページ */
		elseif(is_attachment()){
			if($post -> post_parent != 0 ){
				$str.= '<li><a href="'. get_permalink($post -> post_parent).'"><span>'. get_the_title($post -> post_parent) .'</span></a></li>';
			}
			$str.= '<li><span>' . $post -> post_title . '</span></li>';
		}

		/* 検索結果ページ */
		elseif(is_search()){
			$str.='<li><span>「'. get_search_query() .'」で検索した結果</span></li>';
		} 
		
		/* 404 Not Found ページ */
		elseif(is_404()){
			$str.='<li><span>お探しの記事は見つかりませんでした。</span></li>';
		} 
				
		/* その他のページ */
		else{
			$str.='<li><span>'. wp_title('', false) .'</span></li>';
		}
		$str.='</ul>';
		$str.='</div>';
	}
	echo $str;
}

投稿者ページや添付ファイルページなどwebサイトによっては必要ない記述もあるので必要なければ削除してしまっても良いですが、後々そういったページが増える可能性を考えれば特にエラーになるわけでもないので残して置いてもいいと思います。

続いて出力させる場所に以下の記述を追加。

<?php breadcrumb(); ?>

大体はheader.phpに記述します。
この記述でほとんどのケースでパンくずリストを表示可能ですね。

あとパンくずリストは以下のようなcssで横並び表示にすることが多いです。

#breadcrumb ul{
		@include display-flex;
		li{
			@include rem-font-size(14);
			&:after{
				content: "\f105";
				font-family: FontAwesome;
				padding: 0 8px;
			}
			&:last-child:after{
				content: "";
			}
			a{
				@include rem-font-size(14);
				color: #999999;
				&:hover{
					color: #000;
				}
			}
		}
	}

@media screen and (max-width: 768px){
	#breadcrumb{
		width: 100%;
		ul{
			display: block;
			li{
				display: inline-block;
			}
		}
	}
}

コピペでどうぞ！