Product Catalog is a detailed list of the inventory of a store. On the Catalog, you can see the products that your vendor offers. The product catalog displays the products that are available for purchase as well as their details such as the product's name, code, price, and specifications. You can also add products to the cart from the catalog page. The product catalog has many features to assist users in searching for and selecting products.

As an experienced buyer, you can also use the Quick-Add () button to add multiple products to the cart and create quotes and orders quickly. For more information, see Using CTA (call-to-action) "Quick-Add" button.

You can access your Orders, Quotes, Carts, and Favorites directly from the catalog page by clicking the appropriate link available under the Accounts dropdown. For more information, see Launching Digital Commerce.

The following API is used to get the active products associated with the provided price list ID for the selected account. For more information, click here.

POST https://<URL_of_the_Instance>/api/catalog/v1/search

For example: https://<URL_of_the_Instance>/api/catalog/v1/search?search-type=Product&includes=prices&page={pageNumber}&limit={pageLimit}

You can also use visibility rules to show only the relevant categories and products to specific users. For more information on how to set visibility rules, click here.

View Options

On the product catalog, you can view products in a variety of ways. There are two view options available on the product catalog page:

List View

To switch to the list view, click the list view () icon in the bar above the product list. The list view arranges the products in a list, just below each other.

Grid View

To switch to the grid view, click the grid view () icon in the bar above the product list. The grid view arranges the products side-by-side, like a grid.

Filter Products

Since the catalog page displays the entire product inventory, you can use filters to find the right product. 

The following API is used to get the products associated with the selected filter option. For more information, click here.

POST https://<URL_of_the_Instance>/api/catalog/v1/search

For example: https://<URL_of_the_Instance>/api/catalog/v1/search?search-type=Product&includes=prices&page={pageNumber}&limit={pageLimit}

The category hierarchy allows you to navigate to products by browsing the related categories, their subcategories, and facet filters. The list of subcategories and facet filters appears only after you select a category.

The following filed types are supported for facet filters. For example, to filter out a product, we can have two facet filters such as Configuration Type (Boolean: standalone or bundle), and Family (Picklist: software, hardware, and other):

  • Picklist
  • Multipicklist
  • Boolean

The implementor can use the SearchFilterFields option to display the number of facets for the particular category. For example, if you want to use the Product Family and Configuration Type facets, pass  "SearchFilterFields": ["Family", "Configuration Type"]. For more information, click here.

Data translation in Catalog allows you to display modules and elements as per preferences and locales. Currently, data translation is available for the Catalog and its modules (Product, Category, OptionGroup, Attribute, and AttributeGroup), as well as elements (product names, line item fields, categories, and rule messages). For more information, see Setting Up Multi-language Support.

Example:

When you set the catalog's locale to Chinese, it displays product details and other elements in Chinese.

Actions on the Product Catalog Page

Sorting

Sort By allows you to sort the products on the product catalog page. You can sort the product by Name or Relevance.

Pagination

Pagination allows you to specify how many products should be displayed on a single page. To set pagination, go to the Show field on the top bar and choose from 4, 12, 20, or 50 products on one page.

The following APIs with the page, limit, and sort parameters are used for sorting and pagination.

With filter

GET https://<URL_of_the_Instance>/api/catalog/v1/categories/{categoryId}/products

For example: https://<URL_of_the_Instance>/api/catalog/v1/categories/{categoryId}/products?sort=ASC(Name)page={pageNumber}&limit={pageLimit}

Without filter

GET https://<URL_of_the_Instnace>/api/catalog/v1/products

For example: https://<URL_of_the_Instance>/api/catalog/v1/products?sort=ASC(Name)&page={pageNumber}&limit={pageLimit}

Viewing product details

Click the product's name or image to view more information about it, such as its configurations, specifications, features, or pricing. 

The following API with the page, limit, and sort parameters is used to get the product details. For more information, click here.

GET https://<URL_of_the_Instance>/api/catalog/v1/products/{productId}

The implementer can also set up a Based on Pricelist to cater to geographical or customer-specific adjustment differences of the prices in the catalog. For more information, see Configuring the Price Lists.

Adding product(s) to the cart

You can add a product or multiple products to your cart for purchase by following any of the following paths. Before adding the product to the cart, you can also specify the quantity in the Quantity field.

  • Click Add to Cart for the particular product.

  • Every product card in the catalog has a checkbox beside it. Selecting the checkbox opens a drawer with a list of selected products. You can also use the Select All option to select all products displayed on the catalog page (based on the pagination selected per page) or remove some products and then add the rest of the products to the cart. From the Selection action, select Add to Cart and click Confirm to add the selected products to the cart.

    Although there is no limit to the number of products that can be added to the cart at once, it is recommended that you add up to 50 items to avoid operations failing or taking too long to finish.


The following API is used to add the product to the cart. For more information, click here.

GET https://<URL_of_the_Instance>/api/carts/v1/carts/{cartId}/items

If the price process of the cart takes longer than expected, the application attempts to fetch the cart status again for the number of retry attempts and inter-attempt delay specified in the cart status retry settings. If pricing the cart takes longer, these options are presented:

  • Check Status: The application retries the cart status fetch, doubling the number of retry attempts specified while configuring cart pricing status retry settings. For example, if you set 5 retry attempts, the application attempts 10 retries.
  • Abandon Cart: Deactivates the current cart and creates a new one. You can then add the products again into the new cart.

Product Drawer

On the Product Catalog page, all the selected products are displayed in the Product Drawer. You can also view more information about the product by clicking the product's name or image. You can clone the line items, create a favorite configuration, and compare products as well. For more information, see  Cloning Primary Line Items, Managing Favorites, and Comparing Products.

Select one of the following topics for more information on Catalog operation: