CSS Selector

CSS Selector

What it is 
The CSS selector field that tells ConversionBox where to render Instant Search results within the theme’s DOM (for example, replacing the default results container like #MainContent). 

Why it matters 
Correct selector mapping is the single most important technical step to ensure Instant Search integrates seamlessly into the theme without layout collisions or duplicate content rendering. 

How to configure 

  1. Inspect your theme with browser devtools to locate the container element that holds search results or collection content (common IDs/classes: #MainContent, content, .main-column). 

  1. Copy a stable selector that uniquely identifies that container. Prefer IDs or classes that are unlikely to change with theme updates. 

  1. Paste the selector into ConversionBox’s CSS Selector setting and save. 

  1. Load a search result page and confirm ConversionBox is rendering in place of the theme content (no duplicated product lists).

    • Related Articles

    • Selector Configuration

      What it is The CSS Selector tells ConversionBox which part of your Shopify theme to replace with its enhanced results grid. Why it matters Correct selector configuration ensures that ConversionBox properly injects its dynamic content into your theme ...

    • Search Field Integration

      What it is The CSS selector configuration that binds the Autocomplete widget to the theme’s search input(s), enabling the widget to listen for keystrokes and display suggestions. Why it matters A correct selector is required for Autocomplete to ...

    • Instant Search

      Understand how to replace the default search page with ConversionBox’s Instant Search widget. Configure results display, sorting logic, and on-screen filtering for real-time product updates. Instant Search Setup Enable and customize Instant Search to ...

    • Auto Complete

      Learn how to configure autocomplete functionality to display predictive search results as users' type. Manage display settings, product visibility, and layout for faster product discovery. Autocomplete Configuration Set up how product names, ...

    • Instant Search Setup

      What it is The master toggle and initial configuration workflow that activates Instant Search and determines where ConversionBox will take over the store’s search results experience. Why it matters Turning Instant Search on redirects search queries ...