> ## Documentation Index
> Fetch the complete documentation index at: https://dokumentation.websale.de/llms.txt
> Use this file to discover all available pages before exploring further.

# Integration von FINDOLOGIC

> Die Suche, die Vorschlagsfunktion und die Filter von FINDOLOGIC in den Shop einbinden, samt Datenübergabe und Rückfallebene.

Die interne Suche des Shops findet, was der Kunde schreibt. FINDOLOGIC findet, was er meint: Es verzeiht Tippfehler, erkennt sinnverwandte Begriffe und sortiert die passenden Produkte nach oben. Ein Kunde, der "tshrit" eingibt, bekommt T-Shirts, und wer "iPad" sucht, bekommt iPads und keine Ladekabel.

![Findologic Suchergebnisseite](https://mintcdn.com/websaleag-44ee7ea6/ZpqrUDlxS94uTw6k/images/findologic_suchergebnisseite.png?fit=max\&auto=format\&n=ZpqrUDlxS94uTw6k\&q=85\&s=9a7b95429f696fc0c86063b8cb8687b9)

WEBSALE V8s bindet drei Funktionen von FINDOLOGIC direkt an:

| Funktion | Was sie leistet |
| - | - |
| Suche | ersetzt die interne Suche, mit eigenem Ranking und Fehlertoleranz |
| Suggest | zeigt schon beim Tippen Vorschläge zu Produkten, Kategorien und Marken |
| Filter | verfeinert die Trefferliste nach Kategorie, Hersteller, Preis und Attributen |

> [!WARNING]
>
> Suchmaschinen folgen beim Durchlaufen des Shops auch den Links aller Filteroptionen und deren Folgeseiten. Die Zahl der abgerufenen Seiten kann dadurch stark ansteigen. Besprechen Sie mit Ihrem SEO-Verantwortlichen, wie das eingegrenzt wird, beispielsweise über das Attribut `rel="nofollow"` an diesen Links.

## Voraussetzungen

Zwei Konten sind nötig, und beide Seiten müssen etwas beitragen:

| Bei wem | Was |
| - | - |
| FINDOLOGIC | ein Konto, das Sie direkt dort anfordern |
| WEBSALE | Freischaltung der FINDOLOGIC-Suche, der Tracking-Schnittstelle und des Dataflow-Managers |

Wird die Suche eingesetzt, müssen die Produktdaten regelmäßig zu FINDOLOGIC übertragen werden. Dieser Export läuft über den Dataflow-Manager und wird von WEBSALE angestoßen.

Den Datenfeed an FINDOLOGIC können Sie derzeit nicht selbst anpassen, das übernimmt WEBSALE. Wahlweise kann der Export auch aus Ihrem Warenwirtschaftssystem heraus erfolgen.

## Vorher klären

Diese Fragen gehören mit FINDOLOGIC und mit WEBSALE besprochen, bevor jemand ein Template anfasst:

* Welche der drei Funktionen sollen eingesetzt werden?
* Welche Datenbasis, welche Datenquelle und welches Aktualisierungsintervall sind gewünscht?
* In welchen Subshops soll FINDOLOGIC arbeiten?
* Welche Filter und Sortierungen soll die Trefferliste anbieten? Das wird je Subshop festgelegt.
* Wie lauten die Adresse und der Shopkey für den Aufruf aus dem Shop?

Die letzten beiden Punkte brauchen Sie in jedem der folgenden Schritte, und beide bekommen Sie nur von FINDOLOGIC.

## Die Datenübergabe

Standardmäßig bekommt FINDOLOGIC ausschließlich Produktdaten Ihres Shops, und zwar als Grundlage für alle drei Funktionen. Für weitere Daten gelten besondere Voraussetzungen, die mit beiden Seiten zu klären sind.

Der Weg dorthin führt über ein Profil im Dataflow-Manager, das Sie gemeinsam mit WEBSALE festlegen. Es bestimmt, welche Produktfeldtypen und welche einzelnen Angaben übergeben werden, beispielsweise Preis, Marke und Farbe, dazu das Intervall der Übertragung.

Nach dem Anlegen des Profils bekommen Sie eine Export-Adresse für den Datenfeed als CSV-Datei. Diese Adresse tragen Sie in Ihrem FINDOLOGIC-Konto unter "Einstellungen > Import/Export" im Feld "CSV-URL" ein.

Steht der Export, legen Sie mit FINDOLOGIC die Vorkonfiguration für Filter und Sortierungen fest.

## Die Suche einbinden

![Findologic Templatemanager](https://mintcdn.com/websaleag-44ee7ea6/ZpqrUDlxS94uTw6k/images/findologic_templatemanager.png?fit=max\&auto=format\&n=ZpqrUDlxS94uTw6k\&q=85\&s=9e79e6b8271bbd09bd658f5a29743fda)

### Schritt 1: Die Rückfallebene einrichten

Fällt FINDOLOGIC aus, soll der Kunde nicht vor einer leeren Trefferliste stehen. Der LiveCheck prüft die Erreichbarkeit, und im Ernstfall zeigt der Shop seine eigenen Suchergebnisse.

```ini theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
<ExternSystemLiveChecks>
   <+Entry>
      ID        = FindologicSearch
      URL       = https://...  (Adresse von FINDOLOGIC inklusive Shopkey)
      Type      = 2
      CheckMode = always
      Timeout   = 1000
   </+Entry>
</ExternSystemLiveChecks>
```

Die Adresse für diese Prüfung bekommen Sie von FINDOLOGIC, sie endet üblicherweise auf `alivetest.php` und trägt den Shopkey als Parameter:

```text theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
https://srv12.findologic.com/ps/ihr-shop.de/alivetest.php?shopkey=<Ihr Shopkey>
```

`CheckMode = always` prüft bei jedem Seitenaufruf neu. Das kostet Zeit, ist hier aber richtig: Eine für die ganze Sitzung gemerkte Störung würde den Kunden auch dann noch auf die interne Suche schicken, wenn FINDOLOGIC längst wieder antwortet.

Referenz: [Abschnitt ExternSystemLiveChecks](https://dokumentation.websale.de/v8s/referenz/konfigurationen/shopkonfiguration-shop-config/externe-dienste-und-schnittstellen.md#externsystemlivechecks)

Wegweiser: [Externe Inhalte einbinden](https://dokumentation.websale.de/v8s/externe-dienste/externe-inhalte-einbinden.md)

### Schritt 2: Die Suchergebnisseite anpassen

Angezeigt werden die Ergebnisse auf dem Template, das in der `shop.config` im Abschnitt `<Templates>` hinter `Search` steht. Dort wird der Bereich mit den eigenen Suchergebnissen um einen Bereich mit dem externen Include ergänzt. Der eigene Bereich erscheint danach nur noch, wenn FINDOLOGIC nicht erreichbar ist.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{WS-ExternSystemLiveCheck(FindologicSearch)}

   <!-- Suchergebnisse von FINDOLOGIC -->
   ~WS-ExternInclude(https://srv12.findologic.com/ps/ihr-shop.de/index.php?Ctx=$WS-Ctx$&search_input=$WS-SearchEnc$&shopkey=<Ihr Shopkey>)~

{/WS-ExternSystemLiveCheck(FindologicSearch)}

{!WS-ExternSystemLiveCheck(FindologicSearch)}

   <!-- eigene Suchergebnisse, wenn FINDOLOGIC nicht erreichbar ist -->
   {@PR-Data}
      ~PR-Name~
   {/@PR-Data}

{/!WS-ExternSystemLiveCheck(FindologicSearch)}
```

Der Suchbegriff geht über `WS-SearchEnc` in die Adresse, also in der für Adressen codierten Form. Der uncodierte Begriff würde bei Leerzeichen und Umlauten eine ungültige Adresse ergeben.

> [!WARNING]
>
> Damit die interne Suche im Normalbetrieb nicht zusätzlich arbeitet, lässt sie sich abschalten. Das ist ein eigener Schritt und gehört zur Umstellung dazu.

Referenz: [WS-ExternSystemLiveCheck()](https://dokumentation.websale.de/v8s/referenz/tags/ws/merkzettel-vergleich-upload-und-externe-dienste.md#die-tags-im-uberblick) · [WS-ExternInclude()](https://dokumentation.websale.de/v8s/referenz/tags/ws/merkzettel-vergleich-upload-und-externe-dienste.md) · WS-SearchEnc

Wegweiser: [Interne WEBSALE Suche bei Verwendung externer Suchdienstleister deaktivieren](https://dokumentation.websale.de/v8s/suche/interne-websale-suche-deaktivieren.md)

### Schritt 3: Die Trefferliste gestalten

Gestaltet wird nicht im Shop, sondern im Templatemanager des FINDOLOGIC-Kontos. Dort liegt ein shopspezifisches Template mit dem Namen `websale.tpl`, das Ihr FINDOLOGIC-Ansprechpartner auf Anfrage bereitstellt.

Es bringt bereits mit:

* Filtern und Sortieren der Suchergebnisse
* Auswahl der Treffer je Seite
* Blätterfunktion
* Anzeige des Suchbegriffs und der Trefferzahl
* die Suchergebnisse selbst

Der eigentliche Kniff steckt im Bereich `<div id="flResults">`: Dort dürfen Sie WEBSALE-Tags verwenden. Die Produktdarstellung im Shop und in der FINDOLOGIC-Trefferliste kann damit dieselbe sein.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
<div id="flResults">
   {not_found message="Es wurden keine Produkte gefunden"}
   {foreach from=$RESULT item=ITEM}
      {literal}~DC-FP1_set({/literal}{$ITEM.ORDERNUMBER}{literal})~{PR-AdvData($DC-FP1$)}~PR-Name~{/PR-AdvData($DC-FP1$)}{/literal}
   {/foreach}
   <div class="clear"></div>
</div>
```

So arbeitet der Block: FINDOLOGIC liefert je Treffer die Bestellnummer. Diese wird in einen freien Platzhalter gelegt, und `PR-AdvData()` holt dazu die Produktdaten aus dem Shop. Innerhalb dieser Klammerung stehen dann alle gewohnten Produkt-Tags zur Verfügung.

Die `{literal}`-Bereiche gehören zur Templatesprache von FINDOLOGIC. Sie sorgen dafür, dass die WEBSALE-Tags dort unverändert durchgereicht werden, statt selbst als Anweisungen gelesen zu werden.

Nutzen Sie für die Produktdarstellung bereits ein FastInclude, lässt es sich hier genauso einsetzen:

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
<div id="flResults">
   {not_found message="Es wurden keine Produkte gefunden"}
   {foreach from=$RESULT item=ITEM}
      {literal}~DC-FP1_set({/literal}{$ITEM.ORDERNUMBER}{literal})~{PR-AdvData($DC-FP1$)}~WS-Fast_Include(Incl-ProductList)~{/PR-AdvData($DC-FP1$)}{/literal}
   {/foreach}
   <div class="clear"></div>
</div>
```

Damit sehen Produktkacheln in der Kategorie und in der Trefferliste gleich aus, und eine Änderung wirkt an beiden Stellen.

Referenz: [DC-FP1…5](https://dokumentation.websale.de/v8s/referenz/tags/dc/parameter.md) · [DC-FP1…5\_set()](https://dokumentation.websale.de/v8s/referenz/tags/dc/parameter.md) · [PR-AdvData()](https://dokumentation.websale.de/v8s/referenz/tags/pr/grundlagen-und-produktdaten.md#die-tags-im-uberblick) · [PR-Name](https://dokumentation.websale.de/v8s/referenz/tags/pr/grundlagen-und-produktdaten.md#die-tags-im-uberblick) · [WS-Fast\_Include()](https://dokumentation.websale.de/v8s/referenz/tags/ws/includes-templates-css-und-js.md)

### Schritt 4: Gestaltung übernehmen

Die HTML-Elemente im FINDOLOGIC-Template tragen bereits Klassen und Kennungen. Ergänzen Sie diese in der Stildatei Ihres Shops und geben Sie ihnen die gewünschten Eigenschaften.

## Die Vorschlagsfunktion einbinden

![Findologic Suggestfunktion Mit Bildern](https://mintcdn.com/websaleag-44ee7ea6/ZpqrUDlxS94uTw6k/images/findologic_suggestfunktion_mit_bildern.png?fit=max\&auto=format\&n=ZpqrUDlxS94uTw6k\&q=85\&s=72aa52d1b11449a9af989fe88d862884)

Die Vorschläge erscheinen in einer eigenen Ebene direkt unter dem Sucheingabefeld, sobald FINDOLOGIC zu den eingegebenen Buchstaben etwas findet. Das ist oft schon nach wenigen Zeichen der Fall.

### Schritt 1: WEBSALE JavaScript-Bibliothek

Prüfen Sie, ob Systembibliothek und Design-Komponente eingebunden sind, und ergänzen Sie sie andernfalls im `<head>`-Bereich.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
<head>
   ...
   <script type="text/javascript" src="/$WS/ws_sysdata/js/ws-system-1.8.3.js"></script>
   <script type="text/javascript" src="../ihr-verzeichnis/ws-design-1.8.3.js"></script>
   ...
</head>
```

Materialien: [WEBSALE JavaScript-Bibliothek](https://dokumentation.websale.de/v8s/materialien/websale-javascript-bibliothek.md)

### Schritt 2: jQuery-Komponenten

| Datei | Wofür |
| - | - |
| `jquery.autocomplete.js` | die Vorschlagsfunktion selbst, immer nötig |
| `jquery.preload.js` | nur nötig, wenn die Vorschläge Vorschaubilder zeigen sollen |

Beide Dateien stehen unter "Materialien" zum Herunterladen bereit. Speichern Sie sie in Ihrem JavaScript-Verzeichnis und binden Sie sie im `<head>`-Bereich ein.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
<head>
   ...
   <script type="text/javascript" src="../js/web/jquery.autocomplete.js"></script>
   <script type="text/javascript" src="../js/web/jquery.preload.js"></script>
   ...
</head>
```

Materialien: [jquery.autocomplete.js](https://dokumentation.websale.de/v8s/materialien/materialien-findologic-dateien.md#die-dateien-und-woher-sie-kommen) · [jquery.preload.js](https://dokumentation.websale.de/v8s/materialien/materialien-findologic-dateien.md#die-dateien-und-woher-sie-kommen)

### Schritt 3: Das Sucheingabefeld anpassen

Verwendet wird das gewohnte QuickSearch-Formular. Zwei Dinge daran ändern sich:

| Änderung | Warum |
| - | - |
| `method="get"` statt `method="post"` | die Vorschlagsfunktion arbeitet mit der Adresse, nicht mit gesendeten Formulardaten |
| `id="flAutocompleteInputText"` am Eingabefeld | daran findet das Skript das Feld, unter dem die Ebene erscheint |

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
<form action="~FORM-QuickSearch~" method="get">

   <input name="~WS-Search_Input~" type="text" value="Ihr Suchbegriff" id="flAutocompleteInputText">
   <input type="submit" value="Suchen">

   <script type="text/javascript">autocompleteField = jQuery("#flAutocompleteInputText");</script>
   <script type="text/javascript" src="../js/web/findologic_suggest.js"></script>

</form>
```

> [!WARNING]
>
> Die Kennung `flAutocompleteInputText` ist zwingend und darf nicht umbenannt werden. Ohne sie erscheint keine Vorschlagsebene, und zwar ohne Fehlermeldung.
>
> Das Skript `findologic_suggest.js` setzt die beiden jQuery-Komponenten aus Schritt 2 voraus. Es muss deshalb nach ihnen geladen werden. Steht es davor, bleibt die Funktion wirkungslos.

Referenz: [FORM-QuickSearch](https://dokumentation.websale.de/v8s/referenz/tags/form-formulare.md#katalog-suche-und-produkt) · [WS-Search\_Input](https://dokumentation.websale.de/v8s/referenz/tags/ws/suche-listen-und-blaettern.md#das-suchformular)

Materialien: [findologic\_suggest.js](https://dokumentation.websale.de/v8s/materialien/materialien-findologic-dateien.md#die-dateien-und-woher-sie-kommen)

### Schritt 4: Die Vorschlagsebene gestalten

Die Ebene baut `findologic_suggest.js` selbst auf. Ihre Elemente tragen bereits Klassen, denen Sie Eigenschaften geben. Unter "Materialien" liegt eine Stildatei mit einer Auswahl dieser Klassen. Sie können die Datei entweder im CSS-Verzeichnis ablegen oder ihren Inhalt in die vorhandene Stildatei des Shops übernehmen.

Materialien: [findologic\_suggest.css](https://dokumentation.websale.de/v8s/materialien/materialien-findologic-dateien.md#die-dateien-und-woher-sie-kommen)

## Der Ablauf im Überblick

Für die Planung, in welcher Reihenfolge was passiert:

1. FINDOLOGIC kontaktieren, Funktionen bestellen und die Konfiguration vereinbaren.
2. Bei WEBSALE die Freischaltungen veranlassen und den Datenexport festlegen.
3. Subshops auswählen und die sprachabhängigen Punkte klären, beispielsweise die Umwandlung der Zeichencodierung und das Verhältnis von Feld- zu Anzeigenamen.
4. Die Suchergebnisseite einbauen, dazu Treffer je Seite, Blätterfunktion und die Filter konfigurieren.
5. Die Vorschlagsfunktion auf allen Shopseiten einbauen.
6. Alle Anzeigeelemente an das Design des Shops anpassen.

## Verwandte Themen

* Wegweiser: [Externe Inhalte einbinden](https://dokumentation.websale.de/v8s/externe-dienste/externe-inhalte-einbinden.md)
* Wegweiser: Interne WEBSALE [Suche](https://dokumentation.websale.de/v8s/referenz/konfigurationen/shopkonfiguration-shop-config/texte-und-meldungen.md#suche) bei Verwendung externer Suchdienstleister deaktivieren
* Wegweiser: Suche


## Related topics

- [Materialien FINDOLOGIC-Dateien](https://dokumentation.websale.de/v8s/materialien/materialien-findologic-dateien.md)
- [Integration von econda](https://dokumentation.websale.de/v8s/integration-von-econda/integration-von-econda.md)
- [Integration von Inxmail](https://dokumentation.websale.de/v8s/externe-dienste/inxmail.md)
- [Integration von FACT-Finder](https://dokumentation.websale.de/v8s/integration-von-fact-finder/integration-von-fact-finder.md)
- [Suche mit Suggest-Funktion](https://dokumentation.websale.de/v8s/suche/suche-mit-suggest-funktion.md)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.