Your First Search

After installing FilterIQ and running AI Setup, take a few minutes to verify everything is working correctly on your storefront.

Step 1: Open Your Storefront

Navigate to your live Shopify store in a new browser tab. Use your public domain (e.g., yourstore.com), not the .myshopify.com admin URL.

Step 2: Test Search

1. Click on your store's search bar -- FilterIQ automatically attaches to your existing theme search input
2. Type a product name -- After 1-2 characters, you should see an instant search dropdown appear
3. Verify results appear -- Product cards with images, titles, and prices should display within the dropdown
4. Test a typo -- Try misspelling a product name (e.g., "sneakrs" instead of "sneakers") and confirm results still appear

What to look for

• Measure from input to usable results; configured debounce, network time and rendering all contribute
• Product images, titles, and prices should render correctly
• Results should update as you continue typing
• Pressing Enter or clicking "View all results" should navigate to a full search results page

Step 3: Test Filters

1. Navigate to a collection page (e.g., yourstore.com/collections/all)
2. Look for the filter sidebar -- It appears on the left side of your product grid by default
3. Click a filter option -- For example, select a color swatch or check a product type
4. Verify the product grid updates -- Products should filter in real-time without a full page reload
5. Check filter counts -- Each filter option should display the number of matching products

Filter layout options

Your filters may display in one of three layouts, depending on your configuration:

• Sidebar (default) -- Vertical filter panel on the left of the product grid
• Horizontal toolbar -- Filter options displayed above the product grid
• Drawer -- A slide-out panel triggered by a "Filters" button, optimized for mobile

Step 4: Test on Mobile

1. Open your store on a mobile device or use browser DevTools to simulate a mobile viewport
2. You should see a "Filters" button that opens a mobile drawer
3. The search dropdown should switch to a full-screen overlay on screens under 768px wide
4. Touch targets should be at least 44x44px for accessibility

Step 5: Verify in the Dashboard

Go back to the app dashboard in your Shopify admin. After performing some test searches and filter interactions, you should start seeing data in:

• Analytics > Search Analytics -- Your test search queries should appear
• Analytics > Filter Analytics -- Your test filter selections should be logged

Common Issues

Search dropdown does not appear

• Confirm the Theme App Extension is enabled: go to Online Store > Themes > Customize, click the puzzle icon for App embeds, and ensure "Smart Search & Filter" is toggled on
• Check that your theme search input uses a standard input[name="q"] element

Filters do not appear on collection pages

• Verify that filters are published: in the app dashboard, go to Filters and click Publish to Storefront
• Make sure you have products in the collection you are viewing

Results are slow or empty

• Check that initial sync has completed for the intended products; timing varies with catalogue and service conditions
• Check the sync status in the app dashboard under Settings > Sync Status

Next Steps

• Configure Search Settings -- Adjust which fields are searched and their weights
• Explore Filter Types -- See all 15+ available filter types
• Set Up Merchandising -- Control which products appear first