Differences

This shows you the differences between two versions of the page.

--- integration_documentation:direct_integration [2019/03/05 09:24]
sarah [Overview]
+++ integration_documentation:direct_integration [2022/03/16 11:43]
florian [Overview]
@@ Line 1: / Line 1: @@
-===== Integration documentation - Direct Integration =====
+===== Direct Integration =====
 ==== Overview ====
-The FINDOLOGIC-scripts are binding events on the searchfield of the shop. When a user submits the form of the searchfield, the request gets sent via AJAX directly to the FINDOLOGIC servers. This offers a massive speed boost and lowers the load on the shop side, because it is not necessary that the request is being sent to the shop-server first.
+The Findologic-scripts are binding events on the search field of the shop. When a user submits the form of the search field, the request gets sent via AJAX directly to the Findologic servers.
-FINDOLOGIC loads the entire search result as defined in the [[customer_account:template_manager|template manager]] and delivers the rendered HTML to the shop. The HTML in this response will be placed in a container of the shop. This container must have **unique selectors**. As a customer of FINDOLOGIC you have to provide these containers in your shop.
+Findologic loads the entire search result and delivers the rendered HTML to the shop. The HTML in this response will be placed in a container of the shop. This container must have **unique selectors**. As a customer of Findologic you have to add the given classes to the existing main container in your shop.
 ------
-=== Search result container ===
+==== Implementing the Findologic snippet ====
-This container has to be available on every shop page in order to ensure that the search works on every single page. The container should have the class *fl-result*. For the search result pages, the HTML-response of FINDOLOGIC contains both all found product and the available filters.
+You can find the snippet for your channel in the [[https://account.findologic.io|Findologic customer login]]. Please add this snippet in the ''<head>''-section of your source code.
+<note>Please note that the usage of Google Tag Manager will disable the flickerfree-functionality of the snippet as the scripts are getting loaded too late.</note>
+------
+==== Search result container ====
+To ensure proper functionality, the Findologic Direct Integration must have access to the main container of the shop. To do so, it is necessary to add the class ''fl-result'' to the corresponding, pre-existing container.
+This class has to be available **on every shop page** in order to ensure that the search works on every single page. For the search result pages, the HTML-response of Findologic contains both all found product and the available filters.
+{{ :integration_documentation:fl-result.png |}}
 ----
-=== Navigation container ===
+==== Navigation container ====
-For using FINDOLOGIC on category pages you have to provide the ''cat_url''s in a valid manner. [[export_patterns:xml#cat_url_examples|See our documentation about ''cat_urls'']] for more information.
+For using Findologic on category pages you have to provide the ''cat_url''s in a valid manner. [[xml_export_documentation:xml_format#cat_url_examples|See our documentation about ''cat_urls'']] for more information.
-This container has to be available on every category page of the shop. The container should have the class *fl-navigation-result*. For the category pages, the HTML-response of FINDOLOGIC contains both all found products and available filters for this category.
+To ensure proper functionality, the Findologic Direct Integration must have access to the main container of the shop. To do so, it is necessary to add the class ''fl-navigation-result'' to the corresponding, pre-existing container.
+This class has to be available **on every category page** of the shop. For the category pages, the HTML-response of Findologic contains both all found products and available filters for this category.
+{{ :integration_documentation:fl-navigation-result.png |}}
 ----
+==== Visualisation ====
+  - The Findologic filters will be placed in the filter container, if the ''cat_url'' is correct.
+  - Depending on the type of navigation booked, products will either be provided by the shop or by Findologic on the first click (instant product listing).
+  - When selecting a filter, the products will be provided by Findologic via JavaScript and will be placed in the products container.
+-----
+ **1.** {{ integration_documentation:nav1_1.png }}
+ **2. & 3.** {{ integration_documentation:nav1_2.png }}
+If you have any questions regarding the navigation, or you are not sure how to integrate the navigation in your shop, please contact our technical support [[support@findologic.com]].
+{{tag>Navigation Nav Selector}}
+----
+==== Inserting content after Findologic rendering ====
+In case of frequent updates to a product’s or category’s specific information (e.g. availability, price, promotion banners etc.), it is possible to load this data dynamically via scripts on the shop’s side, after Findologic results are fully rendered.
+If needed, Findologic will send an event (such as „findologicFinish“) after results rendering. In further consequence any code may be executed by setting up a respective event-listener.
+Recommended implementation:
+<code php>
+document.addEventListener("findologicFinish", afterFindo);
+function afterFindo() {
+    // „Shop’s script“
+}
+</code>

integration_documentation:direct_integration

Differences

Documentation overview

Useful links