web-dev-qa-db-fra.com

Tri des articles via des valeurs de taxonomie personnalisées à l'aide de cases à cocher?

Je travaille sur un projet comportant un menu déroulant de valeurs de taxonomie personnalisées appelées "Disciplines". Il n'y en a que 4 dans le menu déroulant. Selon sa conception, vous pouvez sélectionner plusieurs disciplines sur lesquelles filtrer. L'idée est de cocher la case et les filtres seront filtrés via la valeur spécifiée dans la valeur de la case.

Ma question est: quelle est la meilleure façon de s'y prendre? Il n'est pas nécessaire que ce soit AJAX, en fait, je serais heureux que l'utilisateur vérifie les valeurs souhaitées et s'il ne vérifie rien dans l'espace de 2 secondes environ, la page rechargée et les valeurs qu'il souhaite pour trier par ne montre que les messages correspondant à ces critères.

Le problème auquel je suis confronté ici est où est-ce que je stocke ces valeurs et comment recharger la page pour qu'elle connaisse ces valeurs? Je suppose que la solution utilisera très probablement celle de query_var, mais je ne sais pas s'il existe d'autres moyens, tels que l'utilisation de règles de réécriture personnalisées et les balises de réécriture.

Ceci est le code actuel que j'utilise pour afficher la liste déroulante:

          <ul class="parent-sort-container">
            <li>
                <?php
                $disciplines = get_terms('discipline', array('hide_empty' => 0));
                ?>
                <a href="#">All Disciplines</a>
                <?php if ($disciplines): ?>
                <ul class="filter-sub-dropdown">
                    <?php foreach($disciplines AS $discipline): ?>
                    <li><a href="javascript:void(0);"><input type="checkbox" name="discipline[]" value="<?php echo $discipline->slug; ?>"><?php echo $discipline->name; ?></a></li>
                    <?php endforeach; ?>
                </ul>
                <?php endif; ?>
            </li>

La sortie HTML générée ressemble à ceci:

<ul class="parent-sort-container">
                    <li>
                                                <a href="#">All Disciplines</a>
                                                <ul class="filter-sub-dropdown">
                                                        <li><a href="javascript:void(0);"><input type="checkbox" name="discipline[]" value="better-living">Better Living</a></li>
                                                        <li><a href="javascript:void(0);"><input type="checkbox" name="discipline[]" value="communication">Communication</a></li>
                                                        <li><a href="javascript:void(0);"><input type="checkbox" name="discipline[]" value="design-thinking">Design Thinking</a></li>
                                                        <li><a href="javascript:void(0);"><input type="checkbox" name="discipline[]" value="fashion">Fashion</a></li>
                                                        <li><a href="javascript:void(0);"><input type="checkbox" name="discipline[]" value="public-places">Public Places</a></li>
                                                    </ul>
                                            </li>
                  </ul>
2

Enveloppez le tout dans un formulaire et ajoutez un bouton de soumission:

<form method="POST" action="">
   <ul class="filter-sub-dropdown">
   ...

</form>

Utilisez les identifiants de terme comme valeurs de case à cocher au lieu de slugs (vous économiserez un peu de ressources du serveur):

$discipline->slug;> $discipline->term_id

Ensuite, dans votre fichier functions.php, vérifiez si ce formulaire a été soumis et modifiez la requête de WP pour n'inclure que les publications ayant au moins l'un de ces termes:

add_action('pre_get_posts', function($query){

  // only do this if we have user input and if this is the main query 
  if(isset($_POST['discipline']) && $query->is_main_query()){

    // sanitize 
    $disciplines = array_map('intval', $_POST['discipline']); 

    // prepare a taxonomy query
    $my_tax_query = array(
      'taxonomy' => 'discipline',
      'field'    => 'id',
      'terms'    => $disciplines,
      'operator' => 'IN',
    );

    // include it in the main query
    $query->set('tax_query', array($my_tax_query)); 
  }

});

Ajouter le support AJAX est très facile. Ajoutez simplement une fonction sur l’événement submit ( ) (utilisez preventDefault() pour empêcher sa soumission) (ou à l’événement d’entrée changer si vous ne voulez pas le bouton d'envoi), sérialiser saisissez les valeurs dans une variable, faites une $.ajax POST demande où vous transmettez cette variable et obtenez le contenu de la DIV avec les messages de la réponse. Et remplacer le contenu existant avec elle ...

4
onetrickpony