親子孫カテゴリーを子孫でリスト表示したい

Question

前提・実現したいこと

カテゴリーでわけている都道府県と区・市を県ごとに整頓させて表示させたいです。

イメージ図です。

カテゴリー

店舗エリア-都道府県-市区カテゴリー
親-子-孫カテゴリー

店舗エリア
|-東京-中野
|　　 -中目黒
|　　 -上野
|　　 -神楽坂
|
|-千葉-松戸
|
|-神奈川-神奈川
|
|-福岡-福岡
|
親子孫になっています。
また、今後増えていきます。

発生している問題・エラーメッセージ

都道府県ごとに分けたいのですが分けれていません。
県はカテゴリー的に子カテゴリーになります。

該当のソースコード

<?php get_header();
/*
Template Name: エリアマップ
*/ ?>

<?php
  $cat = get_category_by_slug("shop-area");
  $catId = $cat->cat_ID;
  //カテゴリ情報取得
  var_dump($catId);
  if (get_term_children($catId, 'category')) { //子カテゴリーがある場合
    $catChird = get_term_children($catId, 'category');
    foreach ($catChird as $key => $value) {
        echo "<li href=".get_category_link($value)." >".get_cat_name($value)."</li>";
    }
  }

?>

yukikp様
結果のスクリーンショットです。

参考までに
YukiYamashina様

<h3>YukiYamashina</h3>
<?php
  $ids = wp_list_pluck( get_categories( [ 'child_of' => 115, 'hide_empty' => false ] ), 'term_id' );
  wp_list_categories( [ 'include' => implode( ',', $ids ), 'hide_empty' => false ] );
?>

結果

ですが、県も表示されてしまうのでshop-areaの子要素・孫要素のすべてを記述していると思います。
もうすこし思考してみます

---

追加
カテゴリーを見せてほしいとのことでしたので

画像

Answer 1

出来ました！想定通りに表記するようになりました
sidebarに使っていた関数をもとにいじって作成したので、結局functions.phpに記述するようになりました。
スクショのせておきます。
処理が多いのが少し気になりますが

これをベースにグリッドを入れ込みたいと思います。
ありがとうございました！

<?php
  //shop-areaが親
  function test() {
    $cat = get_category_by_slug('shop-area');
    $catChird = get_term_children($cat->cat_ID, 'category', array(
      // 'child_of' => 4
    ) );
    foreach($catChird as $key => $value) {
      if (get_term_children($value, 'category')) {
        echo "<p>ko." . get_cat_name($value) ."</p>";
        $magoID = get_term_children($value, 'category');
        foreach ($magoID as $key => $valueMago) {
          echo "<p>　mago." . get_cat_name($valueMago) ."</p>";
        }
      }
    }
  }
?>

Answer 2

$ids = wp_list_pluck( get_categories( [ 'child_of' => 115, 'hide_empty' => false ] ), 'term_id' );
wp_list_categories( [ 'include' => implode( ',', $ids ), 'hide_empty' => false, 'title_li' => '' ] );

Comments

[makoto-n]

返答ありがとうございます。
指摘されている書き方は
<?php
$cat = get_category_by_slug("shop-area");
$catId = $cat->cat_ID;
//カテゴリ情報取得
var_dump($catId);

$ids = wp_list_pluck( get_categories( [ 'child_of' => $cat_ID, 'hide_empty' => false ] ), 'term_id' );
wp_list_categories( [ 'include' => implode( ',', $ids ), 'hide_empty' => false ] );
?>
であっていますか？

全カテゴリが表示されます。
トリビア
販売
店舗エリア
千葉県
松戸
東京
中目黒

[YukiYamashina]

$catId = $cat->cat_ID;
としているのに、get_categories で指定しているのは
'child_of' => $cat_ID
となっています。

[makoto-n]

上書きしているということですか？
個人的にはslugからたどっていきたいのでget category by slugを使っています。

[makoto-n]

YukiYamashina様のコードでは店舗エリア以下　'child_of' => 115　のカテゴリが全て取得できました。
が、すべて並列に取得しています。

[YukiYamashina]

いえ、$cat_ID という名前の変数が定義されていません。
$catId = $cat->cat_ID; でカテゴリーIDを定義しているのであれば、
'child_of' => $catId
ではないでしょうか？

[makoto-n]

あ、上記理解しました。

[makoto-n]

参考までに現在状況を追記しました。

[YukiYamashina]

> 件も表示されてしまうのでshop-areaの子要素すべてを羅列いると思います。
どういった状況でしょうか？

