Plugin Elementor: How to use Super Cat Post Filter also for products?

Elementor Super Cat makes it easy to implement a nice filter function for posts. It becomes problematic with WooCommerce products. Products can also be integrated via the blog widget, but some functions are usually missing here.

A workaround here is a little jQuery. You create a separate container for each filter type and give it a fixed ID or class. Apart from the “Show all” container, hide the other containers via CSS and include the following code:

<script>
jQuery(document).ready(function() {
jQuery(".cat-filter-for-produkte li:nth-child(1)").click(function(){
  jQuery("#produkte-filter1").hide();
  jQuery("#produkte-filter2").hide();
  jQuery("#produkte-alle").show();
});

jQuery(".cat-filter-for-produkte li:nth-child(2)").click(function(){
  jQuery("#produkte-filter1").show();
  jQuery("#produkte-filter2").hide();
  jQuery("#produkte-alle").hide();
});

jQuery(".cat-filter-for-produkte li:nth-child(3)").click(function(){
  jQuery("#produkte-filter1").hide();
  jQuery("#produkte-filter2").show();
  jQuery("#produkte-alle").hide();
});
});
</script>