Custom Overrides

important important the methods within this article are being replaced! please review the following updated guides for efficient customization set template docid 6yvx9naw6ax68wygucob7 modify request overview docid ndrepmgauhyltilxkg o modify response overview docid\ k usia fv m380bqcaw7p modify recommendations overview docid\ o03qerb3f sy0bhba64af there may be a use case or business requirement in which a modification to the search query or display template is needed once you have established the prerequisite code for overrides, you are free to focus on the custom action(s) necessary for your application within the klevu scope, including modify display markup docid 2wqzwkvdyeg1ipkbzuzv2 and modify search query docid\ eiwws8ibyziciu7fzeprh parameters this guide will familiarize with the actions involved in preparing for template js overrides defer initialization (powerup) of the klevu component define a new custom event listen for the new custom event fire the custom function, action, or override an api parameter activate initialization (powerup) note that each action requires definition within the corresponding scope of the override we will note these where applicable below scope description quick quicksearch module landing srlp module catnav category module for klevu recommendations there are a series of convenient overview docid\ o03qerb3f sy0bhba64af that can be utilized in place of these steps defer initialization first we need to tell klevu not to power up the appropriate module until we integrate the overrides this flag will be updated at a later step powerup { landing false } you can place it as an additional options element klevu({ powerup { landing false } }); note the scope of the deferred powerup in this example is set to landing array name field name description default value powerup quick quicksearch module true powerup landing srlp module true powerup catnav category module true define a new custom event next we will create a new custom build event which will fire once klevu has completed its initial setup the name we have chosen for this example is mylandingpageoverride but you can name this whatever you like we will use this name to attach it to the event lister in a later step important use unique name value for each event to avoid conflicts! klevu coreevent build ({ name " mylandingpageoverride ", fire function () { if (klevu getglobalsetting("flags setremoteconfiglanding build", false)) { return true; } return false; }, maxcount 150, delay 100 }); name description name unique value used to attach it to the event lister fire function and logic maxcount asynchronously retry x times delay wait x milliseconds between each retry this event will loop using the maxcount and delay values when the klevu internal flag setremoteconfiglanding build to be set as true, any attached events will fire note that this internal settings flag being checked is in the landing scope a separate build event check is required for each scope in each context of the override name description setremoteconfigquick build quicksearch configuration is ready setremoteconfiglanding build landing page configuration is ready setremoteconfigcatnav build category page configuration is ready listen for the new custom event we will now establish an event listener that is attached to the build event defined as mylandingpageoverride in the previous step klevu coreevent attach (" mylandingpageoverride ", { name "attachtomylandingpageoverride", fire function () { // do something klevu({ powerup { landing true } }); } }); fire the custom function upon the mylandingpageoverride build event, we can trigger any applicable javascript within the fire function please reference the applicable documentation sections for more detail on how to modify display markup docid 2wqzwkvdyeg1ipkbzuzv2 or modify search query docid\ eiwws8ibyziciu7fzeprh parameters klevu coreevent attach("mylandingpageoverride", { name "attachtomylandingpageoverride", fire function () { // do something klevu({ powerup { landing true } }); } }); activate initialization finally, now that we have completed our overrides, we can tell klevu that we are done and allow it to power up klevu coreevent attach("mylandingpageoverride", { name "attachtomylandingpageoverride", fire function () { // do something klevu({ powerup { landing true } }); } }); example landing page search query overrides the default limit for filter options in the result set javascript \<script type="text/javascript"> // defer initialization (powerup) of the klevu component klevu({ powerup { landing false } }); // define a new custom event, which will fire after srlp has initialised klevu coreevent build({ name "mylandingpageoverride", fire function () { if (klevu getglobalsetting("flags setremoteconfiglanding build", false)) { return true; } return false; }, maxcount 150, delay 100 }); // listen for the new custom event klevu coreevent attach("mylandingpageoverride", { name "attachtomylandingpageoverride", fire function () { // fire the custom javascript action or override an api parameter // do something klevu search landing getscope() chains request control addafter("initrequest", { name "modifylandingquery", fire function (data, scope) { // set max filter options to retrieve klevu setobjectpath( data , "localoverrides query productlist filters filterstoreturn options limit", 20); } }); // activate initialization (powerup) klevu({ powerup { landing true } }); } }); \</script>