Modules

Commerce has a small set of modules that are used to extend the core functionality.

The modules are defined in the Embed and are configured with the Admin.

When no modules are specified Commerce runs as a headless e-commerce system with the API.

If multiple modules are enabled they are defined as a colon : separated list, for example:

data-modules="ui:button:analytics"

UI (User Interface)

The ui module enables the default User Interface.

This module should only be disabled if you plan to use the API to create your own interface.

The module is defined within the embed as:

data-modules="ui"

Analytics

The analytics module enables the pre-built Analytics Integrations.

It can be disabled if you're using other providers or if you plan to do your own custom integration.

The module is defined within the embed as:

data-modules="analytics"

Button

The module is defined within the embed as:

data-modules="button"

The Button module searches your pages for items with the matching data atributes and adds click handlers to them so that they work as add to cart buttons.

This removes the need to write your own JavaScript to call the Commerce.cart.add method.

The attributes are:

<div data-commerce-type="button" data-commerce-product="${productId}"></div>

If the item should also submit field values, supply data-commerce-fields:

<div data-commerce-type="button" data-commerce-product="${productId}" data-commerce-fields="${fields}"></div>