Combined Scripts

use new combined scripts on search and category pages to improve javascript performance typically a klevu template js integration involves adding a number of scripts klevu core (klevu js) this is the framework and utilities used by the template js library klevu quick search theme this is the portion of the library responsible for the search as you type functionality that is added to the search input on the store klevu landing search theme this is the portion of the library responsible for the search result landing page klevu category search theme this is the portion of the library responsible for the category pages the search landing page script and category/collection landing page script share almost identical javascript code with some small differences and they never load at the same time however, the quick search script does share a lot of javascript code with both the search and category/collection scripts, so when you are on either the search or category pages and you also have quick search loaded using individual script files you end up with some duplicated javascript code being downloaded and loaded in the browser benefit the overall code is not large, so the savings are not drastic, but there is a 42% decrease in the size of the javascript code when we combine quick search with either the search or category page script there is no benefit when loading any other pages besides search or category since the file for quick search has not changed caveat unfortunately these combined scripts can only be used with a manual integration of klevu, so you cannot use these files when using the automated integration available in the klevu search app technical overview we have included two examples shown below in order to show how the basic logic needs to be modified from our original manual integrations in shopify and bigcommerce the original method included the loading of individual files for quick, search, and category with these new combined scripts only one script is loaded in each scenario here is the logic if you are on a category page, load quick catnav search theme js else if you are on the search page, load quick landing search theme js else on all other pages, load quick search theme js detailed examples the implementation of the combined scripts for the search and category pages involves modifying the steps outlined in the manual integration shopify manual integration the original manual integration steps for shopify can be found by clicking here https //help klevu com/support/solutions/articles/5000874715 theme modifications for jsv2 os2 dawn ? gl=1 1jeka46 gcl au mtc1mtuxmzqymc4xnze0mdu1nte5 ga mja5mzq1mdmxns4xnjgyntqwnze4 ga l5dz4br3p3 mtcxotgzmzc0mc45mc4xlje3mtk4mzuyodeumzcumc4w these steps are for the dawn theme which is an onlinestore 2 0 theme below we will outline the changes necessary for shopify note these steps are just for reference, so if you have already integrated klevu you will need to make the necessary adjustments to this information that work with your theme in the file called snippets/klevu quick search theme liquid you will need to comment the following code {% comment %} {% if template == 'page klevu search results' %} {% endif %} {% endcomment %} in the file called snippets/klevu metadata liquid you will need to replace its contents with the following code {% if template name == 'collection'%} {% elsif template name == 'search'%} {% else %} {% endif %} bigcommerce manual integration the original manual integration steps for bigcommerce can be found by clicking here https //docs klevu com/template js/get started with bigcommerce#hig4s below we will outline the changes necessary for bigcommerce note these steps are just for reference, so if you have already integrated klevu you will need to make the necessary adjustments to this information that work with your theme in the file called templates/layout/base html you will need to replace the following code {{#if page type '===' 'search'}} {{/if}} {{#if page type '===' 'category'}} {{/if}} with the following code {{#if page type '===' 'category'}} {{else if page type '===' 'search'}} {{else}} {{#if page type '===' 'product'}} {{else if page type '===' 'cart'}} {{/if}} {{/if}} the above code change basically replaces the loading of individual scripts for quick, search, and category with the combined scripts