JTL-Plugin: Ajax Live Suche - Software von PAW pa-world GmbH

Schnelle Suche, bessere Treffer – und Platz für Kampagnen

Die PAW Ajax Live Suche ersetzt die klassische Suche im JTL-Shop durch ein modernes Live-Erlebnis: Treffer erscheinen sofort, Nutzer finden schneller, und du kannst wichtige Themen direkt in der Suche platzieren – inklusive keywordbasierter Marketing-Banner.

Ideal für: Shops mit vielen Artikeln, aktiven Kampagnen oder hohem Suchanteil.

Was das Plugin im Shop verbessert

Live-Vorschläge ohne Reload – Ergebnisse sofort während des Tippens.
Mehr Relevanz durch klare Steuerung der Ausgabe (z. B. Treffer je Typ).
Sauberes Suchgefühl durch Debounce (weniger Requests, ruhigeres UX).
Zeichen-Normalisierung – Artikelnummern & Sonderzeichen werden robuster gefunden.

Marketing-Banner, die bei Keywords erscheinen

Keyword-Trigger: Banner erscheint genau dann, wenn danach gesucht wird (z. B. „a4″, „toner“, „akku“).
Mehr Sichtbarkeit für Aktionen, Marken oder Kategorien – direkt im Moment hoher Kaufabsicht.
Sortierung und Position steuerbar (z. B. oben in den Vorschlägen).
Link + Bild möglich – Kampagnen führen direkt zur passenden Landingpage.

Flexibel einsetzbar

Inhalte: Artikel, Kategorien, eigene Seiten und Blog (je nach Bedarf).
Theme-kompatibel über CSS-Selector für das Suchfeld.
Keyword-Tester im Backend – Matches prüfen, ohne echte Requests auszulösen.
Konfigurierbar statt „One size fits all“ – passt sich deinem Shop an.

Typische Einsatzfälle

Aktionen pushen: „Sale“, „Neuheiten“, „Bestseller“ direkt über Suchbegriffe ausspielen.
Marken steuern: Banner bei Marken-Keywords („shure“, „sennheiser“…).
Kategorien finden: Nutzer tippen grob – Vorschläge führen sie sauber zur passenden Kategorie.
Artikelnummern: gemischte Schreibweisen (mit/ohne „-„, „/“) trotzdem zuverlässig.

    Kurz gesagt
    Die Suche ist einer der wichtigsten Touchpoints im Shop. Mit Live-Ergebnissen und keywordbasierten Bannern
    holst du Nutzer schneller zum Produkt – und platzierst Kampagnen dort, wo sie am meisten bringen.
  

PAW Ajax Live Suche – Dokumentation

Live-Suche (AJAX) für JTL-Shop mit Vorschlägen für Artikel, Kategorien, Seiten und Blog. Optional: Marketing-Banner, die per Keyword ausgelöst werden.

Einrichtung Grundkonfiguration Suchfeld-Selector Inhalte Marketing-Banner Keyword-Tester Tipps FAQ

Überblick

Die komplette Konfiguration findet in der Plugin-Einstellungsseite statt. Dort legen Sie fest, ab wann gesucht wird (Min. Zeichen), wie „schnell“ reagiert wird (Debounce), welche Inhalte durchsucht werden und ob Marketing-Banner erscheinen sollen.

Empfehlung zum Start Aktivieren Sie zuerst nur Artikel und Kategorien. Seiten/Blog können Sie später dazu nehmen.

Screenshot: Einstellungsseite (Grundkonfiguration + Marketing-Banner)

Einrichtung (Step-by-Step)

Plugin aktivieren

Öffnen Sie die Plugin-Einstellungsseite und setzen Sie im Block Grundkonfiguration den Haken bei „Plugin aktivieren“.

Basiswerte setzen

Stellen Sie Min. Zeichen und Debounce (ms) ein. Typische Startwerte: Min. Zeichen: 2, Debounce: 180–250 ms.

Suchfeld-Selector prüfen

Der Suchfeld-Selector muss auf das Suchfeld Ihres Themes passen. Wenn im Frontend nichts passiert, ist das meistens der Punkt.

Inhalte auswählen

Unter „Inhalte durchsuchen“ wählen Sie, was in den Vorschlägen erscheinen soll: Artikel, Kategorien, Eigene Seiten, Blog.

Einstellungen speichern und testen

Speichern Sie über „Einstellungen speichern“ und testen Sie die Suche im Frontend. Falls Sie keine Änderungen sehen: Cache leeren und einmal Strg+F5.

Hinweis Wenn Assets gebündelt/cached werden, sind Änderungen nicht immer sofort sichtbar. Hard-Reload (Strg+F5) hilft fast immer.

Grundkonfiguration

Kurze Erklärung der wichtigsten Felder.

