Tri des articles selon leurs catégories sur front office
Bonjour la communauté.
J'utilise un système de tri pour mes articles selon leurs catégories sur mon site wordpress.
Pour cela je liste mes catégories dans un "menu"
Code:
1
2
3
4
5
6
7
| <ul id="filtre">
<li class="filtre-actif"><a class="boutonfiltre" href="#">Tous</a></li>
<?php $types = get_terms("types");
foreach ($types as $d) { ?>
<li><a href="#" class="boutonfiltre"><?php echo $d->name; ?></a></li>
<?php } ?>
</ul> |
Une fonction dans mon fichier js masque les articles ne faisant pas partie de la catégorie que je choisi dans le menu.
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
| $('#filtre li a').click(function() {
$('#filtre li').removeClass('filtre-actif');
$(this).parent().addClass('filtre-actif');
var valeurFiltre = $(this).text().toLowerCase();
$('.cinq').hide();
if (valeurFiltre == 'tous') {
$('.cinq').show('fast');
}
else {
$('.cinq').each(function() {
if(!$(this).hasClass(valeurFiltre)) {
$(this).hide('fast');
} else {
$(this).show('fast');
}
});
}
return false;
}); |
Et pour que le filtre sache quoi masquer, je rajoute par php le nom de ma catégorie à la "class" de mon contenant.
Code:
1
2
3
4
5
6
| <?php $terms = get_the_terms( $post->id, 'types');
$terms_name = array();
foreach ($terms as $term) {$terms_name[] = $term->name;} ?>
<div class="cinq <?php echo $term->name; ?>">
</div> |
Cela fonctionne bien à partir du moment ou l'article est classé dans une catégorie utilisant un seul mot .
Par exemple si mes articles sont classé dans des catégories du style : Viandes, Poissons, ...
Tout va bien. Si je clique sur Viandes cela m'affichera tous mes articles classés dans Viandes.
Malheureusement, j'ai aussi des noms de catégories qui utilisent plusieurs mots. Par exemple : Jus de fruits
La, mon filtre ne reconnais pas la catégorie et n'affiche rien. (sans doute à cause des espaces entre les mots)
Cela fonctionne si, à la place de "name" je met "slug" dans le menu et dans la class de mes articles.
Code:
<?php echo $term->slug; ?>
Mais du coup mon menu n'affiche pas Jus de fruit mais jus-de-fruit. Normal c'est la forme du slug.
En soit ce n'est pas très gênant mais je préférerais quand même afficher Jus de fruit
Comment puis je faire cela ?
Merci pour votre aide.
++ Dgé
