Wordpress выборка постов по рубрикам

Столкнулся с проблемой, которую не могу решить. Надо сделать фильтрацию постов по категориям не используя ajax. Подскажите, пожалуйста как это можно реализовать. Что бы вы точно поняли о чём, то вот скрин как выглядит страницы с выборкой:

Вот код php:

<div class="portfolio__container">

    <p class="portfolio__title">Портфолио</p>

    <div class="sort">
      <a href="<?php echo home_url( '/sample-page/portfolio/' ) ?>" class="sort__item">Все</a>
      <a href="<?php echo home_url( '/taxonomy/landing/' ) ?>" class="sort__item">Landing</a>
      <a href="<?php echo home_url( '/taxonomy/corporate/' ) ?>" class="sort__item">Корпоративный</a>
      <a href="<?php echo home_url( '/taxonomy/catalog/' ) ?>" class="sort__item">Каталог</a>
      <a href="<?php echo home_url( '/taxonomy/store/' ) ?>" class="sort__item">Магазин</a>
      <a href="<?php echo home_url( '/taxonomy/unique/' ) ?>" class="sort__item">Уникальный</a>
      <a href="<?php echo home_url( '/taxonomy/tender-works/' ) ?>" class="sort__item">Тендерные работы</a>
      <a href="<?php echo home_url( '/taxonomy/old-works/' ) ?>" class="sort__item">Old works</a>
    </div>

    <div class="portfolio__works">

  <?php

  $args = array( 
    'numberposts'       => 500,
    'post_type'         => 'portfolio',
    'suppress_filters'  => true,
  );

  $posts = get_posts( $args );

  foreach($posts as $post){ 
    setup_postdata($post);
  ?>
  <div class="portfolio__work">
        <div class="portfolio__work-hover">
    <a href="<?php permalink_link() ?>" class="portfolio__work-link">
          <p class="portfolio__work-title"><?php the_title() ?></p>
    <div class="portfolio__work-description"><?php the_excerpt() ?></div>
    <hr class="portfolio__line">
          <div class="portfolio__work-tags">
      <?php 
        the_terms( get_the_ID(), 'taxonomy', '', '', '' ); 
      ?>
    </div>
    <a href="<?php permalink_link() ?>" class="icon-arrow-right-short portfolio__work-arrow"></a>
    </a>
        </div>
    <div class="portfolio__work-img">
      <?php the_post_thumbnail(); ?>
    </div>
      </div>

  <?php
  }

wp_reset_postdata();
 ?>



    </div>

</div>

css:

.portfolio__container {
    max-width: 80%;
    margin: 0 auto
}

.portfolio__title {
    text-align: center;
    padding-top: 6%;
    font-size: 40px;
    font-weight: 700;
    margin-bottom: 7%;
}

.sort {
    margin-bottom: 8%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.sort__item {

    line-height: 3;
    text-align: center;
    margin-left: 1%;
    font-size: 15px;
    cursor: pointer;
    background: transparent;
    border: #fddb00 solid 1px;
    width: 165px;
    height: 50px;
    margin-bottom: 2%
}

.portfolio__works {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: 150px;
}

.portfolio__work {
    overflow: hidden;
    width: 32.833333%;
    height:auto;
    position: relative;
    margin-left: 0.5%;
    margin-top: 0.5%;
    -webkit-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out
} 

.portfolio__work-title {
    position: absolute;
    bottom: 150px;
    left:20px;
    font-size: 22px;
    font-weight: 600
}

.portfolio__work-description p {
    position: absolute;
    bottom: 90px;
    left:20px;
    font-size: 13px;
}

.portfolio__work-tags {
    position: absolute;
    bottom: 30px;
    left:20px;
    font-size: 15px;
    font-style: italic
}

.portfolio__line {
    position: absolute;
    bottom: 50px;
    left:20px;
    background-color: #000;
    height: 1px;
    width: 25%;
    padding: 0;
    margin: 0;
    margin-bottom: 10px;
}

.portfolio__work-hover {
    width: 100%;
    height: 99%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    background-color: #fddb00;
    opacity: 0;
    color: #000;
    -webkit-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out
}

.portfolio__work:hover .portfolio__work-hover {
    opacity: 0.95
}

.portfolio__work-arrow {
    position: absolute;
    bottom: 27px;
    right:20px;
    font-size: 20px;
    color: #000;
}

.portfolio__work-link {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 3;
    background-color:transparent;
    font-size: 0;
}