Discussion :

[dge_dge]

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 html :

Sélectionner tout - Visualiser dans une fenêtre à part

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 JavaScript :

Sélectionner tout - Visualiser dans une fenêtre à part

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 html :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

<?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é

[mathieu]

dans la balise "a" vous pouvez ajouter un attribut data comme cela par exemple :

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
<a href="" class="boutonfiltre" data-slug="<?php echo htmlspecialchars($d->slug);?>">
    <?php echo htmlspecialchars($d->name);?>
</a>

et vous pouvez ensuite lire cet attribut comme cela :

Code JavaScript :

Sélectionner tout - Visualiser dans une fenêtre à part

var valeurFiltre = $(this).data("slug");

https://api.jquery.com/data/

[dge_dge]

Salut Mathieu.

Merci pour le coup de main.
La solution fonctionne, le menu affiche bien les textes sous la bonne forme,
mais le bouton pour tout afficher lui ne fonctionne plus.
Sans doute pas grand chose mais je patauge.

[dge_dge]

Petit up.
Le bouton tout afficher ne fonctionne plus