我有一个自定义模块，它将一个特定类别的6个帖子显示为2列的特色图像。我喜欢每列顶部的第一篇文章显示一个大图像，如下图所示：

我已经为第一列和第二列编写了必要的CSS代码，但不知道如何正确使用$计数器变量才能正确显示此模块。

<?php

$td_query = new WP_Query( $td_args );

$counter = 1;

if ( $td_query->have_posts() ) {

    while ( $td_query->have_posts() ) {

        $td_query->the_post();

        if ( $counter == 1 ) {

            $output .= \'<div class="left-col">\'; // first column
            $output .= \'<div class="big-image">\';
            $output .= the_post_thumbnail( \'big\' ); // 1 big image
            $output .= \'</div>\';

        } elseif ( $counter == 2 ) {

            $output .= \'<div class="small-images">\';    
            $output .= the_post_thumbnail( \'small\' ); // 2 small images
            $output .= \'</div>\';

            $output .= \'</div>\';

        } elseif ( $counter == 4 ) { 

            $output .= \'<div class="right-col">\'; // right column
            $output .= \'<div class="big-image">\'
            $output .= the_post_thumbnail( \'big\' ); // 1 big image
            $output .= \'</div>\';

        } else {

            $output .= \'<div class="small-images">\';    
            $output .= the_post_thumbnail( \'small\' ); // 2 small images
            $output .= \'</div>\';

            $output .= \'</div>\';

        }
        $counter++;
    }
}
wp_reset_query();

return $buffer;