0

Trying to get my list of categories to display the child after the parent.

For Example

  • Parent Category
    • Child Category
    • child category
  • Parent Category
    • child category

Current code

    <aside class="sidebar">
                 <div class="widget widget-filter">
                     <button class="widget-title">Explore Topics</button>
                     <svg class="separator" viewBox="0 0 238 11" preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg">
                <line opacity="0.3" y1="0.5" x2="101.942" y2="0.5" stroke="#3CD5AF"></line>
                <line opacity="0.3" y1="10.5" x2="237.5" y2="10.5" stroke="#3CD5AF"></line>
              </svg>
        
<?php

    $post_type = get_post_type( $post->ID );
    $postType = get_queried_object();
 $args = array(
                    'post_type'      => $post_type,
                    'post_status'    => 'publish',
                );

    $the_query = new WP_Query( $args );
    $my_categories = array();
    if ( $the_query->have_posts() ) {
        while ( $the_query->have_posts() ) {
            $the_query->the_post();

            $terms = get_the_terms( get_the_ID(), 'category' );
            if ( $terms && ! is_wp_error( $terms ) ) : 
                foreach ( $terms as $term ) {
                if(!in_array($term->term_id, $my_categories))
                    $my_categories[] = $term->term_id;
                }   
            endif;  
        }
        wp_reset_postdata();
    }

    if(sizeof($my_categories)) { ?>
     <ul class="filter-list">
         
          <li :class="">
                     <a class="parent" @click="showDefault(<?= $category->term_id; ?>)">See All</a>
                </li> 
     
         
      
            
         <?php
        foreach ($my_categories as $term_id) {
            $category = get_term_by('id', $term_id, 'category');
            if($category->slug!="all-articles") {
                
                if($category->parent != 0){ // If this is a subcategory
     
        ?>
          <li :class="category == <?php echo $category->term_id; ?> ? 'child' : ''" ;>
                     <a class="child" @click="filterPosts(<?= $category->term_id; ?>)"><?= esc_html( $category->name ); ?></a>
                </li> <?php
    } else {
    ?>
      <li :class="category == <?php echo $category->term_id; ?> ? 'parent' : ''" ;>
                     <a class="parent" @click="filterPosts(<?= $category->term_id; ?>)"><?= esc_html( $category->name ); ?></a>
                </li> 
                <?php
    }
          
            }
        }
    }
    ?>
    </ul>
    </div>
    </aside>

1 Answer 1

1

To display a list of categories with their child categories following the parent categories, you can use WordPress's get_categories() function to fetch the categories and their child categories.

Simple script print to show parent categories with own child category attached in looping you can review the code and implement to your code as per reference.

For Example

Parent Category

 - Child Category 
 - child category

Parent Category

 - child category



$categories = get_categories(array(
    'orderby' => 'name',
    'order' => 'ASC',
    'hide_empty' => false // Include empty categories as well
));

$parent_categories = array();
$child_categories = array();

// Separate parent and child categories
foreach ($categories as $category) {
    if ($category->parent == 0) {
        $parent_categories[] = $category;
    } else {
        $child_categories[$category->parent][] = $category;
    }
}

// Display parent categories and their child categories
foreach ($parent_categories as $parent_category) {
    echo '<h2>' . $parent_category->name . '</h2>';

    if (isset($child_categories[$parent_category->term_id])) {
        echo '<ul>';
        foreach ($child_categories[$parent_category->term_id] as $child_category) {
            echo '<li>' . $child_category->name . '</li>';
        }
        echo '</ul>';
    }
}
1
  • although works separately, having difficult time integrating ito my code above
    – Beep
    Feb 13 at 12:48

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.