Enable SKU in predictive search

Enable SKU in predictive search

In predictive-search.js, add the following:

Idea
const url = new URL(Theme.routes.predictive_search_url, location.origin);
    url.searchParams.set('q', searchTerm);
    url.searchParams.set('resources[limit_scope]', 'each');
    url.searchParams.set('resources[options][fields]', 'title,product_type,variants.title,vendor,variants.sku');

    const { predictiveSearchResults } = this.refs;

    const abortController = this.#createAbortController();

    • Related Articles

    • Change predictive search image to square

      In predictive-search-products-list.liquid, search for "image_aspect_ratio:" and change all to 1 / 1 ratio.
    • Dynamic SKU on product page

      In edit code, add the following liquid in Block. {% doc %} @prompt Create a dynamic SKU display that automatically updates when product variants are changed without requiring a page refresh. The SKU should be visible on the product page and change ...
    • Hide products from Google & Shopify Search

      1. Access Your Shopify Admin Log in to your account to enter the backend of your store. Familiarize yourself with the intuitive Shopify admin page and interface, setting the stage for effortless product management. Think of it as your store's control ...
    • Hide mega menu links that contain 0 product

      Add the following in the mega-menu-list.liquid {% for childLink in link.links %} {% if link.type == 'collection_link' %} {% assign collection = link.object %} {% if collection.products_count > 0 %} {% assign break_after_modulo = forloop.index | ...
    • Make mega menu list scrollable (overflow)

      At the header section, add the following css .mega-menu { max-height: 70vh; overflow-y: auto; }