Navigation

Add to cart

Configure Actions to allow adding to cart. Note that you would have to provide the code for the action, e.g. an API call for you cart API.

<script>
function LBInitAutocomplete() {
  AutoComplete({
    Layout: 'heromobile',
    TrackerId: '179075-204259',
    Locale: 'en',
    Translations: {
      en: {
        types: {
          item: {
            name: "Products",
            heroName: "Top product"
          },
          query: {
            name: "Searches"
          },
          category: {
            name: "Categories"
          }
        }
      }
    },
    Types: [
      {
        type: 'product',
        size: 7
      },
      {
        type: 'query'
      },
      {
        type: 'category'
      }
      ],
       Actions: [
        {
          forRow: function(row) {
            return row.type === 'product'
          },
          iconUrl: '/buy.jpg',
          title: 'Add to cart',
          action: function(e, result) {
            e.preventDefault();
            alert("Product added to cart");
          }
        }
      ]
  }, '#q')
}
</script>

<script src="https://cdn.luigisbox.com/autocomplete.js" async onload="LBInitAutocomplete()"></script>
<link rel="stylesheet" href="https://cdn.luigisbox.com/autocomplete.css"/>

Previous example
Customizing no results message
Hero layout examples

Try it out →

Next example
Customizing attributes
Hero layout examples

Try it out →