アーカイブページのデザインはそのままでターム毎に表示記事を変更したい

Question

カスタム投稿でアーカイブページを作成し投稿記事が表示される所まではできたのですが
記事毎に追加したタームの一覧ページの作り方が分からず困っています

以下作成したアーカイブページのphpの一部です

  <section class="page-product">
    <div class="page-product_inner">

      <h3 class="c-page_linetitle">全て</h3>
      <div class="page-product_flex">

        <!--1-->
        <!--<div class="page-product_flex_box">
                <a href="wism_details.html">
                    <h4 class="page-product_flex_box_title">製品名が入ります</h4>
                    <figure class="page-product_flex_box_image" style="background-image: url(<?php echo get_template_directory_uri() ?>/image/common/kari.png)">
                        <span class="new">NEW</span></figure>
                    <p class="page-product_flex_box_text">
                        テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
                    <p class="page-product_flex_box_button">VIEW MORE</p>
                </a>
            </div>-->

        <!--2-->
        <!--<div class="page-product_flex_box">
                <a href="wism_details.html">
                    <h4 class="page-product_flex_box_title">製品名が入ります</h4>
                    <figure class="page-product_flex_box_image" style="background-image: url(<?php echo get_template_directory_uri() ?>/image/common/kari.png)">
                        <span class="new">NEW</span></figure>
                    <p class="page-product_flex_box_text">
                        テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
                    <p class="page-product_flex_box_button">VIEW MORE</p>
                </a>
            </div>-->

        <!--3-->
        <!--<div class="page-product_flex_box">
                <a href="wism_details.html">
                    <h4 class="page-product_flex_box_title">製品名が入ります</h4>
                    <figure class="page-product_flex_box_image" style="background-image: url(<?php echo get_template_directory_uri() ?>/image/common/kari.png)">
                        <span class="new">NEW</span></figure>
                    <p class="page-product_flex_box_text">
                        テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。</p>
                    <p class="page-product_flex_box_button">VIEW MORE</p>
                </a>
            </div>-->

        <?php 
        $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;// 現在のページを変数に設定
        $args = array(
        'post_type' => 'wism', // 投稿タイプを指定
        'posts_per_page' =>15, // 表示するページ数
        'paged' => $paged, // 表示するページ数
        );
        $query = new WP_Query($args);
        // WordPressループの前にWP_Query()を利用して、カスタム投稿タイプ「wism」の投稿を取得
        while ( $query->have_posts() ) : $query->the_post(); ?>

        <div class="page-product_flex_box">
          <a href="<?php the_permalink(); ?>">
            <h4 class="page-product_flex_box_title"><?php the_title(); ?></h4>
            <figure class="page-product_flex_box_image"
              style="background-image: url(<?php echo get_template_directory_uri() ?>/image/common/kari.png)">
            </figure>
            <p class="page-product_flex_box_text">
              <?php the_excerpt(); ?></p>
            <p class="page-product_flex_box_button">VIEW MORE</p>
          </a>
        </div>

        <?php endwhile; ?>

      

      </div>

      <!--ページネーション-->
      <?php if (function_exists("the_pagination")) the_pagination(); ?>

    </div>
  </section>
  <!--end product-->

理想は以下の画像の青いボタンをクリックしたらそれぞれのジャンルの製品名だけのアーカイブページが表示されるようにしたいです
長くなりましたがどなたかわかる方よろしくおねがいします

カテゴリーのボタンのコード

  <section class="page-category">
    <div class="page-category_inner">
      <h3 class="c-page_subtitle">製品カテゴリー</h3>
      <div class="page-category_flex">
        <a href="/wism" class="page-category_flex_button">全て</a>
        <a href="/wism/surgery/" class="page-category_flex_button">手術・中材</a>
        <a href="/wism/control/" class="page-category_flex_button">感染対策</a>
        <a href="/wism/medical-examination/" class="page-category_flex_button">診察・処置</a>
        <a href="/wism/inspection/" class="page-category_flex_button">検査</a>
        <a href="/wism/nurse/" class="page-category_flex_button">看護・介護</a>
        <a href="/wism/other/" class="page-category_flex_button">その他</a>
      </div>
    </div>
  </section>
  <!--end category-->

urlの所は書いてみたのですおそらく間違っているのかなと思います