JPKCom DB
Auf GitHub ansehen

JPKCom Post Filter — Anleitung & Tipps

Facettierte Taxonomie-Filter für Beiträge, Seiten und Custom Post Types mit JPKCom Post Filter — SEO-freundliche URLs, AJAX, Shortcodes, Blocks und Page-Builder-Support.

JPKCom Post Filter ergänzt jede WordPress-Archivseite um facettierte Taxonomie-Filter — für Beiträge, Seiten und beliebige Custom Post Types. Jeder Filterzustand steckt in einer SEO-freundlichen URL wie /blog/filter/web-design+marketing/wordpress/, ist also teilbar und bookmarkbar; gefiltert wird per AJAX, mit vollwertigem Fallback ohne JavaScript.

Anleitung

Voraussetzungen

  • WordPress 6.9 oder neuer (getestet bis 7.0)
  • PHP 8.3 oder neuer
  • Keine Abhängigkeiten: kein ACF, kein Bootstrap, kein jQuery nötig

Page-Builder-Unterstützung ist optional — die Gutenberg-Blocks, Elementor-Widgets und Oxygen-Elemente werden nur geladen, wenn der jeweilige Builder aktiv ist.

Installation

  1. Lade das Verzeichnis jpkcom-post-filter nach /wp-content/plugins/ hoch (oder installiere die ZIP via Plugins → Installieren → Plugin hochladen).
  2. Aktiviere das Plugin unter Plugins → Installierte Plugins.
  3. Wähle unter Post Filter → General die Post-Types, die gefiltert werden sollen.
  4. Lege unter Post Filter → Filter Groups die Taxonomien als Filter-Dimensionen an.
  5. Öffne Einstellungen → Permalinks und klicke auf Änderungen speichern, um die Rewrite-Regeln neu zu schreiben.

Filter-Gruppen konfigurieren

Jede Filter-Gruppe ordnet eine Taxonomie einer URL-Position zu; die Reihenfolge der Gruppen bestimmt die Reihenfolge der URL-Segmente. Pro Gruppe legst du Taxonomie, Label, betroffene Post-Types, numerische Sortierung (Order) und einen Ein/Aus-Schalter (Enabled) fest.

