Skip to content

What does the addToCart callback function look like for Live Search?

We are working toward enabling the Live Search Product Listing Page Widget on our Web site. I am trying to add a callback function to the storeDetails const in dev-template.html. What should it look like?

/storefront-product-listing-page-main/dev-template.html

<script type="text/javascript">
const root = document.querySelector('div.search-plp-root');
const storeDetails = {
  environmentId: 'xxxxx',
  websiteCode: 'xxxxxxx',
  storeCode: 'main_website_store',
  storeViewCode: 'default',
  config: {
    minQueryLength: '2',
    pageSize: 8,
    perPageConfig: {
      pageSizeOptions: '12,24,36',
      defaultPageSizeOption: '24',
    },
    currencySymbol: '$',
    currencyRate: '1',
    displaySearchBox: true, // display search box
    displayOutOfStock: true,
    allowAllProducts: false,
    addToCart: (sku, options, quantity)=>{console.log("hi" + sku + 'op' + options + 'qty' + quantity)},
  },
  context: {
    customerGroup: 'General',
  },
  apiKey: 'search_gql',
  environmentType: 'Testing',
};
</script>

When I push this up to my Staging site, I am not getting my message written to console. I don’t know if I’ve written the function wrong or if it’s in the wrong place or what …

Ultimately, we’d like to add a function that will trigger and send data to GTM. I am aware that it is currently a limitation of Live Search.

enter image description here