In this project we are going to create an Ajax filter from WordPress Custom Post Type, that displays images with fancy hover effects. You can filter posts without refreshing the page. I didn't use either a page builder or a plugin to create this feature.
Step #1 - Create a Custom Post Type for Cities
In this example I'm going to create a Custom Post Type named City, but it could be anything You want. Please care about the taxonomy's slug in this case "city_cat". You need to change it to Your custom slug.
Add this snippet to functions.php
your-child-theme/functions.php
Step #2 - Create some Taxonomies for City Custom Post Type
Step #3 - Add some posts in City
You can download the XML file from the demo to import.
Step #4 - Enqueue scripts in functions.php
Step #5 - Build the filter
Create a file named filter.php
your-child-theme/ajax/filter.php
Find and replace the taxonomy and post type:
#6 'taxonomy' => 'YOUR_TAXONOMY' #28 'post_type' => 'YOUR_POST_TYPE',
