calendarcodediamondfacebookfingerglobalgoogleplushatenahomepagetopplainpocketrssservicetwitterwordpresshome2searchfoldernext-arrowback-arrowfirst-arrowlast-arrow

WordPressでパンくずリストを出す方法

パンくずリストとは、サイトのどの階層にいるのか表示したもので、主にファーストビュー内に表示します。簡単に階層の移動ができるように現在位置以外はリンクで表示されます。今回はWordPressでパンくずリストを出す方法をご紹介します。

PR
IT/WEB業界への転職なら
Sponsored Link

WordPress4.4以降から非推奨になったwp_titleを辞めて、「wp_get_document_title」関数を使ってパンくずリストにページタイトルのリンクを表示します。

functions.php

// WordPress4.4以降のtitleの記述方法
// <title>タグを自動出力
add_theme_support( 'title-tag' );
// <title>タグのセパレーターを変更
add_filter( 'document_title_separator', 'my_document_title_separator' );
function my_document_title_separator( $sep ) {
  $sep = '|';
  return $sep;
}
// titleのDescription削除
add_filter( 'document_title_parts', 'remove_title_description', 10, 1 );
function remove_title_description ( $title ) {
  if ( is_home() || is_front_page() ) {
    unset( $title['tagline'] );
  }
  return $title;
}
// head 以外はタイトルのみを出力
function nohead_document_title($title){
  if(!doing_action('wp_head')){
    //doing_actionで、wp_headから呼ばれていない場合を判別
    unset( $title['site'] ); //サイトタイトルを削除
  }
  return $title;
}
add_filter('document_title_parts','nohead_document_title');

head内はサイトタイトルとセパレーターを表示して、head以外はサイトタイトルを削除します。これでパンくずリストの部分にはページタイトルのみ表示されるようになります。

インクルード

// パンくずリスト出力
<section class="breadcrumb">
  <?php if(is_home()) : ?>
  <?php elseif (is_page()) :?>
    <a href="<?php echo esc_url( home_url() ); ?>">HOME</a> &gt; <?php echo wp_get_document_title(); ?>
  <?php elseif (is_category()) :?>
    <a href="<?php echo esc_url( home_url() ); ?>">HOME</a> &gt; 「<?php single_cat_title(); ?>」カテゴリー
  <?php elseif (is_month()) :?>
    <a href="<?php echo esc_url( home_url() ); ?>">HOME</a> &gt; 「<?php the_time('Y年m月'); ?>」月別アーカイブ
  <?php elseif (is_singular( 'news' )) :?>
    <a href="<?php echo esc_url( home_url() ); ?>">HOME</a> &gt; <a href="<?php echo esc_url( home_url( '/news' ) ); ?>">新着ニュース</a> &gt; <?php echo wp_get_document_title(); ?>
  <?php elseif (is_single()) :?>
    <a href="<?php echo esc_url( home_url() ); ?>">HOME</a> &gt; <?php $c = get_the_category(); echo '<a href="' . get_category_link( $c[0]->term_id ) . '">' . $c[0]->name . '</a>'; ?> &gt; <?php echo wp_get_document_title(); ?>
    <?php elseif (is_search()) :?>
      <a href="<?php echo esc_url( home_url() ); ?>">HOME</a> &gt; <?php echo wp_get_document_title(); ?>
  <?php else : ?>
  <?php endif; ?>
</section>

あとは、パンくずリストを表示させたいページにインクルードさせればOKです。

WordPressカスタマイズに便利なテクニックはこちら

条件分岐

WordPressのif文(条件分岐)

テンプレートタグ

WordPressテーマ作成の時に覚えておくと便利なテンプレートタグ

functions.php

WordPressのfunctions.phpに書いておくと捗ること

コメント出力

WordPressにコメントを設置する簡単な方法

スポンサード リンク

この記事を書いた人
投稿者:commte

株式会社コムテ代表取締役。2015/8:弊社にてWeb制作スクールを開始。 WebDesign + Web制作 (最新情報 配信)。おっとりした話し方をするおっさん。

URL:西田 鉄平
この後によく読まれている記事

Comments

Leave a Comment

コメントする

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください