2023.3.29|WordPress

WordPress(ワードプレス)でプラグインなしでカスタム投稿タイプの「パンくずリスト」を表示する実装方法

WordPress(ワードプレス)でプラグインなしでカスタム投稿タイプの「パンくずリスト」を表示する実装方法

WordPress(ワードプレス)で、パンくずリストを表示することができます。パンくずリストを表示するには、プラグインを利用して表示する方法とプラグインを利用しないで表示する方法があります。「パンくずリスト」には意味があり、意味や役割を理解し正しく記述することで様々な効果が期待できます。
WordPress(ワードプレス)では、通常の記事投稿ページや固定ページなどの「パンくずリスト」は、テンプレートタグで用意されている「breadcrumb」を利用することで実装は可能ですが、カスタム投稿タイプを作成した場合は、関数コードにカスタマイズが必要になります。

今回は、WordPress(ワードプレス)でプラグインなしでカスタム投稿タイプの「パンくずリスト」を表示する実装方法を解説します。

パンくずリストとは?SEOへの影響とSEOに効果的な書き方

プラグインなしでカスタム投稿タイプの「パンくずリスト」を表示する実装方法

プラグインなしでカスタム投稿タイプの「パンくずリスト」を表示させる場合は、「functions.php」ファイルに各ページ用のパンくずリストを実装するコードを記述し、「archive.php」や「single.php」などのテンプレートファイルにパンくずリストを表示させる関数コードを記述する必要があります。

【カスタム投稿タイプの「パンくずリスト」を実装する方法】
1.「functions.php」ファイルにコードを記述
2.「テンプレート」ファイルに関数コードを記述

1.「functions.php」ファイルにコードを記述

サーバーにインストールされたWordPressの「テーマ」ファイルから「functions.php」ファイルを探します。
「functions.php」ファイルを開いて必要なコードを記述し、保存を行ったファイルをサーバーにアップロードします。

パンくずリストを実装するコード
function breadcrumb($divOption = array("id" => "breadcrumb", "class" => "clearfix")){
global $post;
$str ='';
if(!is_home()&&!is_admin()){ /* !is_admin は管理ページ以外という条件分岐 */
$tagAttribute = '';
foreach($divOption as $attrName => $attrValue){
$tagAttribute .= sprintf(' %s="%s"', $attrName, $attrValue);
}
$str.= '<div'. $tagAttribute .'>';
$str.= '';
$str.= '<a href="'. home_url() .'/">Webデザイナーブログ TOP</a>';
$str.= '&nbsp;&rsaquo;&nbsp;';
 
if(is_category()) {	//カテゴリーのアーカイブページ
$cat = get_queried_object();
if($cat -> parent != 0){
$ancestors = array_reverse(get_ancestors( $cat -> cat_ID, 'category' ));
foreach($ancestors as $ancestor){
$str.='<a href="'. get_category_link($ancestor) .'">'. get_cat_name($ancestor) .'</a>';
$str.='&nbsp;&rsaquo;&nbsp;';
}
}
$str.='<a href="'. get_category_link($cat -> term_id). '">'. $cat-> cat_name . '</a>';

} elseif(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.='<a href="'. get_category_link($ancestor).'">'. get_cat_name($ancestor). '</a>';
$str.='&nbsp;&rsaquo;&nbsp;';
}
}
$str.='<a href="'. get_category_link($cat -> term_id). '">'. $cat-> cat_name . '</a>';
$str.='&nbsp;&rsaquo;&nbsp;';
$str.= ''. $post -> post_title .'';
} elseif(is_page()){	//固定ページ
if($post -> post_parent != 0 ){
$ancestors = array_reverse(get_post_ancestors( $post->ID ));
foreach($ancestors as $ancestor){
$str.='<a href="'. get_permalink($ancestor).'">'. get_the_title($ancestor) .'</a>';
$str.='&nbsp;&rsaquo;&nbsp;';
}
}

$str.= ''. $post -> post_title .'';
} elseif(is_date()){	//日付ベースのアーカイブページ
if(get_query_var('day') != 0){	//年別アーカイブ
$str.='<a href="'. get_year_link(get_query_var('year')). '">' . get_query_var('year'). '年</a>';
$str.='<li>&gt;</li>';
$str.='<a href="'. get_month_link(get_query_var('year'), get_query_var('monthnum')). '">'. get_query_var('monthnum') .'月</a>';
$str.='<li>&gt;</li>';
$str.=''. get_query_var('day'). '日';
} elseif(get_query_var('monthnum') != 0){	//月別アーカイブ
$str.='<a href="'. get_year_link(get_query_var('year')) .'">'. get_query_var('year') .'年</a>';
$str.='<li>&gt;</li>';
$str.=''. get_query_var('monthnum'). '月';
} else {	//年別アーカイブ
$str.=''. get_query_var('year') .'年';
}
} elseif(is_search()) {	//検索結果表示ページ
$str.='「'. get_search_query() .'」で検索した結果';
} elseif(is_author()){	//投稿者のアーカイブページ
$str .='投稿者 : '. get_the_author_meta('display_name', get_query_var('author')).'';
} elseif(is_tag()){	//タグのアーカイブページ
$str.='タグ : '. single_tag_title( '' , false ). '';
} elseif(is_attachment()){	//添付ファイルページ
$str.= ''. $post -> post_title .'';
} elseif(is_404()){	//404 Not Found ページ
$str.='404 Not found';
} else{	//その他
$str.='<a href="'. get_permalink($ancestor).'">'. get_the_title($ancestor) .'</a>';
$str.='&nbsp;&rsaquo;&nbsp;';
}
$str.='';
$str.='</div>';
}
echo $str;
}

