Filter Posts via ACF Field

[co50]

I’ve read almost every thread I could find on this topic and they all seem geared towards a specific user’s situation with no general guide available.

I have a Field Group with a field called item-cat. I have a looper on a page with the Provider set as:

post_type=cardfronts&meta_key=item-cat&meta_value={{dc:url:param key=“item-cat” fallback=“sports”}}&posts_per_page=-1&orderby={{dc:url:param key=“orderby” fallback=“title”}}&order={{dc:url:param key=“order” fallback=“asc”}}

I configured a button to display only posts with item-cat set as ‘religious’ and to do so I set the button URL to ?item-cat=religious

It doesn’t work. What am I doing wrong here. I’ve spent 2 hours trying to figure this out.

[Ismael]

Hi @co50,

Thank you for the inquiry.

You may need to use the meta_query parameter for the ACF field.

Example:

post_type=cardfronts&meta_query[0][key]=item-cat&meta_query[0][value]={{dc:url:param key="item-cat" fallback="sports"}}&posts_per_page=-1&orderby={{dc:url:param key="orderby" fallback="title"}}&order={{dc:url:param key="order" fallback="asc"}}

Based on: https://developer.wordpress.org/reference/classes/wp_query/?utm_source=chatgpt.com#custom-field-post-meta-parameters

If it’s still not working, please provide the login details in the secure note.

Best regards,
Ismael

[co50]

OK - this worked, but how do I show all items by default? When the page loads, nothing shows unless a filter button is clicked now.

[Ismael]

Thank you for the update.

Have you tried replacing the fallback “sports” with a value that all posts share, like “all”? Each post must have an item-cat that follows this pattern: “all sports”, “all religion”, etc. We will also have to include the “compare” key to the meta_query and set it to “IN”.

post_type=cardfronts&meta_query[0][key]=item-cat&meta_query[0][value]={{dc:url:param key="item-cat" fallback="sports"}}&meta_query[0][compare]=IN&posts_per_page=-1&orderby={{dc:url:param key="orderby" fallback="title"}}&order={{dc:url:param key="order" fallback="asc"}}

Let us know if you need more info.

[co50]

I’m not sure I follow what you’re saying here with “Each post must have an item-cat that follows this pattern: “all sports”, “all religion”, etc.”

We simply want to show all (non-filtered) items when a) the page first loads, b) if the ‘Show All’ button is clicked.

I’ve already tried a fallback of “all” and “” but they don’t work (alongside your suggested looper query).

[Ismael]

We may need to inspect the site to test this. Please provide the login details in the secure note.

Best regards.

[co50]

Sure. Done. Thank you for your help.

[Ismael]

Did you change the login URL? The default login and admin URL redirects to 404 page. Please include the custom login URL in the secure note.

[co50]

Apologies, admin is /backend/

[Ismael]

Thank you for the update.

Instead of using the query string, we used a custom looper provider with this query function:

add_filter('cs_looper_custom_meta_query', function ($result, $args) {
  $item_cat_value = isset($_GET['item-cat']) ? $_GET['item-cat'] : '';

  $query_args = array(
      'post_type'      => 'cardfronts',
      'posts_per_page' => -1,
      'orderby'        => isset($_GET['orderby']) ? $_GET['orderby'] : 'title',
      'order'          => isset($_GET['order']) ? $_GET['order'] : 'asc',
  );

  if ($item_cat_value) {
      $query_args['meta_query'] = array(
          array(
              'key'     => 'item-cat',
              'value'   => $item_cat_value,
              'compare' => 'IN',
          )
      );
  }

  $posts = get_posts($query_args);

  return $posts;
}, 10, 2);

We duplicated the “Items” element, applied the custom looper to it, and temporarily hid the original “Items” element using a condition.

Please make sure to purge the cache before checking.

We also recommend installing a child theme: https://theme.co/docs/child-themes

Warm regards.

[co50]

Wow, I didn’t realize this would require so much code. I figured this was a common use case and so the built-in looper functions would support most of it out of the box. Thanks for the help. Where is this custom looper function located?

[marc_a]

Hey @co50,

Please check your child’s theme functions.php, the code should be there.

Hope that helps.

[co50]

I don’t have a child theme but I found it in the regular theme functions file. I’ve moved it to Code Snippets.

What parameters in the custom looper do I need to change for other pages that would have the same functionality but using a different post type?

[ruenel]

Hello @co50,

We highly recommend that you rename your function from cs_looper_custom_meta_query to cs_looper_custom_yourpostype_meta_query . For exmaple;

add_filter('cs_looper_custom_cardfront_meta_query', function ($result, $args) {
 $item_cat_value = isset($_GET['item-cat']) ? $_GET['item-cat'] : '';

 $query_args = array(
     'post_type'      => 'cardfronts',
     'posts_per_page' => -1,
     'orderby'        => isset($_GET['orderby']) ? $_GET['orderby'] : 'title',
     'order'          => isset($_GET['order']) ? $_GET['order'] : 'asc',
 );

 if ($item_cat_value) {
     $query_args['meta_query'] = array(
         array(
             'key'     => 'item-cat',
             'value'   => $item_cat_value,
             'compare' => 'IN',
         )
     );
 }

 $posts = get_posts($query_args);

 return $posts;
}, 10, 2);

The above code will work with the card front custom post type. If you have another post type, you duplicate the code and modify the function name and the post type in the code like:

add_filter('cs_looper_custom_mycustomposttype_meta_query', function ($result, $args) {
  $item_cat_value = isset($_GET['item-cat']) ? $_GET['item-cat'] : '';

  $query_args = array(
      'post_type'      => 'mycustomposttype',
      'posts_per_page' => -1,
      'orderby'        => isset($_GET['orderby']) ? $_GET['orderby'] : 'title',
      'order'          => isset($_GET['order']) ? $_GET['order'] : 'asc',
  );

  if ($item_cat_value) {
      $query_args['meta_query'] = array(
          array(
              'key'     => 'item-cat',
              'value'   => $item_cat_value,
              'compare' => 'IN',
          )
      );
  }

  $posts = get_posts($query_args);

  return $posts;
}, 10, 2);

Hope this helps.

[co50]

Does the Hook name for the looper provider change with the different post types or does it remain at “meta_query” and ONLY the filter name (and post type) changes in the code? I’m asking because your instructions do not work when the hook remains meta_query and and filter name + post_type are changed as instructed above.

[marc_a]

Hey @co50,

• The hook name ( meta_query ) stays the same in the query arguments.
• The filter name must change to match the post type.
• You also need to update the post type in the query argument ( 'post_type' => 'mycustomposttype' ).

Hope that helps.

[co50]

Yes, that is just a repeat of the instructions provided in the prior message. It doesn’t work.

[Ismael]

Does the Hook name for the looper provider change with the different post types or does it remain at “meta_query” and ONLY the filter name (and post type) changes in the code?

The hook name should be adjusted based on the function name. For example, cs_looper_custom_cardfronts_meta_query should have a hook name of cardfronts_meta_query . We tried logging in to the site, but the account above no longer has admin rights, so we’re not able to check the builder.

Let us know if you need more info.