Einstellung	Was passiert damit	Praxis-Hinweis
Min. Zeichen	Unterhalb dieser Länge werden keine Anfragen ausgeführt.	2 ist ein guter Standard; bei sehr großen Shops ggf. 3.
Max. Treffer je Typ	Begrenzt die Anzahl Vorschläge je Kategorie (Artikel/Kategorien/…)	6–10 je Typ, passend zum Dropdown-Layout.
Debounce (ms)	Wartezeit nach Tastendruck, bevor gesucht wird.	Mehr Debounce = weniger Requests, ruhigeres Verhalten.
Zu ignorierende Zeichen	Zeichen, die bei der Normalisierung entfernt/ignoriert werden.	Praktisch bei Artikelnummern wie `ABC-123` vs. `ABC123`.
Plugin aktivieren	Schaltet die Live-Suche im Frontend an/aus.	Zum Testen kann man hier schnell deaktivieren.

Suchfeld-Selector (CSS)

Das Plugin bindet sich an ein bestimmtes Suchfeld im Frontend. Dafür wird ein CSS-Selector genutzt. Wenn Sie mehrere Suchfelder haben (z. B. Desktop + Mobile), können Sie mehrere Selektoren kommasepariert angeben.

Beispiel (häufig passend)

input[name="qs"], input[type="search"]

So finden Sie den richtigen Selector

Frontend öffnen → Suchfeld rechtsklicken → „Untersuchen“ (DevTools)
Das passende <input> markieren
Einen stabilen Selector wählen (z. B. #search, .search input, input[name="qs"])

Inhalte durchsuchen

Aktivieren Sie im Bereich „Inhalte durchsuchen“, welche Inhalte in den Live-Vorschlägen auftauchen sollen: Artikel, Kategorien, Eigene Seiten, Blog.

Start-Setup Artikel + Kategorien aktivieren, danach im Frontend testen. Wenn das passt, Seiten/Blog ergänzen.

Marketing-Banner (keywordbasiert)

Banner können direkt in den Suchvorschlägen angezeigt werden. Die Ausspielung passiert über Keywords: Sobald der Suchbegriff ein Keyword enthält (nach Normalisierung), kann das Banner erscheinen.

Bannerfunktion aktivieren

In der Grundkonfiguration: „Banner in Vorschlägen anzeigen (Keyword-basiert)“ aktivieren. Danach die Banner-Position wählen (z. B. „Oben“).

Neues Banner anlegen

Im Bereich Marketing-Banner auf „Neues Banner“ klicken.

Banner aktiv setzen
Sortierung: kleine Zahl = weiter oben
Titel (interne Bezeichnung)
Keywords (Komma oder neue Zeile, z. B. a4, papier)
Text (optional)
Bild-URL (optional)
Link-URL (z. B. /sale/ oder vollständige URL)

Speichern und prüfen

Mit „Banner speichern“ sichern. Danach im Frontend testen: Suchbegriff eingeben, der ein Keyword enthält, und prüfen, ob das Banner wie gewünscht erscheint.

Keyword-Tipp Lieber wenige, klare Keywords verwenden. Zu allgemeine Begriffe („kabel“, „licht“) können Banner zu oft triggern.

Bildvorschau Wenn die Vorschau nicht lädt: URL prüfen (HTTPS), Domain erreichbar, kein Mixed-Content (http/https) verwenden.

Keyword-Tester (ohne Requests)

Der Keyword-Tester hilft beim Fein-Tuning. Sie können Suchbegriffe eingeben und sehen, wie die Normalisierung greift und ob Banner-Keywords matchen – ohne dass echte Suchrequests ausgelöst werden.

Wofür das nützlich ist Artikelnummern mit Sonderzeichen, Bindestriche/Slashes und Tippfehler lassen sich schnell prüfen, bevor Sie Keywords final festlegen.

Tipps aus der Praxis

Debounce erhöhen, wenn der Shop bei vielen Nutzern stark belastet wird.
Treffer je Typ begrenzen, damit das Dropdown übersichtlich bleibt.
Selector doppelt prüfen, wenn Desktop/Mobile unterschiedliche Suchfelder haben.
Nach Änderungen: Cache leeren + Strg+F5 im Frontend.

FAQ / Troubleshooting

Die Live-Suche erscheint nicht – was zuerst prüfen?

1) Plugin aktiv? 2) Min. Zeichen erreicht? 3) Suchfeld-Selector korrekt? 4) Cache/Hard-Reload (Strg+F5). 5) Gibt es ein zweites Suchfeld (Mobile/Header)? Dann mehrere Selektoren angeben.

Banner erscheinen nicht, obwohl Keywords gesetzt sind

Prüfen: Banner aktiv, Keywords richtig getrennt (Komma oder neue Zeile), Link/URL korrekt. Nutzen Sie den Keyword-Tester, um Normalisierung und Matches zu kontrollieren.

Die Suche wirkt träge oder macht zu viele Requests

Debounce erhöhen (z. B. 250–350 ms), Treffer je Typ reduzieren und nicht alle Inhaltstypen gleichzeitig aktivieren.

Support Wenn Sie möchten, schauen wir uns Ihr Setup an (Theme/Selector/Banner-Logik) und helfen beim sauberen Rollout.

Kontakt aufnehmen