Getting started

Custom Posts & Categories

Add the custom post LOOP

<?php
$casestudy = new Wp_Query(['post_type'=>'casestudy']);

  if ($casestudy->have_posts()) :
 
  // The Loop
  while ( $casestudy->have_posts()) :
  $casestudy->the_post()
		;?>
<?php endwhile; endif; ?>

 Add the isotope custom categories FILTER for a menu

<div class="button-group filter-button-group">
  <button data-filter="*">All</button>
  <?php $terms = get_terms( array(
       'taxonomy' => 'casestudy_categories',
       'hide_empty' => true,
        ));
        foreach ($terms as $term) {
            echo '<button id="category-filter" data-filter="' . '.' .$term-    >slug.'">'.$term->name.'</button>';
        }
        ?>
   </div>

Or add the simpler version for menu – add your categories in manually:

<div class="button-group filter-button-group">
  <button data-filter="*"> all</button>
  <button data-filter=".website">website</button>
  <button data-filter=".video">video</button>
  <button data-filter=".animation">animation</button>
</div>

Get custom category for each card 

<?php 
  $categories = get_the_category(get_the_id());
  foreach ($categories as $category) {
  echo $category->slug.'';
}?> 

Extra handy snippet – Get custom categories from a post

<?php the_terms($post->ID, 'casestudy_categories'); ?>

or get all terms of a category 

<?php 
  $taxonomy = 'casestudy_categories';

  $terms = get_terms($taxonomy); // Get all terms of a taxonomy
  if ( $terms && !is_wp_error( $terms ) ) :
   ?>
<?php endif; ?>

Isotope custom Posts with custom categories loop – no filter

<div class="wrap wrap--posts">
<div class="container">
<div class="row">
  <div class="cards grid" data-aos="fade-up" data-aos-duration='800'>
 
    <?php
      // Grid Parameters
      $counter = 1; // Start the counter
      $grids = 2; // Grids per row
      $titlelength = 80; // Post title length 
      $ourCurrentPage = get_query_var('paged');

      // The Query
      $args=array (
        'post_type' => 'casestudy',
        'posts_per_page' => 6,
        'paged' => $ourCurrentPage,
         );
       $the_query = new WP_Query($args);
      // The Loop
         while ( $the_query->have_posts() ) :
         $the_query->the_post();
         // Show all columns except the right hand side column
         if($counter != $grids) :
         ?>
  
  <a class="grid-item" href="<?php the_permalink(); ?>">
  <div class="card-2">      
  <!-- background image version -->
  <div class="post-image">
  <div class="thumbnail-wrap" style="background-image:url(<?php the_post_thumbnail_url( 'medium' ); ?>); background-size:cover;">
   </div>
   </div>
                          
   <div class="card-inner">                       
     <h4 class="card-title">
       <?php if (mb_strlen($post->post_title) > $titlelength)
       { echo mb_substr(the_title($before = '', $after = '', FALSE), 0, $titlelength) . ' .. '; }
        else { the_title(); } ?></h4> 
   <div class="cat-flag"><?php the_category( ' ' ); ?></div>              
   <div class="card-footer">
   </div>
                                           
  </div>
 </div><!-- .card -->
</a><!-- .grid-item -->
     <?php
      $counter = 0;
      endif;
      $counter++;
      endwhile;
      wp_reset_postdata();
     ?>
   <div class="wrap--pagination">                       
    <div class="box pagination">
     <?php echo paginate_links(array(
      'format'=> '?paged=%#%',
      'total' => $the_query->max_num_pages,
      'prev_next' => TRUE,
      'prev_text' => __('<'),
      'next_text' => __('>')
     )); ?>
    </div>                         
   </div>
  </div><!-- .cards -->
</div><!-- .row -->
</div><!-- .container -->
</div><!-- .wrap-->