PLZ-Assistent - WEBSALE Dokumentation

Postleitzahl und Ort sind die Adressangaben, bei denen Käufer am häufigsten danebenliegen, und ein Zahlendreher fällt erst auf, wenn das Paket zurückkommt. Der PLZ-Assistent schlägt deshalb schon während der Eingabe passende Kombinationen aus Postleitzahl und Ort vor. Der Käufer wählt eine davon, statt beides einzutippen.

Unterstützt werden derzeit Deutschland und Österreich. Die zugrunde liegende Datenbank stammt von einem externen Partner und wird auch von diesem aktualisiert. WEBSALE kann darin keine Einträge ändern.

Wie der Assistent arbeitet

Der Käufer wählt zuerst sein Land. Solange kein Land gewählt ist, bleibt der Assistent stumm, denn er weiß nicht, welchen Datenbestand er befragen soll. Ab dem zweiten eingegebenen Zeichen im Feld für die Postleitzahl oder für den Ort blendet er einen Container mit passenden Treffern ein. Der Käufer wählt einen davon, mit der Maus oder mit den Pfeiltasten und der Eingabetaste. Gibt es zu einer Eingabe nur einen einzigen Treffer, füllt der Assistent ihn von sich aus ein. Aus „Tül” wird so „38474 Tülau”. Diese Vervollständigung lässt sich abschalten:

var params = {
   language_list: ["DEU", "AUT"],
   autocomplete: false
};

Das Aussehen des Trefferbereichs bestimmen Sie über eigene IDs und Klassen, die Sie in Ihr Stylesheet übernehmen. Referenz: Styles für PLZ-Assistent

Einbindung in die Adressformulare

Der Assistent braucht die WEBSALE Systembibliothek und die Modulkomponente ws-ziphelp. Beides gehört in den Kopfbereich des Templates, zusammen mit der Einrichtung.

<head>
   <script src="/$WS/ws_sysdata/js/ws-system-1.1.0.js"></script>
   <script src="/$WS/ws_sysdata/js/ws-ziphelp-1.1.0.min.js"></script>

   <script>
      $(document).ready(function () {
         var params = {
            language_list: ["DEU", "AUT"],
            call_url: "~WS-AjaxZIPHelpUrl~",
            zip_field: "input[name=ws_input_zip]",
            city_field: "input[name=ws_input_city]",
            lang_field: "select[name=ws_input_country]",
            close: true,
            headline: "PLZ-Assistent",
            description: "Hilfe zur Auswahl Ihrer Postleitzahl und Ihres Wohnortes"
         };
         $.ws_zip_help(params);

         var paramsDelivery = {};
         $.extend(paramsDelivery, params);
         paramsDelivery.zip_field  = "input[name=ws_input_delivery_zip]";
         paramsDelivery.city_field = "input[name=ws_input_delivery_city]";
         paramsDelivery.lang_field = "select[name=ws_input_delivery_country]";
         $.ws_zip_help(paramsDelivery);
      });
   </script>
</head>

Der zweite Block richtet denselben Assistenten für die Lieferadresse ein. Er übernimmt mit $.extend alle Einstellungen des ersten und überschreibt nur die drei Feldnamen.

Prüfen Sie die Versionsnummern der beiden Bibliotheken gegen den Stand, den Ihr Shop tatsächlich verwendet. Andere Funktionen arbeiten mit deutlich neueren Ständen, und zwei verschiedene Versionen derselben Systembibliothek auf einer Seite vertragen sich nicht.

Referenz: WS-AjaxZIPHelpUrl Die beiden Texte headline und description erscheinen über dem Trefferbereich. Passen Sie sie an Ihre Ansprache an und übersetzen Sie sie in mehrsprachigen Shops.

Automatische Browservervollständigung abschalten

Setzen Sie bei den beiden Eingabefeldern autocomplete="off". Sonst legt sich die Vorschlagsliste des Browsers über die des Assistenten.

<input type="text" name="~A-Zip_input~" autocomplete="off">
<input type="text" name="~A-City_input~" autocomplete="off">

Zusammenspiel mit dem Nachladen von Adressfeldern

Laden Sie Adressfelder per AJAX nach, beispielsweise bei einer Auswahl zwischen Adresstypen, verliert der Assistent seine Anbindung an die neu erzeugten Felder. Die Einrichtung muss dann nach jedem Nachladen erneut laufen. Wie das geht, steht bei der eingabeabhängigen Adressdatensteuerung.

Wegweiser: Auswahl zwischen Privat- und Geschäftsadresse · Auswahl zwischen postalischer Lieferadresse und Packstation

Einbindung in INQUIRY-Formulare

Der Assistent funktioniert auch außerhalb des Bestellablaufs, beispielsweise im Kontakt- oder Widerrufsformular. Zwei Dinge unterscheiden sich vom Adressformular.

Schritt 1: Formularkonfiguration ergänzen

Ein INQUIRY-Formular weiß nicht von sich aus, zu welchem Shop es gehört. Tragen Sie das in der Konfigurationsdatei des Formulars ein, beispielsweise in kontakt.config oder widerruf.config. Sie finden diese Dateien im Online-Servicebereich unter Konfiguration, Konfigurationen, Formulare (Inquiry).

<Shop-ZIP-Assistant>
   MallID    = websale
   ShopID    = ihre-shop-id
   SubShopID = ihre-subshop-id
   BaseUrl   = https://www.ihre-shop-url.de
</Shop-ZIP-Assistant>

Schritt 2: JavaScript einbinden

Die Einrichtung entspricht der oben gezeigten. Nur die Feldnamen sind andere: Statt der Adress-Tags tragen Sie die technischen Feldnamen aus Ihrer INQUIRY-Konfiguration ein.

var params = {
   language_list: ["DEU", "AUT"],
   call_url: "~WS-AjaxZIPHelpUrl~",
   zip_field: "input[name=zip]",
   city_field: "input[name=city]",
   lang_field: "select[name=country]",
   close: true,
   headline: "PLZ-Assistent",
   description: "Hilfe zur Auswahl Ihrer Postleitzahl und Ihres Wohnortes"
};
$.ws_zip_help(params);

Achten Sie darauf, dass jQuery und die Modulkomponente ws-ziphelp im Template des Formulars eingebunden sind. Im Bestellablauf bringt das Shop-Template sie meist schon mit, ein INQUIRY-Template nicht zwangsläufig. Wegweiser: Integration eines INQUIRY-Formulars · Dokumentation: Formulare mit INQUIRY4

​Wie der Assistent arbeitet

​Einbindung in die Adressformulare

​Automatische Browservervollständigung abschalten

​Zusammenspiel mit dem Nachladen von Adressfeldern

​Einbindung in INQUIRY-Formulare

​Schritt 1: Formularkonfiguration ergänzen

​Schritt 2: JavaScript einbinden

​Verwandte Themen

Wie der Assistent arbeitet

Einbindung in die Adressformulare

Automatische Browservervollständigung abschalten

Zusammenspiel mit dem Nachladen von Adressfeldern

Einbindung in INQUIRY-Formulare

Schritt 1: Formularkonfiguration ergänzen

Schritt 2: JavaScript einbinden

Verwandte Themen