I have the following issue for my customer. Can some suggest a possible solution to this issue?

This website has Categories & Subcategories




  • When I click on Cat1 or Cat2, I need to display something like that:
  • Repeat this action as long the category & Subcategory as posts! (important)

It should looks like this

After cliking on this subcategories, I must be able to generate a page with all post from this Subcategories.

PS: It wuold be nice if you can tell me how I can do this. And how I may put the variable in the DIV from my category.php (get_the_title; Get_the desciption..)

  • So you want to have the parent category (Cat1/Cat2) take you to a page like the screenshot above, and it isn't until a subcategory is clicked, that it goes to a list of posts? Am I understanding correctly? You can edit the category.php so that it doesn't use get_template_part to load a loop and use a custom file instead. Use an if statement that will only load the loop if it's a subcategory. This might help: rachievee.com/2014/09/06/… – RachieVee Sep 16 '14 at 19:49
  • Also try this topic for listing subcategories beneath the category parents: wordpress.stackexchange.com/questions/13485/… – RachieVee Sep 16 '14 at 19:59
  • Was this question resolved successfully? If so please do accept the answer, or post and accept an answer yourself, so that we can keep the site tidy. Thanks. – Andy Macaulay-Brook Aug 7 '16 at 21:09

From what I understand, there is a list of parent categories and the subcategories, which are like a menu. For your first screenshot:

Cat1 -Subcat1 -Subcat2 -Subcat3

Cat2 -Subcat1 -Subcat2 -Subcat3

Assuming you only have two levels of categories, you would use this to display your categories. Note that you can use this outside the loop:

<ul class="category-sidebar">   
        $get_parent_cats = array(
            'parent' => '0' //get top level categories only

        $all_categories = get_categories( $get_parent_cats );//get parent categories 

        foreach( $all_categories as $single_category ){
            //for each category, get the ID
            $catID = $single_category->cat_ID;

            echo '<li><a href=" ' . get_category_link( $catID ) . ' ">' . $single_category->name . '</a>'; //category name & link
            $get_children_cats = array(
                'child_of' => $catID //get children of this parent using the catID variable from earlier

            $child_cats = get_categories( $get_children_cats );//get children of parent category
            echo '<ul class="children">';
                foreach( $child_cats as $child_cat ){
                    //for each child category, get the ID
                    $childID = $child_cat->cat_ID;

                    //for each child category, give us the link and name
                    echo '<a href=" ' . get_category_link( $childID ) . ' ">' . $child_cat->name . '</a>';

            echo '</ul></li>';
        } //end of categories logic ?>
</ul><!--end of category-sidebar-->

Now for your second screenshot, I assume that when you click on a parent category from the above menu, it will show a page like that with each sub-category and it's description.

Refer to the tutorial I left in the comments for using conditionals in the category.php, basically what you'll be doing in the archive is checking if a parent category is loading or a sub-category. If it's a sub-category, show a loop of posts, if it's a parent, show the sub-categories with descriptions page. Here is what the code for the sub-categories and their descriptions would look like in the loop:

        //for this category on an archive page, get the ID
        $thisID = get_query_var('cat');

        $get_children_cats = array(
            'child_of' => $thisID //get children of this parent using the thisID variable from earlier

        $child_cats = get_categories( $get_children_cats );//get children of this parent category

        foreach( $child_cats as $child_cat ){
            //for each child category, get the ID
            $childID = $child_cat->cat_ID;

            //for each child category, give us the link and name and description
            echo '<div class="child-wrap"><h2><a href=" ' . get_category_link( $childID ) . ' ">' . $child_cat->name . '</a></h2><br/>';
            echo '<p>' . $child_cat->category_description . '</p></div>';
        } //end of categories logic ?>

I realize this is a lot of code but it looks like you're asking to do multiple things, the only task you have to work on yourself is getting the archive to either display the list of posts or your page in the second screenshot. Hope this helps better than the resources in the comments that I'd provided earlier. Good luck!

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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