Product listing

You can use Luigi’s Box Product Listing to retrieve and render products for any product listing. The typical use-cases are category and brand pages which your end-users browse when navigating your website.

The main benefits include personalized display of products, ranking based on analytics feedback, and powerful merchandising features available in the Luigi’s Box application.

Choose your integration path

Flexible path

Product Listing API

Use the HTTP API when you need custom category logic, hierarchical filters, and backend-level control over listings.

• Best for custom storefronts and backend rendering.
• Supports hierarchical listing logic well.
• Allows merging Luigi's Box data with internal sources.

Fast storefront path

Search.js

Use Search.js when you want to reuse Luigi's Box frontend components for category or brand pages on the web.

• Quick to launch on storefront pages.
• Reuses the same library as Search.js search pages.
• Good fit when the browser owns the UI.

Start here

Still choosing the architecture? Start with Understanding product listing.

Want the fastest storefront integration? Continue with Building a product listing page with Search.js.

Need full control over category behavior? Continue with Your first API-powered product listing.

Core concepts

• Personalized ranking: Products are ranked based on a feedback loop provided by analytics. This allows for a personalized display and respects all merchandising rules you have set up.
• Pairing: To use product listing, you must provide a mapping between categories and products. The default mapping expects your category object to contain an id attribute and your product object to contain a category_id attribute.
• Hierarchical filtering: When dealing with hierarchical categories, you can use special filters like category_path and all_categories_path. Individual categories in the hierarchy should be separated by a double pipe ||.