integration_documentation:direct_integration

integration_documentation:direct_integration

Differences

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

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
Next revision Both sides next revision
integration_documentation:direct_integration [2018/05/07 14:57]
florian [OXID]
integration_documentation:direct_integration [2022/03/08 14:59]
florian [Overview]
Line 1: Line 1:
-===== Integration documentation - Direct Integration =====+===== Direct Integration =====
  
 ==== Overview ==== ==== 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 the response will be placed in container of the shop with **unique ​ids**. As a customer of FINDOLOGIC ​you have to provide these containers ​in your shop.+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 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 pageThe container should have the id *fl-searchresults*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>​
  
-=== Filter container ===+------
  
-For using FINDOLOGIC on category pages you have to provide ​the ''​cat_url''​s in a valid manner[[export_patterns:​xml_export|See our documentation about ''​cat_url''​s]] for more information+==== Search result container ==== 
-This container ​has to be available on every category page of the shop. The container should have the id *fl-filters*. For the category ​pages, the HTML-response of FINDOLOGIC ​contains both all available filters ​for this category.+ 
 +To ensure proper functionality,​ the Findologic Direct Integration must have access ​to the main container of the shopTo 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 |}}
  
 ---- ----
  
-==== Direct Integration plugins for the export ​====+==== Navigation container ​====
  
-FINDOLOGIC offers **plugins ​for the export** for the shopsystemsthat are listed below.+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. 
 +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 pagesthe HTML-response of Findologic contains both all found products and available filters for this category.
  
-If there is no export-plugin available for your shopsystem, you have to use an individual script for exporting shop-data to FINDOLOGIC.+{{ :​integration_documentation:​fl-navigation-result.png |}}
  
-See our [[export_patterns:​xml_export|export documentation for XML format]] and the [[export_patterns:​xml|FINDOLOGIC XML export patterns]] for informations about the FINDOLOGIC XML-export, that is used for the Direct Integration.+----
  
-\\ +==== Visualisation ====
  
-<​note>​The Direct Integration ​is possible for every shopsystemincluding individual shopsystems!</​note>​+  - 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 filterthe products will be provided by Findologic via JavaScript and will be placed in the products container.
  
-\\ +-----
  
-==== Shopware ==== + ​**1.** {{ integration_documentation:​nav1_1.png }}  
-[[integration_documentation:​direct_integration:​shopware|{{:integration_documentation:​shopware_logo.png?200}}]]+ **2. & 3.** {{ integration_documentation:​nav1_2.png }}
  
-[[integration_documentation:​direct_integration:​shopware|Documentation for implementing the FINDOLOGIC-plugin]]+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>​