jQuery UI Autocomplete für WordPress

Einer meiner Kunden wollte für die Suche in den Dokumentationen (Custom Post Type) eine Autocomplete-Lösung. Ich habe vorher nie mit jQuery UI Autocomplete gearbeitet und musste mich erst ein wenig einlesen. Dabei ist mir aufgefallen das jQuery UI Autocomplete am einfachsten mit dem Dateiformat JSON funktioniert. Hier findest du meine WordPress Lösung dazu.

Die einfachste und schnellste Möglichkeit die WordPress Beiträge in ein JSON-Format zu packen ist es ein Page-Template zu erstellen, um dort eigene Header und Queries definieren zu können.

WordPress Template erstellen

Ein Beispiel Template könnte so aussehen:

Weisen wir das Template jetzt einer angelegten WordPress Seite im wp-admin zu, werden die Beiträge im JSON ausgegeben. Zumindest der benötigte Titel und der Permalink.

Durch die Zuweisung an eine WordPress Seite haben wir auch direkt einen Link, den wir dann in unseren AJAX-Request für’s Autocomplete verwenden können.

Autocomplete Script

Wie das aussehen könnte, zeigt das Beispiel hier:

Vergiss nicht jQuery UI oder jQuery UI Autocomplete einzubinden, da es sonst nicht funktioniert.

Hat dir der Beitrag gefallen?
Ja!
Nein!

Kevin Pliester

Kevin ist PHP- und WordPress-Entwickler. Gelegentlich teilt er auch Tipps zum Thema Selbstständigkeit. Er ist Hamsterpapa und seit 2015 glücklich verheiratet. Er lebt in Dormagen und arbeitet die meiste Zeit von Zuhause aus. Hat vorher irgendwas mit Computern und Servern gemacht.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.