Daniel

<h3>DEMOS</h3>
<iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/qcnTrKoHGA4?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe>
You can find more demos <a href="https://demos.danielvoelk.de/divi-filter/" rel="nofollow ugc">here</a>.
<h3>FEATURES</h3>
<ul>
<li>
Filter unlimited columns
</li>
<li>
Add multiple filter categories to each column (if desired)
</li>
<li>
Filter blog posts
</li>
<li>
[PREMIUM] Filter unlimited rows
</li>
<li>
[PREMIUM] Style active filter button
</li>
<li>
[PREMIUM] Start filtered, right after page loads.
</li>
<li>
[PREMIUM] Add animations to your filtering
</li>
<li>
[PREMIUM] Have multiple filters on one page
</li>
<li>
[PREMIUM] Multi select filtering (explained in <a href="https://docs.danielvoelk.de" rel="nofollow ugc">Documentation</a>)
</li>
<li>
[PREMIUM] And more (see in (<a href="https://docs.danielvoelk.de" rel="nofollow ugc">Documentation</a>)
</li>
</ul>
<a href="https://shop.danielvoelk.de/#divi-filter" rel="nofollow ugc">Get the premium version</a>
<h3>SETUP</h3>
Buttons:
<ul>
<li>Click on the grey gear icon to access the Button Settings (on the button, that you want to filter with).</li>
<li>Go to Advanced -> CSS ID & Classes -> CSS Class. Here you add the df-button class.</li>
<li>Additionally add any category that you want to filter with that button like that: dfc-[your category] e.g. dfc-cats. </li>
<li>Important: Buttons have to be in a seperate section, than your filterable elements.</li>
</ul>
Section:
<ul>
<li>Click on blue gear icon to access the Section Settings.</li>
<li>Go to Advanced -> CSS ID & Classes -> CSS Class. Here you add the df-area class.</li>
</ul>
Columns:
<ul>
<li>Click on green gear icon to access the Row Settings.</li>
<li>In the Row Settings click on the gear icon the access the Column Settings.</li>
<li>Go to Advanced -> CSS ID & Classes -> CSS Class.</li>
<li>Here you add all the dfc-[your category] class you want e.g. your dfc-cats class.</li>
<li>Do that for all Columns you want to make filterable.</li>
</ul>
<a href="https://docs.danielvoelk.de" rel="nofollow ugc">A more detailed documentation</a>
<a href="https://danielvoelk.de/en/divi-filter" rel="nofollow ugc">Official Product Page</a>

Filter for Divi

The Divi Filter plugin allows you to filter every module in the Divi Theme. Just add a few classes and you're done.

<h3>FEATURES</h3>
<ul>
<li>
Filter columns
</li>
<li>
Filter sections
</li>
<li>
Filter elements
</li>
<li>
Add multiple filter categories to each column (if desired)
</li>
<li>
[PREMIUM] Style active filter button
</li>
<li>
[PREMIUM] Filter inner columns
</li>
<li>
[PREMIUM] Filter inner sections
</li>
<li>
[PREMIUM] Filter flexbox containers (Beta)
</li>
<li>
[PREMIUM] Start filtered, right after page loads.
</li>
<li>
[PREMIUM] Add animations to your filtering
</li>
<li>
[PREMIUM] Multi select filtering (explained in <a href="https://elemdocs.danielvoelk.de/" rel="nofollow ugc">Documentation</a>)
</li>
<li>
[PREMIUM] And more (see in (<a href="https://elemdocs.danielvoelk.de/" rel="nofollow ugc">FAQ</a>)
</li>
</ul>
<a href="https://shop.danielvoelk.de/product/elementor-filter-lifetime/" rel="nofollow ugc">Get the premium version</a>
<h3>SETUP</h3>
Buttons:
<ul>
<li>Click on the pencil icon to access the Button Settings. You can also use images, or any other element to trigger the filtering. It doesn’t have to be a button module.</li>
<li>Go to Advanced → CSS Class. Here you add the ef-button class.</li>
<li>Additionally add any category that you want to filter with that button like that: efc-[your category] e.g. efc-cats.</li>
</ul>
Section:
<ul>
<li>Click on blue gear icon to access the Section Settings.</li>
<li>Go to Advanced → CSS Class. Here you add the ef-area class.</li>
</ul>
Columns:
<ul>
<li>Click on edit column icon to access the column settings.</li>
<li>Go to Advanced → CSS Class.</li>
<li>Here you add all the efc-[your category] class you want e.g. your efc-cats class.</li>
<li>Do that for all Columns you want to make filterable.</li>
</ul>
<a href="https://elemdocs.danielvoelk.de/" rel="nofollow ugc">A more detailed documentation</a>

Filter for Elementor

The Elementor Filter plugin allows you to filter every module in Elementor. Just add a few classes and you're done.

Filter for Divi vs Filter for Elementor