【WordPress】固定ページの親子関係のパンくずナビを出力する方法

固定ページの親子関係でパンくずナビを変更させる

はじめに

最近、仕事で有料のテーマを購入してカスタマイズする機会がありました。

有料のテーマは、デザイン性が高くてお手軽に機能を追加できる反面、あと一歩痒いところに届かない事がたびたびあります。

今回は、なぜか固定ページの親子関係でパンくずナビが切り替わってくれなかったので、自作することにしました。

 

検証環境

wordpress 5.3.2

 

導入

理想図

固定ページの親子関係でパンくずナビを変更させる

 

ソース

<ul><li>を使ったパンくずナビを実装します。

Microdata はただのおまけです。
使用しないなら削除しても問題ありません。

<ul>
<?php
  $list = array();
  $parent_id = $post->post_parent;
  while ($parent_id !== 0){
    $parent_post = get_post($parent_id);
    $parent_id = $parent_post->post_parent;
    array_unshift($list,
      sprintf('<li class="p-breadcrumb__item c-breadcrumb__item" itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
                  <a href="%s" itemscope itemtype="http://schema.org/Thing" itemprop="item">
                     <span itemprop="name">%s</span>
                  </a>
                  <meta itemprop="position" content="%s" />
               </li>',
               esc_url( get_permalink($parent_post->ID) ),
               esc_html($parent_post->post_title),
               $breadcrumb_position++
      )
    );
  }
  echo join('', $list);
?>
  <li class="p-breadcrumb__item c-breadcrumb__item">
    <span itemprop="name"><?php echo strip_tags( get_the_title( $post->ID ) ); ?></span>
    <meta itemprop="position" content="<?php echo $breadcrumb_position++; ?>" />
  </li>
</ul>

 

解説

まず現在の固定ページに親が居るか$post->post_parent を使って判別します。
親が存在しない場合は、0を値として持っています。

親を持っていない場合は、 while() は動作しません。

親を持っている場合は、get_post($parent_id) で親の固定ページを取得します。
そして直後に取得した固定ページに親のIDを設定します。
これで再起的while() を回して、親の固定ページを取得し続けます。

肝心の取得した親の固定ページをリストにする方法ですが、 array_unshift() を使って、取得する毎に配列の先頭に新しいリストを追加していきます。

最後に配列を join() で文字列に変換して出力してやれば完了です。

 

さいごに

WordPressの固定ページの親子関係のパンくずナビを出力する方法でした。

ほとんど備忘録的な記事です。
意外とデキが良くて、気に入っているので思わず記事にしてしまいました。

今日はこの辺でー

  • この記事を書いた人

カバノキ

印刷会社のWEB部隊に所属してます。 WEB制作に携わってから、もう時期10年になります。 普段の業務では、PHPをメインにサーバーサイドの言語を扱っています。 最近のお気に入りはJavascriptです。 Vue.jsを狂喜乱舞しながら、社内に布教中です。

-WordPress
-,