[makoto-n]

失礼しました。
件->県です。

[YukiYamashina]

それは想像できたのですが、
> すべてを羅列いると思います
が分かりませんでした。

[makoto-n]

羅列というより表記と言ったほうがつたわりやすいでしょうか？

[YukiYamashina]

いえ、「羅列いる」という動詞？は一般的には使われないため、打ち間違いか何かかと思いました。

> ですが、県も表示されてしまうのでshop-areaの子要素・孫要素のすべてを羅列していると思います。
例えば「東京」と「中野」が同じ階層で表示されるということでしょうか？

[makoto-n]

失礼しました。
はい、同じ階層です。
東京のclassもcat-item cat-item-196、
駒越のclassはcat-item cat-item-129
となっており、わけられていると思えません。

[YukiYamashina]

「駒越」の親カテゴリーが「東京」になっていないのではないでしょうか？
その他の子カテゴリーについても同様です。

[makoto-n]

なっています。
千葉の子に松戸が
神奈川の子に神奈川が

[YukiYamashina]

お手数ですが管理画面でのカテゴリー一覧のスクリーンショットを添付していただけますか？

[makoto-n]

追加しました。

[YukiYamashina]

カテゴリーの親子関係が正しく設定されているのであれば、あと考えられるのは li > ul に padding-left: 0 が指定されているため、実際には階層をもたせて HTML が表示されているけど見た目上は同じ階層になっているように見える、という可能性です。
ブラウザの開発者ツールで wp_list_categories での出力部分に <ul class="children"> があるかどうか、あれば padding-left が 0 になっていないかを確かめてみてください。

[makoto-n]

すみません、遅くなりました。
スクショ添付してます。

Answer 3

wp_list_categories()関数ではだめでしょうか？

もしくは、

$parent = get_terms( array( 'taxonomy' => 'category', 'parent' => 0, 'hide_empty' => false, ) );
foreach( $parent as $p ){
?>
<div class="CityList">
<h2 class="CityList__head"><?php echo $p->name;?></h2>
<?php
    $child = get_terms( array( 'taxonomy' => 'category', 'parent' => $p->term_id, 'hide_empty' => false, ) );
    if( $child ){
?>
<ul class="CityList__body City">
<?php
        foreach( $child as $c ){
?>
  <li class="City__item"><a href="<?php echo get_term_link( $c, 'category' );?>"><?php echo $c->name;?></a></li>
<?php
        }
?>
</ul>
<?php
    }
?>
</div>
<?php
}
?>

Comments

[makoto-n]

wp_list_categories()だとすべてのカテゴリが出力されてしまいます。
店舗エリア以外にも時期とかカテゴリがあります。

追記してくださってありがたいのですが、
　サイトに技術的な問題が発生しています。
となってしまいます。

[YukiYamashina]

> wp_list_categories()だとすべてのカテゴリが出力されてしまいます。
> 店舗エリア以外にも時期とかカテゴリがあります。

exclude_tree で除外するカテゴリーツリーを指定できます。

[yukikp]

>店舗エリア以外にも時期とかカテゴリがあります。

ならば、1行目の'parent' => 0の代わりに、
//$cat = get_category_by_slug("shop-area");
parent' => $cat->cat_ID
にしてみてください。

[makoto-n]

返答が遅れてすみません。

<div class="clearfix">の直下に

<?php
$cat = get_category_by_slug("shop-area");
$parent = get_terms( array( 'taxonomy' => 'category', 'parent' => $cat->cat_ID, 'hide_empty' => false, ) );
foreach( $parent as $p ){
?>
<div class="CityList">
<h2 class="CityList__head"><?php echo $p->name;?></h2>
<?php
$child = get_terms( array( 'taxonomy' => 'category', 'parent' => $p->term_id, 'hide_empty' => false, ) );
if( $child ){
?>
<ul class="CityList__body City">
<?php
foreach( $child as $c ){
?>
<li class="City__item"><a href="<?php echo get_term_link( $c, 'category' );?>"><?php echo $c->name;?></a></li>
<?php
}
?>
</ul>
<?php
}
?>
</div>

を貼り付けていますが、用法が間違えていますか？
　サイトに技術的な問題が発生しています。
と表記されます。

[makoto-n]

> exclude_tree で除外するカテゴリーツリーを指定できます。
なにのカテゴリが追加されるか考えられませんので、
slug = shop-areaの子カテゴリを　子ー＞孫として表示したいです。

[yukikp]

最後の閉じかっこを忘れてました。