Du kannst direkt aus der Filter-Groups-Seite neue Taxonomien registrieren (Option „Register as new WordPress taxonomy"): Slug, Rewrite-Slug, hierarchisch/flach, öffentlich, Admin-Spalte und REST-API-Sichtbarkeit (für Gutenberg nötig) sind einstellbar.

Achtung: Löschst du eine Filter-Gruppe, die eine eigene Taxonomie registriert hat, wird diese Taxonomie deregistriert — alle Term-Zuweisungen an Beiträge gehen dabei unwiderruflich verloren.

Ausgabe: Auto-Inject, Shortcodes, Blocks

Es gibt drei Wege, Filter und Liste auszugeben:

  • Auto-Inject (General → Auto-Inject Filter): Das Plugin umschließt die Archiv-Schleife des Themes automatisch mit der Filter-UI — ohne Shortcode oder Template-Eingriff. Es hängt sich dafür an loop_start/loop_end auf Archiv-/Blog-Seiten (nicht auf Einzelbeiträgen, Suche oder Seiten).
  • Shortcodes: [jpkcom_postfilter_filter], [jpkcom_postfilter_list] und [jpkcom_postfilter_pagination]. Der interaktive Shortcode-Builder unter Post Filter → Shortcodes erzeugt fertige Snippets.
  • Builder: je drei Gutenberg-Blocks, Elementor-Widgets und Oxygen-Elemente (Post Filter, Post List, Post Pagination).
[jpkcom_postfilter_filter post_type="portfolio" layout="dropdown"]
[jpkcom_postfilter_list post_type="portfolio" layout="cards" limit="12"]
[jpkcom_postfilter_pagination post_type="portfolio"]

Wichtig: Shortcodes (und Blocks/Widgets/Elemente) hängen immer am Archiv des konfigurierten Post-Types. Sie funktionieren nur auf einer Archiv-Template-Seite oder auf der unter Einstellungen → Lesen als „Beitragsseite" gesetzten Seite. Auf einer beliebigen Seite (z. B. /test/) springen Filter-Klicks und AJAX zur Archiv-URL zurück — nutze dort lieber Auto-Inject.

Layout & Design

Unter Post Filter → Layout & Design stehen sechs Tabs bereit (Global, Filter, Posts, Pagination, Color Schemes, Advanced). Du wählst aus vier Filter-Layouts (Bar, Columns, Sidebar, Dropdown), drei Listen-Layouts (Cards, Rows, Minimal) und vier Farbschemata (Default, Dark, Contrast, Monochrome). Im Tab Advanced legst du u. a. den Stylesheet-Modus (Full / Variables only / Disabled), den Plus/Minus-Modus, die Sichtbarkeit des Reset-Buttons sowie eigenes Custom CSS fest.

Tipps & Tricks

  • URL-Endpunkt ändern: Standardmäßig steckt der Filter unter /filter/. Den Pfad-Bestandteil änderst du unter General → URL Endpoint und klickst danach auf Flush Rewrite Rules (oder speicherst die Permalinks neu).
  • Verhalten ohne Filter-Terme: Über Bare Endpoint Behaviour stellst du ein, was bei Aufruf von /filter/ ohne Terme passiert — 404, Redirect zur Blog-Startseite oder eine eigene URL.
  • Mehrere Filter-Instanzen pro Seite: Jeder Satz aus Filter/Liste/Pagination wird über das post_type-Attribut gepaart (data-jpkpf-post-type). So lassen sich verschiedene Post-Types auf einer Seite unabhängig filtern.
  • Vier Cache-Schichten: Object-Cache, Transients, APCu und ein PHP-Datei-Cache für Einstellungen halten die Ausgabe schnell. Caches werden bei save_post/deleted_post bzw. Term-Änderungen automatisch invalidiert; manuell leerst du sie unter Post Filter → Cache.
  • CSS sauber überschreiben: Alle Styles nutzen CSS-Custom-Properties mit Präfix --jpkpf-. Setze sie im Theme-Stylesheet, in den Variablen-Feldern unter Layout & Design oder über das Custom-CSS-Feld. Für volle Kontrolle den Stylesheet-Modus auf „Disabled" stellen.
  • Templates pro Theme überschreiben: Der Loader prüft Child-Theme → Parent-Theme → mu-plugins/jpkcom-post-filter-overrides/templates/ → Plugin-templates/. Kopiere z. B. templates/partials/list/list-cards.php nach themes/dein-theme/jpkcom-post-filter/partials/list/list-cards.php.
  • Einstellungen migrieren: Unter Post Filter → Import / Export exportierst du alle Einstellungen (general, layout, cache, filter_groups) als JSON und spielst sie auf einer anderen Umgebung wieder ein.
  • Konstanten in wp-config.php: u. a. JPKCOM_POSTFILTER_URL_ENDPOINT, JPKCOM_POSTFILTER_CACHE_ENABLED, JPKCOM_POSTFILTER_DEBUG und JPKCOM_POSTFILTER_MAX_FILTER_COMBOS lassen sich überschreiben.
  • Gutenberg-Blocks aus Quellcode bauen: Die Block-Editor-Skripte brauchen einen Build (npm install && npm run build, Ausgabe nach blocks/build/). Fehlt das Build-Verzeichnis, überspringt das Plugin die Block-Registrierung.
  • Barrierefrei & SEO-tauglich: Filter-Terme sind echte <a>-Links (Reload ohne JS), die Ergebnis-Zone nutzt aria-live, Toggle-Buttons aria-pressed. Jede Filter-Kombination hat eine crawlbare URL mit gesetztem Canonical gegen Duplicate Content.

Weiterführende Informationen