Vue Storefront is now Alokai! Learn More
Quick Start

Quick Start

This guide assumes that you already have a good understanding of how Coveo works, as we will not cover the basics of Coveo in this guide. If you are not familiar with Coveo, we kindly recommend starting with the Coveo documentation.

Typical integration of the Coveo search engine into your Storefront consists of the following steps:

  1. Indexing your products in Coveo
  2. Configure mappings and AI models in the Coveo Admin Console
  3. Implement normalizers on the middleware (optional)
  4. Configure engine settings in the Storefront
  5. Configure facets and additional search features in the Storefront

We will guide you through the process of integrating Coveo into your Storefront and explain the steps in detail.

Index data products in Coveo

This is something you will need to handle on your own. Because we do not know upfront on what platform you are running your store, we cannot provide a one-size-fits-all solution for this. However, we can provide you with some general guidelines on how to index your products in Coveo.

The first step is to understand how to index your products in Coveo. You can find more information in the Indexing documentation. Once you get familiar with the indexing process, we strongly recommend to use native Coveo sources for indexing your products. You can find more information in the Sources documentation.

This process must be done before you can proceed with the next steps.

For the SAP Commerce Cloud integration we strongly recommend to use SAP Source. It is a specialized source that is designed to work with SAP Commerce Cloud and it is optimized for the best performance and relevancy.

Configure mappings and AI models in the Coveo Admin Console

Once you have indexed your products in Coveo, you can start configuring mappings and AI models in the Coveo Admin Console. This is a crucial step in the process of integrating Coveo into your Storefront. You can find more information in the Manage Source Mappings documentation.

It is up to you how you want to configure mappings however, Alokai storefront is designed to work with a very specific set of fields. If you want to plug in Coveo into Alokai without a need to implement normalizers on the middleware, you should configure your mappings to match the fields that Alokai storefront expects:

{
  'ec_code', // sku of the product
  'ec_name', // name of the product
  'ec_slug', // slug of the product
  'ec_images', // string with image or array of images
  'ec_category', // array of categories prepared for hierarchical facets (check example below)
  'ec_price', // price of the product
}

Additionally you can have multiple facets, for example To find more about facets configuration, please refer to the Facets configuration.

{
  ...
  'ec_color', // array of colors
  'ec_size', // size of the product
  ...
}

Below you can find a sample index document that you can use as a reference:

{
  "ec_images": "/medias/?context=bWFzdGVyfGltYWdlc3w3MTg2M3xpbWFnZS9qcGVnfGFEYzNMMmc1TlM4NE56azJPVEV3T0RRMU9UZ3l8NjgxZTI1NWJlNDZjNjVjNmZiZjM4NTJiZjRjYmJjZmI1NGEzZTdhN2Y4NGZmMzAzNTQxYWRiNGI0OTBlZjJiYw",
  "urihash": "ZYObv7pr9H2ASoyA",
  "ec_price": 2513,
  "ec_code": "300786366",
  "printableuri": "https://b2c.c1jvi8hu9a-vsfspzooa1-d1-public.model-t.cc.commerce.ondemand.com/apparel-uk-spa/Brands/Volcom/Rocking-2-Creedlers-Women/p/300786366",
  "permanentid": "fc7206b733c14348a2640ba567e6f50994402e004a88baa6a99ab9410929",
  "syslanguage": ["English"],
  "ec_price_eur": 1795,
  "ec_color": ["purple"],
  "transactionid": 5357,
  "title": "Rocking 2 Creedlers Women purple combo 5.0",
  "ec_brand": ["Volcom"],
  "date": 1710501230000,
  "objecttype": "product",
  "rowid": "1710501230546983478",
  "ec_store": [
    "Edinburgh University",
    "Glasgow Hospital",
    "Manchester United FC"
  ],
  "size": 101,
  "ec_name": "Rocking 2 Creedlers Women purple combo 5.0",
  "clickableuri": "https://b2c.c1jvi8hu9a-vsfspzooa1-d1-public.model-t.cc.commerce.ondemand.com/apparel-uk-spa/Brands/Volcom/Rocking-2-Creedlers-Women/p/300786366",
  "orderingid": 1710501220631,
  "wordcount": 12,
  "ec_slug": "300786366-rocking-2-creedlers-women-purple-combo-5-0",
  "ec_category": [
    "categories",
    "categories|400000",
    "categories|400000|400300",
    "categories|clothes",
    "categories|clothes|shoes",
    "categories|clothes|shoes|sandals",
    "categories|clothes|shoes|sandals|400300"
  ],
  "source": "SAPCC Apparel UK",
  "collection": "default",
  "indexeddate": 1710501230000,
  "filetype": "txt",
  "ec_category_name": "Shoes women Sandals women Clothes Sandals Categories Shoes",
  "ec_price_gbp": 1454,
  "language": ["English"],
  "ec_size": "5.0",
  "uri": "https://b2c.c1jvi8hu9a-vsfspzooa1-d1-public.model-t.cc.commerce.ondemand.com/apparel-uk-spa/Brands/Volcom/Rocking-2-Creedlers-Women/p/300786366",
  "ec_gender": "female"
}

If you decide to use a different source, like the push-api, you will have to handle proper indexation on your own. This mean that you will have to pay attention to e-commerce specific fields and data that are required by the Coveo AI but are not required by the Alokai storefront.

(optional) Implement normalizers on the middleware

If you decided to use a different data model than we recommend, you will have to implement normalizers on the middleware. This is a crucial step in the process of integrating Coveo into your Storefront. We will not cover this topic in this guide.

Configure engine settings in the Storefront

Once you have indexed your products in Coveo and configured mappings and AI models in the Coveo Admin Console, you can start configuring engine settings in the Storefront. This is a crucial step in the process of integrating Coveo into your Storefront. You can find more information in the Engine settings documentation. Most likely, if you are using our default model recommendation, the only thing you will need to do is to provide API keys and organization ID.

Configure facets and additional search features in the Storefront

Additionally, you must configure facets and additional search features in the Storefront. You can find more information in the Configuration Files documentation.

Summary

This guide should give you a good understanding of basic steps required to integrate Coveo into your Storefront. If you have any questions, feel free to ask us on our Discord.