Live Search theme selectors

The Dynasort Live Search app embed re-ranks the suggestion dropdown that appears while a shopper types. To do that on any theme, it needs to know two things, both set in the theme editor under Theme settings → App embeds → Dynasort Live Search:

• Search input selector: which search box(es) to attach to. The default (input[type="search"], input[name="q"]) matches nearly every theme, including all of Shopify’s free themes. You almost never need to change it.
• Native dropdown selector to hide: your theme ships its own suggestion panel. Without this setting, both panels appear stacked on top of each other. Set it to your theme’s suggestion container and Dynasort’s re-ranked suggestions take over cleanly.

Selectors by theme

Theme	Search input selector	Native dropdown selector to hide
Dawn, Craft, Sense, Studio, Refresh, Spotlight, Ride, Taste, Crave, Origin, Colorblock, Publisher	(leave default)	#predictive-search-results
Horizon, Savor, Tinker, Beyond, Vessel	(leave default)	#search-modal .predictive-search-form__content

On the Horizon family, search opens in a full modal rather than a dropdown. Dynasort detects this and renders its suggestions inside the modal, right where the theme’s own results would have appeared. No extra configuration is needed beyond the selector above.

This table grows as we verify more themes. If your theme is not listed, contact support with your theme’s name and we will test it and add it here.

Finding the selectors on any other theme

1. On your storefront, right-click the search box and choose Inspect.
2. Check the highlighted <input> element. If it has type="search" or name="q", the default input selector already matches and you can leave it alone.
3. Type a couple of characters so your theme’s own suggestions appear.
4. In the inspector, find the container element that holds those suggestions and note its id or a distinctive class.
5. Enter it in the embed’s Native dropdown selector to hide field, prefixed with # for an id (for example #predictive-search-results) or . for a class.
6. Save, reload the storefront, and type again. You should see one suggestion panel: Dynasort’s.

Troubleshooting

• Two suggestion panels stacked: the hide selector is empty or does not match. Re-check step 4 above.
• No suggestions at all: the input selector does not match your theme’s search field. Inspect the input and adjust.
• Suggestions appear but the theme’s panel container leaves an empty gap: some themes reserve space for their panel. Contact support with your theme name; a small CSS override usually resolves it.
• Results-page grid works but the dropdown does not: the results grid is a separate app block; the dropdown comes from this embed. Confirm the embed is toggled on in Theme settings → App embeds.