Forum
16.12.2010, 19:18

Ajax Suchhilfe

OK, eigentlich wollten wir ja kein Update mehr rausbringen, aber es ist noch was fertig geworden, dass zumindest alle begeistern dürfte, die eine POWERsuche gebucht haben. Denn die folgende beschriebene Funktion ist ein kostenloses AddOn für die POWERsuche. Wir nennen es "Ajax Suchhilfe". In der Standardsuche des Shops ist diese Funktion nicht verfügbar.

Viele kennen bei Google die Automatische Vervollständigung, die seit einigen Monaten fester Bestandteil ist. Die Ajax Suchhilfe ist eine ganz ähnliche Funktion, nur dass hier im Shop passende Artikel zum Suchwort eingeblendet werden.

Die Einblendung erfolgt immer dann, wenn man schon mindestens 3 Buchstaben eingetippt hat und 1 Sekunde lang abwartet. Einem Besucher wird diese Möglichkeit recht schnell deutlich, da nicht alle so schnell beim tippen sind und die meisten auch nicht die Entertaste, sondern mit der Maus mühsam zum Suchbutton navigieren.

Wenn ein Kunde sich nicht vertippt und ein in der Artikelnummer oder im Artikelnamen oder im Artikeltext (nur dort!) enthaltenes Keywort in der Suche eintippt, dann wird unter dem Suchfeld ein Layer mit bis zu 30 möglichen Artikeln angezeigt:


(klick um diese Funktion im Demo-Shop zu testen!)


Dabei wird das gesuchte Wort markiert und der Besucher überblickt meist schnell, ob der Wunschartikel schon dabei ist. Wenn ja, kann er intuitiv drauf klicken.

Sollte er ein Suchwort eingeben, das das System genauso im Artikelnamen und Artikeltext nicht findet, dann wird auch kein Layer eingeblendet, so dass der Kunde wie gewohnt auf den Suchen Button oder die Entertaste für den Start der Suche betätigt.
Nach vielen Tests ist das System nun ausgereift und wir überreichen es Ihnen wenn man so will als ein zusätzliches Weihnachtsgeschenk.

Mit der Geschwindigkeit hatten wir zum Anfang der Entwicklung so einige Not. Durch relativ aussgekügelte Lösungen im Bereich des Datenbank-Cache konnten wir aber eine Performance erreichen, die auch bei Lasttests für den Shopbesucher optimal funktioniert.

Warum ist dieses Feature nicht in der Standardsuche enthalten?
Da diese Frage sicher kommen wird hier eine kurze Erklärung. Es ist bei dieser Funktion selbstverständlich so, dass sie enorm an der Datenbank zerrt. Wenn jemand relativ langsam ein Wort aus 8 Buchstaben eintippt, wird im Hintergrund entsprechend 5 mal nacheinander (da ja ab dem dritten Buchstaben) eine relativ speicherfressende Suche angestoßen.
Zum zweiten müssen auch die Entwicklungskosten dieser Funktion irgendwann wieder eingefahren werden. Daher ist diese Funktion bei der Standardsuche auch bei den Shops nicht kostenlos, die eine Kauflizenz oder einen eigenen Server haben.

Die Aktivierung und Konfiguration

Schritt 1: das CSS

Bitte über Layout > Schriften/CSS > ROOT dieses Stück CSS einstellen:

