Skip to main content
Version: next

Magento 2

This guides explains how to configure the Algolia extension with a Magento 2 backend using the Algolia Magento module.

Magento 2 requirements​

On Magento's side, you need to install and configure the Algolia module for Magento 2.

In addition, the attribute category_ids must be configured as both an indexed attribute and as a facet:

  1. under Stores > Configuration > Algolia Search > Products, add category_ids as Searchable in the Attributes parameter
  2. under Stores > Configuration > Algolia Search > Instant Search Result Page, add category_ids in the Facets parameter

You can then run the indexer so that the products are indexed in Algolia's index.

note

category_ids is the only required facets. Depending on your project, you can configure any other attribute to be exposed as a facet by following the same steps.

Front-Commerce​

After installing the Algolia package, you need to enable the corresponding extension. For that, you need to tweak your front-commerce.config.ts file like:

front-commerce.config.ts for a Magento 2 based project
import { defineConfig } from "@front-commerce/core/config";
import themeChocolatine from "@front-commerce/theme-chocolatine";
import magento2 from "@front-commerce/magento2";
import algolia from "@front-commerce/algolia";
import storesConfig from "./app/config/stores";
import cacheConfig from "./app/config/caching";

export default defineConfig({
  extensions: [
    algolia("magento2"), // ⚠️ need to be before magento2()
    magento2({ storesConfig }),
    themeChocolatine(),
  ],
  stores: storesConfig,
  cache: cacheConfig,
  configuration: {
    providers: [],
  },
});
Known issue

The Algolia extension definition needs to appear before the one for Magento in the extensions array.

Front-Commerce retrieves the following parameters from Magento:

On the configured facets, only the attribute name and the facet type are taken into account (Label, Searchable and Create Query rule are ignored for now).

caution

For performance reason, the configuration retrieved from Magento is cached. As a result, after changing a parameter in the backoffice, the new parameter will be taken into account after at most one minute by Front-Commerce.

Test it​

To make sure Algolia APIs and indices are properly used, you can restart Front-Commerce with the DEBUG environment variable containing front-commerce:algolia so that it displays various information on the requests:

Run Front-Commerce with Algolia's debug flag
DEBUG=front-commerce:algolia pnpm run dev

After restarting Front-Commerce, you should be able to run a GraphQL query to search for products, categories or pages, for instance:

http://localhost:4000/graphql
query Search {
  search(query: "whatever you want to search for") {
    query
    products(params: { from: 0, size: 5 }) {
      total
      products {
        sku
        name
      }
    }
    categories(size: 5) {
      name
    }
    pages(size: 5) {
      title
    }
  }
}