1

I'm customizing my theme's category template to display the current category's child categories instead of the posts from that category.

The category template links to another template file (content-grid.php) which generates the dynamic post/category content.

The only way I can get it to work is by combining all the code together on the category template.

This is the original category template:

<?php
/**
 * The template for displaying category archive pages.
 *
 * @link https://codex.wordpress.org/Template_Hierarchy
 *
 * @package Codilight_Lite
 */

get_header(); ?>
    <div id="content" class="site-content container <?php echo codilight_lite_sidebar_position(); ?>">
        <div class="content-inside">
            <div id="primary" class="content-area">
                <main id="main" class="site-main" role="main">

                <?php
                if ( have_posts() ) : $count = 0; ?>

                    <header class="page-header">
                        <?php
                            the_archive_title( '<h1 class="page-title">', '</h1>' );
                            the_archive_description( '<div class="taxonomy-description">', '</div>' );
                        ?>
                    </header><!-- .page-header -->

                    <?php
                    $layout_archive_posts = get_theme_mod( 'layout_archive_posts', 'grid' );
                    if ( $layout_archive_posts == 'grid' ) {
                        echo '<div class="block1 block1_grid">';
                        echo '<div class="row">';
                            while ( have_posts() ) : the_post();
                            $count++;
                                get_template_part( 'template-parts/content-grid' );
                            if ( $count % 2 == 0 ) {
                                echo '</div>';
                                echo '<div class="row">';
                            }
                            endwhile;
                        echo '</div>';
                        echo '</div>';
                        codilight_lite_custom_paginate();

                    } else {
                        echo '<div class="block1 block1_list">';
                            while ( have_posts() ) : the_post();
                            get_template_part( 'template-parts/content-list' );
                            endwhile;
                        codilight_lite_custom_paginate();
                        echo '</div>';
                    }
                    ?>

                <?php else : ?>

                    <?php get_template_part( 'template-parts/content', 'none' ); ?>

                <?php endif; ?>

                </main><!-- #main -->
            </div><!-- #primary -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

...and this is the content-grid.php template file:

<?php
/**
 * Template part for displaying posts with grid style.
 *
 * @link https://codex.wordpress.org/Template_Hierarchy
 *
 * @package Codilight_Lite
 */

?>