.ajax_achtung {font-family: Verdana, Arial; font-size: 10px; color: #CC0000; font-weight: bold; text-decoration:none;}
.ajax_normal {font-family: Verdana, Arial; font-size: 10px; color: #444444; font-weight: bold; hover color: #205DCB;}
.ajax_markierung {font-family: Verdana, Arial; font-size: 10px; color: #23BB00; font-weight: bold; text-decoration:none;}
.ajax_zeile {width:500px;background-color:#EEEEEE;border-right: 1px solid #516F14;border-left: 1px solid #000000;}
.ajax_zeile_oben {width:500px;height:1px;border-bottom: 1px solid #516F14;}
.ajax_zeile_unten {width:500px;height:1px;border-top: 1px solid #516F14;}
.ajax_tooltipp_titel {font-size: 14px; color: #333333;}
.ajax_tooltipp_text {font-size: 10px; color: #777777;}
.ajax_tooltipp_tab {background-color:#FFFFFF;margin:0px;padding:0px;}


Später noch an das eigene CI anpassen. Die CSS-Klassen sind eigentlich selbstsprechend. Bei Fragen uns einfach anrufen..

Schritt 2: das JS einsetzen

Über Sonstiges > Sonstige Einstellungen > Feld "Javascript_Head:" müssen diese 3 Zeilen eingefügt werden:

<script src="ajax/lib/prototype.js" type="text/javascript"></script>
<script src="ajax/src/scriptaculous.js" type="text/javascript"></script>
<script src="ajax/src/unittest.js" type="text/javascript"></script>


Achtung! Sollte in Ihrem Shop schon eine Zeile wie

<script language="javascript" type="text/javascript" src="x_jquery.min.js"></script>

in diesem Feld eingestellt sein, bitte die 3 neuen Zeilen "darunter" einbinden. Sonst kommt es zu Konflikten im Javascript.

Ebenso selbstverständlich drauf achten, ob nicht aus älteren Updates eines der 3 neuen Javascripte schon in Ihrem Shop geladen werden. Das könnte sonst genauso dazu führen, dass dieses Feature einfach nicht funktionieren will.

Schritt 3: Texte pflegen (evtl. je Sprache!)

Über T > Seitentexte ganz unten finden Sie (nur wenn die POWERsuche gebucht ist) 3 neue Felder:



Das erste Feld sagt aus, ab welche Anzahl Artikel der Satz aus Feld 2 angezeigt werden soll. Das Synonym #Anzahl aus Feld 2 ist auch selbstredend.
Im Feld 3 Kommt ein Text wie:

<b>Ausgabe hier unterbrochen. Das Ergebnis ist länger als 30 Vorschläge. Bitte verwenden Sie bei Bedarf genauere oder mehrere Suchbegriffe.</b>


rein. Dieser wird ganz unten in dem Layer eingeblendet, wenn das Suchergebnis mehr als 30 Artikel gefunden hat.

Schritt 4: Funktion aktivieren

Über Sonstiges > Grundeinstellungen > Abschnitt 3:



bitte jetzt noch die Funktion mit Umstellung auf "ja" aktivieren.




Hinweis: Wenn ein Shopbetreiber ein eigenes Banner für die Shopsuche entwickelt und diese Funktion nutzen möchte, muss das Suchfeld

Beispiel:
<INPUT NAME="suchstr" TYPE="text" SIZE="6">

um einen ID-parameter id="ajax_suchfeld" erweitert werden. Also dann:

Beispiel:
<INPUT id="ajax_suchfeld" NAME="suchstr" TYPE="text" SIZE="6">

Das ist Voraussetzung, damit Ajax das Feld überhaupt anpacken kann..




Wer sich nicht dran traut oder wiedermal der Zeitteufel wütet, der kann das gerne auch von uns machen lassen. Da es keine 3 Minuten dauert, ist es selbstverständlich kostenlos.
06.01.2011, 17:47

jetzt verbessert...

heute wurde diese Suchhilfe noch verbessert!

Zunächst haben wir einen Bug behoben, der nach dem eine Auswahl im Ajax-Fenster anzeigte dann nicht mehr erlaubte mit der Enter-Taste die Suche zu starten. Der Nutzer war gezwungen den OK-Button mit der Maus zu betätigen. Das ist nun behoben.

Zum zweiten wurde das Suchergebnis deutlich verbessert. Zunächst werden nur die Artikel angezeigt, deren Suchwörter im Artikelnamen oder der Artikelnummer zu finden sind. Wenn dabei 30 Treffer nicht erreicht wurden, dann geht das System weiter und sucht in der Artikelbeschreibung und im HTML-Feld.

Das ist in Sachen Performance natürlich aufwendiger, aber die Messungen aus den ersten produktiven Kunden haben uns gezeigt, dass noch Luft für diese Optimierung vorhanden war.

Die Kombination aus POWERsuche und dieser Ajax Suchhilfe ist damit noch effektiver. Das Update ist selbstverständlich bei allen betroffenen automatisch durchgeführt worden. Sie müssen also nichts ändern.


Forum-Archiv

Alle Beiträge aus:

2026, 2025, 2024, 2023, 2022, 2021, 2020, 2019, 2018, 2017, 2016, 2015, 2014, 2013, 2012, 2011, 2010, 2009, 2008, 2007, 2006, 2005, 2004, 2003, 2002,