Add Custom Taxonomy Terms as CSS Classes for CPT Posts in an Elementor Loop Item Template


  • I have an Elementor Loop Item Template that is used to display posts from a custom post type called "Project Photos."

  • I want the ability to filter the results based on the following 4 different taxonomies:

    1. application
    2. fence-type
    3. fence-style
    4. privacy-level
  • the filter (css/jquery from JCwebTECH on YouTube) would be in the form of buttons that select the divs that have the css class associated with the custom taxonomy terms.

  • the Elementor div that needs targeting I believe is:
    <div class="elementor-element elementor-element-ee4ea21 e-con-boxed e-con" data-id="ee4ea21" data-element_type="container">

  • Is there a way to add a function or filter to my function.php file that could grab all the taxonomy term slugs (no spaces) that a post has associated with it, and insert them into the div mentioned above as css classes? Here is an example page:

OR – If you have other suggestions on how to best filter custom post types by multiple custom taxonomy terms, within an Elementor page, Id love to hear it. 🙂

Thanks! 🙂

Trish 1 month 2023-02-18T18:35:50-05:00 0 Answers 0 views 0

Leave an answer