Skip to content

Search & Merchandising Platform

Three sister Shopify Plus storefronts — Plow & Hearth, My Evergreen, and Team Sports America — needed real merchandising control: pinning priority products, applying boost or bury rules, filtering assortments, and building campaign landing pages were all difficult or unavailable in the existing setup. I built a custom search and merchandising integration for all three, embedding the platform's UI library directly into each theme and rebuilding search, autocomplete, collections, and product cards in Liquid, JavaScript, and Handlebars so every storefront kept looking and behaving exactly as customers already knew it.

Stores
Plow & Hearth, My Evergreen, Team Sports America
Role
Integration design and development
  • Shopify Plus
  • Search
  • Liquid
  • Playwright

The Challenge

Common merchandising tasks — pinning priority products, boost/bury rules, assortment filters, campaign landing pages — were difficult or unavailable in the existing storefront setup, and every workaround meant developer time. Whatever replaced it also had to be invisible to customers: the three storefronts shared a base Shopify theme, but each carried its own customizations, apps, and visual details that couldn't be disturbed.

My Evergreen search autocomplete open over the home page, showing matching flag products beside a list of popular searches

The search UI recreated inside Shadow DOM to match native product-card behavior — pricing, badges, swatches, ratings, and quick add — across search, autocomplete, and collection pages.

The Approach

Rather than a standard app install, I embedded the platform's UI library directly into all three Shopify themes and rebuilt the existing search, autocomplete, collection, and product-card experience on top of it in Liquid, JavaScript, CSS, and Handlebars. I designed one reusable component structure that still let each storefront ship and be maintained independently, then refactored the integration around a strict API call contract — cutting duplicate requests and unnecessary re-renders — and added lazy loading, responsive image sizing, and CDN preloading for the library. The trickiest problem was attribution: Shopify's sandboxed Checkout Extensibility blocks a Custom Pixel from reading storefront storage directly, so I carried the platform's visitor and visit identifiers through as Shopify cart attributes into the order, then read them back from the checkout event to report completed sales without ever touching cross-origin storage.

3Shopify Plus storefronts
1Reusable component structure
A Team Sports America team collection page with faceted filters beside a grid of product cards

Faceted collection pages, rebuilt on the new search platform, on Team Sports America.

The Outcome

The finished integration powers search, autocomplete, facets, sorting, recommendations, merchandising landing pages, unified search, and uploaded-image search across all three stores, with dedicated search reporting the ecommerce team didn't have before. Pinning, boost/bury rules, filters, and landing pages moved out of routine development work and into tools the team could run themselves. To keep the whole thing safe to change, I built a cross-store Playwright suite covering search, autocomplete, recommendations, product-data mappings, image search, and add-to-cart — it has since caught real regressions during later changes and platform upgrades. Production rolled out gradually, shifting traffic from the old theme to the new one after development, QA, and UAT.