<article id="post-<?php the_ID(); ?>" <?php post_class( 'col-md-6 col-sm-12' ); ?>>
    <div class="entry-thumb">
        <a href="<?php echo esc_url( get_permalink() ); ?>" title="<?php the_title(); ?>">
            <?php
            if ( has_post_thumbnail( ) ) {
                the_post_thumbnail( 'codilight_lite_block_2_medium' );
            } else {
                echo '<img alt="'. esc_html( get_the_title() ) .'" src="'. esc_url( get_template_directory_uri() . '/assets/images/blank325_170.png' ) .'">';
            }
            ?>
        </a>
        <?php
        $category = get_the_category();
        if($category[0]){
            echo '<a class="entry-category" href="'.get_category_link($category[0]->term_id ).'">'.$category[0]->cat_name.'</a>';
        }
        ?>
    </div>
    <div class="entry-detail">
        <header class="entry-header">
            <?php the_title( sprintf( '<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h2>' ); ?>
            <?php if ( 'post' === get_post_type() ) codilight_lite_meta_1();?>
        </header><!-- .entry-header -->

        <div class="entry-excerpt">
            <?php echo codilight_lite_excerpt(120); ?>
        </div><!-- .entry-content -->
    </div>
</article><!-- #post-## -->

...and now for the customized category template file:

<?php
/**
 * Category Template: Custom
 */

get_header(); ?>
    <div id="content" class="site-content container <?php echo codilight_lite_sidebar_position(); ?>">
        <div class="content-inside">
            <div id="primary" class="content-area">
                <main id="main" class="site-main" role="main">
<?php 
        $cat = get_category( get_query_var( 'cat' ) );
        $cat_id = $cat->cat_ID;
        $child_categories=get_categories(
        array( 
        'parent' => $cat_id,
        // Uncomment the below line if you want empty category to appear on the list. 
        // 'hide_empty'   => 0
    )
); 
        if (!empty($child_categories)) : $count = 0; ?>

                    <header class="page-header">
                        <?php
                            the_archive_title( '<h1 class="page-title">', '</h1>' );
                            the_archive_description( '<div class="taxonomy-description">', '</div>' );
                        ?>
                    </header><!-- .page-header -->

                    <?php
                        echo '<div class="block1 block1_grid">';
                        echo '<div class="row">';

                    foreach ( $child_categories as $child ){ $count++;
                    get_template_part( 'template-parts/content-grid' );

                    if ( $count % 2 == 0 ) {
                                echo '</div>';
                                echo '<div class="row">';
                    }
                    }
                        echo '</div>';
                        echo '</div>';
                    ?>

                <?php else : ?>

                    <?php get_template_part( 'template-parts/content', 'none' ); ?>

                <?php endif; ?>

                </main><!-- #main -->
            </div><!-- #primary -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

...and the customized content-grid.php template file:

<?php
/**
 * Template part for displaying posts with grid style.
 *
 * @link https://codex.wordpress.org/Template_Hierarchy
 *
 * @package Codilight_Lite
 */

?>

<article id="" class="col-md-6 col-sm-12">

    <div class="entry-thumb">

        <a href="<?php echo get_category_link( $child->cat_ID ); ?>" title="<?php echo $child ->cat_name;?>">

    <?php $image_url = z_taxonomy_image_url($child->term_id); ?>

        <?php if (!empty($image_url)) : ?>
            <img alt="" src="<?php if (function_exists('z_taxonomy_image_url')) echo z_taxonomy_image_url($child->term_id);?>" />

        <?php else: ?>
            <img alt="" src="<?php echo esc_url( get_template_directory_uri() . '/assets/images/blank325_170.png' ) ?>" />

    <?php endif; ?>

        </a>

    </div>

    <div class="entry-detail">

        <header class="entry-header">

            <h2 class="entry-title"><a href="<?php echo get_category_link( $child->cat_ID ); ?> " rel="bookmark"><?php echo $child ->cat_name;?></a>
            </h2>

        </header><!-- .entry-header -->

        <div class="entry-excerpt">

            <?php echo $child ->description;?>

        </div><!-- .entry-content -->

    </div>

</article><!-- #post-## -->

...and lastly this is how I put all the code together in the category template file which works:

<?php
/**
 * Category Template: Custom
 */

get_header(); ?>
    <div id="content" class="site-content container <?php echo codilight_lite_sidebar_position(); ?>">
        <div class="content-inside">
            <div id="primary" class="content-area">
                <main id="main" class="site-main" role="main">
<?php 
        $cat = get_category( get_query_var( 'cat' ) );
        $cat_id = $cat->cat_ID;
        $child_categories=get_categories(
        array( 
        'parent' => $cat_id,
        // Uncomment the below line if you want empty category to appear on the list. 
        // 'hide_empty'   => 0
    )
); 
        if (!empty($child_categories)) : $count = 0; ?>

                    <header class="page-header">
                        <?php
                            the_archive_title( '<h1 class="page-title">', '</h1>' );
                            the_archive_description( '<div class="taxonomy-description">', '</div>' );
                        ?>
                    </header><!-- .page-header -->

                    <?php
                        echo '<div class="block1 block1_grid">';
                        echo '<div class="row">';
                    foreach ( $child_categories as $child ) : $count++; ?>
                                <article id="" class="col-md-6 col-sm-12">

    <div class="entry-thumb">
        <a href="<?php echo get_category_link( $child->cat_ID ); ?>" title="<?php echo $child ->cat_name;?>">

    <?php $image_url = z_taxonomy_image_url($child->term_id); ?>
<?php if (!empty($image_url)) : ?>
    <img alt="" src="<?php if (function_exists('z_taxonomy_image_url')) echo z_taxonomy_image_url($child->term_id);?>" />

<?php else: ?>
    <img alt="" src="<?php echo esc_url( get_template_directory_uri() . '/assets/images/blank325_170.png' ) ?>" />

    <?php endif; ?>

        </a>
    </div>

    <div class="entry-detail">
        <header class="entry-header">
            <h2 class="entry-title"><a href="<?php echo get_category_link( $child->cat_ID ); ?> " rel="bookmark"><?php echo $child ->cat_name;?></a></h2>
        </header><!-- .entry-header -->

        <div class="entry-excerpt">
            <?php echo $child ->description;?>
        </div><!-- .entry-content -->
    </div>
</article><!-- #post-## -->

<?php ?>

                <?php   if ( $count % 2 == 0 ) {
                                echo '</div>';
                                echo '<div class="row">';
                    }
                    endforeach;
                        echo '</div>';
                        echo '</div>';
                    ?>

                <?php else : ?>

                    <?php get_template_part( 'template-parts/content', 'none' ); ?>

                <?php endif; ?>

                </main><!-- #main -->
            </div><!-- #primary -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>
3
  • Why do you need to count the loop ?
    – CodeMascot
    Aug 23, 2016 at 11:01
  • The "row" div is closed after every second loop and a new div opened.
    – jrcollins
    Aug 23, 2016 at 11:06
  • Then give the full page code here. It'll be helpful.
    – CodeMascot
    Aug 23, 2016 at 11:08

1 Answer 1

1

As far I've known get_template_part() function does not work with foreach loop. So we need to use locate_template() function to this case. This is your customized category template code. Put it there -

<?php
/**
 * Category Template: Custom
 */

get_header(); ?>
    <div id="content" class="site-content container <?php echo codilight_lite_sidebar_position(); ?>">
        <div class="content-inside">
            <div id="primary" class="content-area">
                <main id="main" class="site-main" role="main">
        <?php 
        $cat = get_category( get_query_var( 'cat' ) );
        $cat_id = $cat->cat_ID;
        $child_categories=get_categories(
        array( 
            'parent' => $cat_id,
            // Uncomment the below line if you want empty category to appear on the list. 
            // 'hide_empty'   => 0
            )
        ); 
        if (!empty($child_categories)) : $count = 0; ?>

                    <header class="page-header">
                        <?php
                            the_archive_title( '<h1 class="page-title">', '</h1>' );
                            the_archive_description( '<div class="taxonomy-description">', '</div>' );
                        ?>
                    </header><!-- .page-header -->

                    <div class="block1 block1_grid">
                    <?php
                    foreach(array_chunk($child_categories, 2) as $item) {
                        echo '<div class="row">';
                        foreach ($item as $child) {
                            // get_template_part( 'template-parts/content-grid' );
                            include( locate_template( 'template-parts/content-grid.php' ) );
                        }
                        echo '</div>';
                    }
                    ?>
                    </div>

                <?php else : ?>

                    <?php get_template_part( 'template-parts/content', 'none' ); ?>

                <?php endif; ?>

                </main><!-- #main -->
            </div><!-- #primary -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>
9
  • Hope every thing will work perfectly now. :) @jrcollins
    – CodeMascot
    Aug 23, 2016 at 11:23
  • Are you sure that's correct? I'm getting some errors.
    – jrcollins
    Aug 23, 2016 at 11:31
  • There was a little problem. I missed some php tags. Hope now it will be working.
    – CodeMascot
    Aug 23, 2016 at 11:35
  • That's strange, I'm still having the same problem.
    – jrcollins
    Aug 23, 2016 at 11:44
  • What message are you getting ? Can you take an screenshot ? @jrcollins
    – CodeMascot
    Aug 23, 2016 at 11:46

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.