How to Use ACF with WP Query for Advanced Filtering

Advanced Custom Fields (ACF) is one of the most powerful tools for adding custom data to WordPress. When combined with WP_Query, you can create advanced filtering systems to display dynamic content based on custom field values. In this guide, we’ll explore how to use ACF with WP_Query for advanced filtering in WordPress.

Step 1: Install and Set Up ACF

If you haven’t already, install and activate the ACF plugin. Once installed:

Go to Custom Fields in the WordPress admin menu.
Click Add New to create a field group.
Add your desired custom fields (e.g., text, number, dropdown, etc.).
Assign the field group to specific post types or pages where you want these fields to appear.

For example, let’s create a field group with a dropdown field called "Property Type" for a real estate website.

Step 2: Add Custom Fields to Your Posts

After setting up your fields, navigate to the posts or custom post types where the fields are assigned. Populate these fields with relevant data for filtering.

Example: Add "Apartment," "Villa," or "Studio" under the "Property Type" field for different posts.

Step 3: Write a Custom WP_Query with ACF Filters

To filter posts based on ACF fields, you’ll use the `meta_query` parameter in WP_Query. Here’s an example code snippet:

<!--php
// Custom WP_Query with ACF filter
$args = [
    'post_type' =--> 'property', // Replace with your post type
    'meta_query' => [
        [
            'key' => 'property_type', // ACF field key
            'value' => 'Apartment',   // Value to match
            'compare' => '=',        // Comparison operator
        ],
    ],
    'posts_per_page' => 10, // Limit the number of results
];
 
$query = new WP_Query($args);
 
if ($query->have_posts()) {
    while ($query->have_posts()) {
        $query->the_post();
        // Output your post content here
        echo '<h2>' . get_the_title() . '</h2>';
    }
    wp_reset_postdata();
} else {
    echo 'No results found.';
}
?>

In this example, we’re querying posts from the "property" post type where the "Property Type" field is set to "Apartment."

Step 4: Allow Dynamic Filtering with a Form

To let users dynamically filter results, you can create a front-end form. Here’s an example:

<form method="GET" action="">
    <label for="property_type">Property Type:</label>
    <select name="property_type" id="property_type">
        <option value="">Select a type</option>
        <option value="Apartment">Apartment</option>
        <option value="Villa">Villa</option>
        <option value="Studio">Studio</option>
    </select>
    <button type="submit">Filter</button>
</form>
 
<!--php
// Retrieve the selected value
$selected_type = isset($_GET['property_type']) ? sanitize_text_field($_GET['property_type']) : '';
 
$args = [
    'post_type' =--> 'property',
    'meta_query' => $selected_type ? [
        [
            'key' => 'property_type',
            'value' => $selected_type,
            'compare' => '=',
        ],
    ] : [],
    'posts_per_page' => 10,
];
 
$query = new WP_Query($args);
 
if ($query->have_posts()) {
    while ($query->have_posts()) {
        $query->the_post();
        echo '<h2>' . get_the_title() . '</h2>';
    }
    wp_reset_postdata();
} else {
    echo 'No results found.';
}
?>

This form allows users to select a property type, and the query dynamically adjusts based on their selection.

Step 5: Optimize the Query for Performance

For large datasets, consider the following optimizations:

Index your database: Ensure that custom fields are indexed in the database to speed up meta queries.
Use Transients: Cache query results using WordPress transients for frequently accessed data.
Pagination: Add pagination to handle large numbers of results efficiently.

Example pagination code:

$big = 999999999; // Need an unlikely integer
 
echo paginate_links([
    'base' => str_replace($big, '%#%', esc_url(get_pagenum_link($big))),
    'format' => '?paged=%#%',
    'current' => max(1, get_query_var('paged')),
    'total' => $query->max_num_pages,
]);

Conclusion

By combining ACF with WP_Query, you can build robust and flexible filtering systems tailored to your project’s needs. Whether you’re creating a real estate website, an e-commerce store, or a blog, these techniques will help you deliver dynamic and personalized content to your users.

See Coding | Learn More | Let's Improve our Coding Knowledge

Pages