【Cocoon】パンくずリストの設置方法とカスタマイズ

WordPress

自分のブログですら、記事の森で迷子になります。帰り道がわかりません。「パンくずリスト」は帰り道の目印になります。

サイト内での「記事」の現在地「階層」を知ることが出来ます。

「パンくずリストに記事タイトルを含める」かは、サイト管理者のお好みで選択できます。(この例では表示させてます。)

パンくずリストの設置方法

Cocoonの場合です。このサイトの設定です。

「Cocoon 設定」

「投稿」

「パンくずリスト設定」

  • 「パンくずリストの配置」 メインカラムトップ
  • 「パンくずリストに記事タイトルを含める」

「変更をまとめて保存」を忘れずに!

この記事を書いた後、「パンくずリストに記事タイトルは含めない」ことにしました。(アンチェックしてます)

Cocoonの完成度の高さに感謝です。標準機能だけでここまで設定できます。

その他 Cocoon 覚書はこちらです。

「パンくずリスト」のカスタマイズ

「パンくずリスト」の正式なカスタマイズはこちら

「パンくずリスト」の「ホーム」を「TOP」などに表示変更する方法については、公式サイトで紹介されています。

パンくずリストのルートテキストを変更するカスタマイズサンプル集

以下は、我流のカスタマイズ方法です

PHPファイルを修正

PHPファイルを直接、修正します。

まず、「パンくずリスト」というキーワードで親テーマの「themes/cocoon-master」以下をグローバル検索(grep)します。

関連するファイルが2つありました。

//固定ページ用のパンくずリスト <<breadcrumbs-page.php
//カテゴリ用のパンくずリスト <<breadcrumbs.php

ヒットした2つのファイルをFTPで、親テーマから子テーマにコピーします。

FTP: themes/cocoon-master/tmp/breadcrumbs.php
>> themes/cocoon-child-master/tmp/breadcrumbs.php

FTP: themes/cocoon-master/tmp/breadcrumbs-page.php
>> themes/cocoon-child-master/tmp/breadcrumbs-page.php

2つのファイルで、ソースの該当部分をそれぞれ修正します。

$root_text = __( ‘ホーム‘, THEME_NAME );
>>$root_text = __( ‘LUFA-TOP‘, THEME_NAME );

「ホーム」が「LUFA-TOP」に変わりました。
「TOP」「HOME」「ROOT」など、表示はお好みでカスタマイズできます。

「パンくずリスト」を本文直下にも追加表示

以上の設定で「パンくずリスト」はメインカラムトップに表示されています。記事を読み終わった後も帰り道がわかるよう、本文直下にも「パンくずリスト」を表示することにします。これは「single-contents.php」を修正します。

まず、親テーマから子テーマにファイルをコピーします。

FTP: themes/cocoon-master/tmp/single-contents.php
>> themes/cocoon-child-master/tmp/single-contents.php


<?php //本文テンプレート
get_template_part('tmp/content') ?>

<?php //パンくずリスト記事下追加 2020/05/10 lufa
  get_template_part('tmp/breadcrumbs'); 
?>

本文テンプレートの下に、コードを追加しました。ちょっと強引?ですが、これによって、本文直下にも「パンくずリスト」が表示されるようになりました。

※注意事項

注1)この方法は自由自在にCocoonをカスタマイズできますが、必ず子テーマにコピーしたファイルを修正しましょう。親テーマのファイルを直接修正すると、アップデートでカスタマイズが消失します。

PHP WordPress の教材として、Cocoonのソースはとても参考になります。ありがたいことです。

コメント

タイトルとURLをコピーしました