Search Widgets Common Data Attributes & Hook Functions

Name	Mandatory	Type	Description
data-app	Yes	String	Title of desired widget. Should be "search-app". Example: data-app="search-app"
data-app-id	No	String	Unique algolia application identifier. It's used to identify you when using Algolia's API. Can be found in algolia board -> API Keys; Example: data-app-id="K5K87EHRJP"
data-api-key	No	String	Public algolia API key which is usable for search queries and it's also able to list the indices. Can be found in algolia board -> API Keys; Example: data-api-key="ca64bbc3e020872a8bdf4s"
data-affiliate-id	Yes	String	Title of special widget's view user wants to insert. Represent widget type. There are several views: input-search search-results search-results-with-filters search-cta
data-css-mode	No	String	The CSS to be applied to the widget. Valid values are: full. This will display the widget with full "out-of-the-box" recommended styling. For example: input-search-full grid - This will display the widget without colours and aesthetic styling, but retain the general layout of the widget. For example: input-search-grid min - This will display the widget without any CSS (ideal for applying your own custom styling). For example: input-search-min Note: "full" is used by default, if no CSS mode is specified.
data-index-nam	No	String	Identifier of the algolia index name which will be the search for products/venues or etc. input-search-index Right now for developer's purposes "products" are used. For the production environment will be used: prod_products prod_venues Examples: data-index-name="products" data-index-name="prod_products" Note: "product" is used by default, if no Index name is specified.
data-pre-filter	No	String	Object type which is used for the filtering result events. Will be added in search query. Can include multiple object types. Examples: data-object-type="PRD" (only items where object_type = PRD will be shown) data-object-type="PRD,VEN" (only items where object_type = PRD OR object_type = VEN will be shown) data-object-type="*" (all items will be shown)
data-object-subtype	No	String	Object sub type which is used for the filtering result events. Will be added in search query. Can include multiple object sub types. Examples: data-object-subtype="SHW" (only items where object_sub_type = SHW will be shown) data-object-subtype="SHW,ATT" (only items where object_sub_type = SHW OR object_type = ATT will be shown) data-object-subtype="*" (all items will be shown) Note: data-object-subtype can be ignored when data-object-type has more than 1 value or [empty string]
data-limit-results	No	String (number)	The max number of returned results. Default value: 30 Valid values are: numeric value x, where 1 < x < 30 note: if value not valid it will be default value: 30 Example: data-limit-results="10"
data-action-url	No	String	Used to replace the base url of a search result item url. Example: http://mywebsite.com/section-of-my-site

Hook Functions

To override specific functionality you can use hook functions that you can attach to EncoreSearch global object.

Name	Arguments	Return value	Description
override Item RedirectUrl	objectId: string, nativeId: string, objectType: string, objectSubtype: string, originalUrl: string	String	Function to override original item redirect url depends on item properties Example: window.EncoreSearch.overrideItemRedirectUrl = function ( objectId, nativeId, objectType, objectSubtype, originalUrl ) { return 'https://test.com/products/' + objectType + '/' + objectId; }