How to fix: custom categories navigation shows duplicate items - php

Question

I have a category menu that filters the posts shown in the page. My problem is that instead of having an item per category in the menu, I see duplicates of the same Item. It seems like I have as much duplicates as the number of the posts under that category.
Link to the page where the navigation is: http://www.confesercenti.pistoia.it/connessioni/
You can see it under "Filtra le aziende per settore economico". For example, you will notice "COMUNICAZIONE" is repeated five times.
This is the code:
<div id="filters" class="settore_dropdown_wrapper button-group">
<p>Filtra le aziende per settore economico</p>
<ul id="port-list" class="port-filter">
<li><a class="active" data-filter="*">Tutti</a></li>
<?php
$main_convenzione = new WP_Query(array(
'post_type' => 'azienda',
'meta_key' => 'convenzioni_attive',
'meta_value' => 1
));
if ($main_convenzione->have_posts()) : while($main_convenzione->have_posts()) : $main_convenzione->the_post();
// while($main->have_posts()) : $main->the_post();
global $post;
$post_id = $post->ID;
// $terms_list = get_the_terms( get_the_ID(), 'settore' );
$terms_list = get_the_terms( $post_id, 'settore');
// $args = array(
// 'post_type' => 'azienda', // filter by the post type progetto
// 'taxonomy' => 'settore',
// 'hide_empty' => true
// );
// $terms = get_terms($args); // Get all terms of a taxonomy
foreach ( $terms_list as $term_single ) {
$term_name = $term_single->name;
$term_slug = $term_single->slug; ?>
<li><a data-filter=".<?php echo strtolower(preg_replace('/[^a-zA-Z]+/', '-', $term_name)); ?>">
<?php echo esc_attr($term_name); ?></a></li>
<?php }
endwhile; endif; wp_reset_postdata(); ?>
</ul><!--port-list-->
</div><!--filters-->
As stated above it seems like it shows as much duplicates as the number of the posts under that category. My goal is to have one item per category instead of having a al those duplicates

Answer 1

You need to save the filters you need instead of showing them directly. You can use in_array to check if a value is in your array. Something like would work:
<div id="filters" class="settore_dropdown_wrapper button-group">
<p>Filtra le aziende per settore economico</p>
<ul id="port-list" class="port-filter">
<li><a class="active" data-filter="*">Tutti</a></li>
<?php
$main_convenzione = new WP_Query(array(
'post_type' => 'azienda',
'meta_key' => 'convenzioni_attive',
'meta_value' => 1
));
if ($main_convenzione->have_posts()) : while($main_convenzione->have_posts()) : $main_convenzione->the_post();
global $post;
$terms_list = get_the_terms( $post->ID, 'settore');
$terms = [];
foreach ( $terms_list as $term_single ) {
if(!in_array($term_single->name, $terms)) {
$terms[] = $term_single->name;
};
};
endif;
?>
<?php foreach($terms as $term): ?>
<li><a data-filter=".<?php echo strtolower(preg_replace('/[^a-zA-Z]+/', '-', $term)); ?>"><?php echo esc_attr($term); ?></a></li>
<?php endforeach; wp_reset_postdata(); ?>
</ul><!--port-list-->
</div><!--filters-->