2.「テンプレート」ファイルに関数コードを記述

「functions.php」ファイルに記述した「パンくずリスト」を各ファイルで表示させるためには、「archive.php」や「single.php」などのパンくずリストを表示させる「テンプレート」ファイルに関数コードを記述する必要があります。
「archive.php」や「single.php」などの「テンプレート」ファイルを開きパンくずリストを表示させる個所に関数コードを記述します。 また、関数コードを記述することによって、カスタム投稿タイプの「カテゴリー」「タグ」といったタクソノミーも実装することが出来ます。

「archive.php」に関数コードを記述
※例:HOME > 大カテゴリー(タクソノミー) > 中カテゴリー(タクソノミー)
<div id="breadcrumb" class="clearfix">
<a href="<?php echo bloginfo('url'); ?>">HOME</a> > 
<a href="<?php echo esc_url( home_url( '/' ) ); ?>カテゴリーURLを記載"><?php echo esc_html(get_post_type_object(get_post_type())->labels->singular_name ); ?></a>
</div>
「single.php」に関数コードを記述
※例:HOME > カテゴリー(タクソノミー) > 投稿のタイトル
<div id="breadcrumb" class="clearfix">
<a href="<?php echo bloginfo('url'); ?>">HOME</a> > 
<a href="<?php echo esc_url( home_url( '/' ) ); ?>カテゴリーURLを記載"><?php echo esc_html(get_post_type_object(get_post_type())->labels->singular_name ); ?></a> > <?php
$taxonomy = 'cssproperty_category';
// 投稿に付けられたターム(カテゴリー)の ID を取得する。
$post_terms = wp_get_object_terms( $post->ID, $taxonomy, array( 'fields' => 'ids' ) );
// リンクの区切り文字
$separator = ', ';
if ( !empty( $post_terms ) && !is_wp_error( $post_terms ) ) {

	$term_ids = implode( ',' , $post_terms );
	$terms = wp_list_categories( 'title_li=&style=none&echo=0&taxonomy=' . $taxonomy . '&include=' . $term_ids  . 'orderby=id&use_desc_for_title=0');
	$terms = rtrim( trim( str_replace( '<br />',  $separator, $terms ) ), $separator );

	// 投稿のカテゴリーを表示
	echo  $terms;
}
?> > <?php the_title();?>
</div>

まとめ

パンくずリストを表示する方法はプラグインを利用する場合など沢山の方法がありますが、プラグインを利用することでWebサイトのパフォーマンスに影響する場合があるので「functions.php」ファイルに直接記述する方法をおすすめします。
WordPress(ワードプレス)では、パンくずリストひとつにしてもカスタマイズ方法が沢山あります。Webデザイナーによってコードや関数のカスタマイズ方法は異なりますので、自分に合った方法で設定することをおすすめいたします。