Показать/скрыть контент в nav-tabs bootstrap

Использую плагин для Wordpress ACF plugin.

Создала и отобразила nav-tabs так:

<?php
        $args = new WP_Query( array(
            'post_type' => 'employee',
            'post_status'=>'publish',
            'posts_per_page' => -1,
            'meta_key'=>'employee_category',
            'orderby'=> array(
                'meta_value'=>'DESC',
                'post_date'=>'DESC'
            ),
        ));
        ?>

        <ul class="nav nav-tabs d-flex justify-content-center flex-wrap team-navs">
            <?php $counter = 0;
            while ( $args->have_posts() ) : $args->the_post();
                $counter++;
                $value = get_field( "employee_category" );
                ?>
                <li class="nav-item post-<?php the_ID(); ?> <?php ($counter == 1) ? 'active' : ''?>">
                    <a class="nav-link" role="tab" href="#<?php echo str_replace(' ', '', $value); ?>" aria-controls="<?php echo $value;  ?>" role="tab" data-toggle="tab"><?php echo $value; ?></a>
                </li>
            <?php endwhile; wp_reset_query(); ?>
        </ul>
        <div class="tab-content">
            <?php
            global $wp_query;
            $post = $wp_query->post;
            $category = get_field( 'employee_category', $post->ID );
            $counter = 0;
            $args = array(
                'post_type' => 'employee',
                'post_status'=>'publish',
                'posts_per_page'=>-1,
                'meta_key'=>'employee_category',
                'orderby'=> array(
                    'meta_value'=>'DESC',
                    'post_date'=>'DESC',
                ),
            );
            $the_query = new WP_Query( $args );
            $counter++;

            ?>
            <div id="<?php echo $category; //NULL ?>" class="tab-pane fade <?=($counter == 1) ? 'active' : '' ?> show">
                <div class="row">
                    <?php if ( have_posts() ) : ?>
                    <?php $e=0; ?>
                    <?php while ( $the_query->have_posts() ) : ?>
                        <?php $the_query->the_post(); ?>

                        <div class="col-md-3 col-sm-6 wrap_team_item">
                            <?php
                            $thumbnail_id = get_post_thumbnail_id();
                            $thumbnail_url = wp_get_attachment_image_src( $thumbnail_id, 'thumbnail-size', true );
                            ?>
                            <a href="#galleryTeam" data-slide-to="<?php echo $e; ?>">
                                <div class="item team-item" data-toggle="modal" data-target="#teamModal">
                                    <div class="team-item_photo">
                                        <img class="img-fluid" src="<?php echo $thumbnail_url[0]; ?>" alt="<?php the_title(); ?>" />
                                    </div>
                                    <div class="team-item_name"><?php the_title(); ?></div>
                                </div>
                            </a>
                        </div>

                        <?php $e++;?>
                    <?php endwhile; wp_reset_query(); ?>
                </div>
            </div>
        <?php endif; ?>
        </div>

В nav-tabs отображаются все заголовки категорий и они дублируются (н/р Designers Designers Designers, Developers Developers и т.д.). В tab-content отображаются все имеющиеся посты сразу.

Как отображать только один заголовок категории (без дублирования) и сделать скрытие/показ контента в tab-content в соответствии с выбранной категорией? Я не php-developer, но возможно тут нужен цикл

PS: переменная $e используется для открытия модальных окон.