PR

Cocoonでカテゴリーページに一般的なパンくずリストを表示する

ワードプレスのテーマCocoonについて
2019.02.11
この記事は約7分で読めます。

ワードプレス(以下WP)の無料のテーマCocoonでは、設定だけではカテゴリーページ(カテゴリーをクリックした時に表示される当該カテゴリーの一覧のページ)に一般的なパンくずリスト(ホームからの階層型ナビゲーション)が付きません。
「一般的な」という表現をしているのは別のカスタマイズで「下りのパンくずリスト」も実装しているためです。

表示させるためには、WPの動きをコントロールしているPHPというプログラムを一部修正する必要があります。

【2020/7/1 追記】
気が付くのが大変遅くなり申し訳ありません。「具体的な修正方法」の章のなかでコールしている「tmp/breadcrumbs」が更新されたためにカテゴリー表示がされていませんでした。

更新された「breadcrumbs」でコールされるget_the_page_main_category()関数がカテゴリーページでは正しく機能しないようです。

「具体的な修正方法」の内容を変更しましたのでカテゴリーが表示されない場合は追加の修正をしていただけますようお願い致します。

【2020/9/29 追記】
Cocoonバージョン2.2.4.5からカテゴリーページに一般的なパンくずリストが表示できるようになりまた。

バージョン2.2.4.5以降を使用される場合は、本記事の対応は不要です。

スポンサーリンク

修正のやり方を調べる

表示のさせ方は、下記のCocoonのQ&Aページに掲載されています。

カテゴリーページでパンくずリストを表示
カテゴリーページではパンくずリストが表示されませんが、 ホーム＞親カテゴリ＞子カテゴリ＞孫カテゴリ のような感じで表示させたいです。 方法がわからなかったので、質問させていただきま...
wp-cocoon.com

ただし上記の記事の中には、沢山存在するPHPのプログラムのどこを修正すれば良いか?iについての記載がありませんでした。
この理由としてはCocoon設定の中で(カテゴリーページ以外での)「パンくずリストを表示する場所」を設定できるためだからと推察致します。

なお本サイトではこの設定を「メインカラム手前」にしているために、同様な場所に表示する前提で調べたところCocoonのテーマフォルダーの配下に置かれている「tmp/header-container.phpファイル」に上記リンクに書かれているコードを付ければ良さそうであることが分かりました。

具体的な修正方法

tmpフォルダー配下のPHPファイルにコードを付与する際のやり方については、これもまたCocoonの別のQ&Aページに掲載されていました。

カテゴリーページのページネーション先でのアイキャッチ表示について
ここ2ヶ月ほどcocoonを使用させていただき、大変お世話になっております。本当にありがとうございます。 該当するトピックが見当たらなかったのですが、カテゴリーにアイキャッチを設定...
wp-cocoon.com

上記に従い、 「tmp/ header-container.phpファイル 」をCocoonの子テーマの中に同様のフォルダーを作り、ファイルをコピーした上で修正をします。

実際に修正した内容は下記になります。

「header-container.phpファイル」の中の一番最後の行の後に掲載されていたコードを追加します。(下記ソースは途中を省略しています)

<?php //ヘッダーエリア
/**
 * Cocoon WordPress Theme
 * @author: yhira
 * @link: https://wp-cocoon.com/
 * @license: http://www.gnu.org/licenses/gpl-2.0.html GPL v2 or later
 */
if ( !defined( 'ABSPATH' ) ) exit; ?>

<div id="header-container" class="header-container">
          ---- 省略 ----
</div><!-- /.header-container -->
<?php //パンくずリスト    ←この行以下を追加
if (is_category()){
  get_template_part('tmp/breadcrumbs'); 
} ?>

【2020/7/1 追記】

Cocoonのテーマフォルダーの配下に置かれている「tmp/breadcrumbs.phpファイル」を子テーマのtmpフォルダーにコピーをして名前を「breadcrumbs0.php」に変更します。

その上で上記コーディングを下記に変更します。

<?php //パンくずリスト    ←この行以下を追加
if (is_category()){
  get_template_part('tmp/breadcrumbs0');  //2020/7/1 breadcrumbsの最後に0を追加
} ?>

なおbreadcrumbs0.phpの内容を下記のように修正してください。

<?php //カテゴリ用のパンくずリスト
/**
 * Cocoon WordPress Theme
 * @author: yhira
 * @link: https://wp-cocoon.com/
 * @license: http://www.gnu.org/licenses/gpl-2.0.html GPL v2 or later
 */
if ( !defined( 'ABSPATH' ) ) exit;

if (is_single_breadcrumbs_visible() && (is_single() || is_category())){
  $cats = get_the_category();
  //メインカテゴリが指定してある場合は該当カテゴリーを適用
  /*  コメント開始
  $main_cat_id = get_the_page_main_category();
  if ($main_cat_id && in_category($main_cat_id)) {
    $cat = get_category($main_cat_id);
  }
  //メインカテゴリがない場合は先頭のカテゴリを適用
  if (!$cat) {
    $cat = $cats[0];
  }
  */  コメント終了
  $cat = (is_single() && isset($cats[0])) ? $cats[0] : get_category(get_query_var("cat"));  //コメントを外す
  if($cat && !is_wp_error($cat)){
          ---- 省略 ----

23行目のコメントになっている行は更新される前のコーティングになりますので、メインカテゴリーのロジック(14行目から21行目)をコメントアウトして、23行目のコメントを元に戻す修正になります。

【2020/9/29 追記】
Cocoonバージョン2.2.4.5からカテゴリーページに一般的なパンくずリストが表示できるようになりまた。

バージョン2.2.4.5以降を使用される場合は、本記事の対応は不要です。

もしも上記対応をされていた場合は子テーマのtmpフォルダーにコピーをした「tmp/ header-container.php」と「breadcrumbs0.php」を削除してください。

動作の確認

カテゴリーページのヘッダー下の位置にパンくずリストが表示されることを確認しました。

また、もしもパンくずリストを表示させたくない場合は、WP管理画面のCocoon設定→投稿にある、パンくずリストの配置で「表示しない」のリストボックスをクリックすることで、カテゴリーページからもパンくずリストが外れることは確認しました。(当然ではありますがパンくずリスト配置の指定を変更してもカテゴリーページには反映されません。)

以上、修正としては、ほぼほぼ機知の内容にはなりますが、修正を実施したことをご報告申し上げます。

スポンサーリンク