This guide outlines all the advanced options available within the Plug & Play integration of Experro. These settings can be updated directly through the UI using the Custom JS tab in Experro’s UI Customization panel allowing you to tailor how your components behave. Here is the sample code to be pasted in the Custom JS tab in Experro’s UI Customization panel followed by the detailed explanation of each setting:
"user_settings": {
        "content_page_desc_count": 200,
        "product_desc_count": 70,
        "autocomplete_desc_count": 50,
        "is_search_redirect_enabled": true,
        "add_to_cart_behavior": "redirect",
        "spellcheck_enabled": false,
        "is_live": false,
        "compare_limit": 4,
        "did_you_mean_limit": 1,
        "desktop_view": {
            "autocomplete_block_selector": "[data-exp-autocomplete-block]",
            "autocomplete_input_selector": "[data-exp-autocomplete-input-container]",
            "autocomplete_result_selector": "[data-exp-autocomplete-result-container]",
            "autocomplete_replace_with": "input",
            "category_page_selector": ".page",
            "search_page_selector": ".page",
            "swatch_visibility_scope": "limited",
            "swatch_visibility_type": "image",
            "placeholder_animation_type": "typing" 
        },
        "mobile_view": {
            "autocomplete_block_selector": "[data-exp-autocomplete-block]",
            "autocomplete_input_selector": "[data-exp-autocomplete-input-container]",
            "autocomplete_result_selector": "[data-exp-autocomplete-result-container]",
            "autocomplete_replace_with": "icon", 
            "category_page_selector": ".page",
            "search_page_selector": ".page",
            "swatch_visibility_scope": "limited",
            "swatch_visibility_type": "image",
            "placeholder_animation_type": "typing"
        }
    },

Global Settings

These settings apply universally across the platform.
SettingDescription
content_page_desc_countMaximum number of characters to show for content descriptions. (Default: 200)
product_desc_countTruncation limit for product descriptions across product listings. (Default: 70)
autocomplete_desc_countCharacter limit for product descriptions shown in the autocomplete dropdown. (Default: 50)
is_search_redirect_enabledIf enabled (true), certain queries will auto-redirect to specific landing pages.
add_to_cart_behaviorDetermines add-to-cart behavior: redirect (takes user to cart) or modal (inline popup).
spellcheck_enabledIf set to true, activates spelling correction in search & autocomplete suggestions.
is_liveIndicates whether Experro is live on the store. Set to true to enable live features or false for development mode.
compare_limitRestricts the number of products that can be added for comparison. (Only for BigCommerce. Default: 4)
did_you_mean_limitLimits the number of “Did You Mean” suggestions displayed. (Default: 1)

Desktop View Settings

These selectors define how Experro’s frontend plug-in integrates with your desktop layout.
SettingDescription
autocomplete_block_selectorSelector where the autocomplete block (icon or input) will be inserted.
autocomplete_input_selectorSelector holding the autocomplete input.
autocomplete_result_selectorSelector where autocomplete results should be rendered.
autocomplete_replace_withReplaces search bar with either icon or input field.
category_page_selectorSelector for injecting category page product results.
search_page_selectorSelector for injecting search results on search listing pages.
swatch_visibility_scopeControls how many swatches to show: limited (default) or all.
swatch_visibility_typeType of swatch display: image, text, or color. Default: image
placeholder_animation_typeDetermines the animation style of the search box placeholder text. Possible values: typing, rotation, fade.

Mobile View Settings

These settings mirror the desktop options but are scoped specifically for mobile layouts.
SettingDescription
autocomplete_block_selectorSelector to position autocomplete block in mobile view.
autocomplete_input_selectorInput selector for mobile autocomplete.
autocomplete_result_selectorWhere the mobile autocomplete results should render.
autocomplete_replace_withMobile option to toggle between search icon or full input field.
category_page_selectorSelector for rendering mobile category listings.
search_page_selectorSelector for rendering mobile search result pages.
swatch_visibility_scopeMobile-specific swatch scope visibility: limited (default) or all.
swatch_visibility_typeSwatch display mode for mobile: image, text, or color.
placeholder_animation_typeDetermines the animation style of the search box placeholder text. Possible values: typing, rotation, fade.
By configuring these settings, you gain full visual and behavioral control over how Experro plug-and-play features integrate into your site experience across both desktop and mobile storefronts.