Or, embed this snippet using GenerateWP WordPress Plugin.

Download

Clone

ITG Resorts Isotope

// Add Shortcode
function itg_resorts_isotope_shortcode() {

	<ul id="filters">
	    <li><a href="#" data-filter="*" class="selected">Everything</a></li>
		<?php 
			$posts = get_posts("itg_region"); // Get all posts from Regions post type
			$count = count($posts); // How many are there?
			if ( $count > 0 ){  // If there are more than 0 posts
				foreach ( $posts as $post ) {  // For each post:
					echo "<li><a href='#' data-filter='.".$post->slug."'>" . $post->name . "</a></li>n";
					// Create a list item with the current post slug for sorting, and name for label
				}
			} 
		?>
	</ul>
	<?php $the_query = new WP_Query( 'posts_per_page=50' ); // Check the WP_Query docs to see how you can limit which posts to display ?>
	<?php if ( $the_query->have_posts() ) : ?>
	    <div id="isotope-list">
	    <?php while ( $the_query->have_posts() ) : $the_query->the_post(); 
		$postsArray = get_the_posts( $post->ID, "itg_region" );  // Get the posts for this particular item
		$postsString = ""; // Initialize the string that will contain the posts
			foreach ( $postsArray as $post ) { // For each post 
				$postsString .= $post->slug.' '; // Create a string that has all the slugs 
			}
		?> 
		<div class="<?php echo $postsString; ?> item"> <?php // 'item' is used as an identifier (see Setp 5, line 6) ?>
			<h3><?php the_title(); ?></h3>
		        <?php if ( has_post_thumbnail() ) { 
	                      the_post_thumbnail();
	                } ?>
		</div> <!-- end item -->
	    <?php endwhile;  ?>
	    </div> <!-- end isotope-list -->
	<?php endif; ?>

}
add_shortcode( 'resorts-isotope', 'itg_resorts_isotope_shortcode' );