it-swarm.com.de

Sortieren von Beiträgen über benutzerdefinierte Taxonomiewerte mithilfe von Kontrollkästchen?

Ich arbeite an einem Projekt mit einem Dropdown-Menü mit benutzerdefinierten Taxonomiewerten namens "Disziplinen". Es gibt nur vier davon im Dropdown-Menü. Es wurde so konzipiert, dass Sie mehr als eine Disziplin zum Filtern auswählen können. Die Idee ist, dass Sie das Kontrollkästchen aktivieren und die Beiträge anhand des im Kontrollkästchen angegebenen Werts filtern.

Meine Frage ist: Wie gehe ich am besten vor? Es muss nicht AJAX sein, in der Tat würde ich mich freuen, wenn der Benutzer seine gewünschten Werte überprüft und wenn er innerhalb von etwa 2 Sekunden nichts überprüft, wird die Seite neu geladen und die gewünschten Werte werden angezeigt Zum Sortieren nach wurden nur die Beiträge angezeigt, die diesen Kriterien entsprechen.

Das Problem, dem ich hier gegenüberstehe, ist, wo ich diese Werte speichere und wie ich die Seite neu lade, damit sie über diese Werte Bescheid weiß. Ich gehe davon aus, dass die Lösung höchstwahrscheinlich query_var verwendet, bin mir aber nicht sicher, ob es andere Möglichkeiten gibt, wie benutzerdefinierte Umschreiberegeln und Umschreibetags.

Dies ist der aktuelle Code, den ich verwende, um das Dropdown anzuzeigen:

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

Die generierte HTML-Ausgabe sieht folgendermaßen aus:

<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

Binden Sie das Ganze in ein Formular ein und fügen Sie eine Senden-Schaltfläche hinzu:

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

</form>

Verwenden Sie Term-IDs als Checkbox-Werte anstelle von Slugs (Sie sparen ein wenig Serverressourcen):

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

Überprüfen Sie dann in Ihrer functions.php-Datei, ob dieses Formular gesendet wurde, und ändern Sie die Abfrage von WP so, dass nur Posts mit mindestens einem dieser Begriffe enthalten sind:

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)); 
  }

});

Das Hinzufügen von AJAX -Unterstützung ist sehr einfach. Binden Sie einfach eine Funktion in das form submit event ein (verwenden Sie preventDefault() , um deren Übermittlung zu verhindern) (oder in das Eingabe change event, wenn Sie die Submit-Schaltfläche nicht möchten), serialize Werte in eine Variable eingeben, eine $.ajax POST -Anforderung ausführen, bei der Sie diese Variable übergeben und den Inhalt des DIV mit den Beiträgen aus der Antwort abrufen. Und bestehende Inhalte damit ersetzen ...

4
onetrickpony