Skip to main content
Version: next

Add a sorting method in your Product List Page

This guide explains how to add a sorting criteria to your Product List Page (PLP).

Set an attribute as sortable​

In Magento1 back office, navigate to Catalog > Attributes > Manage Attributes. In the list shown, find the attribute you want to set as sortable (i.e. news_from_date), and click on it. Scroll down to section Frontend Properties, and set Used for Sorting in Product Listing to "Yes".

Screenshot of Magento1 attribute set as sortable

Add sorting attribute in your theme​

In order to add a new sorting attribute to your PLP, you can theme/modules/Layer/LayerSorting/useOptions.js like so:

app/theme/modules/Layer/LayerSorting/useOptions.js
import useDefaultOptions from "@front-commerce/theme/modules/Layer/LayerSorting/useOptions";

const useOptions = () => {
  const defaultOptions = useDefaultOptions();
  return {
    ...defaultOptions,
    sortOptions: defaultOptions.sortOptions.concat([
      {
        label: "New",
        value: "news_from_date",
      },
    ]),
  };
};

export default useOptions;

After these steps, you should be able to use your attribute to sort your PLP:

Screenshot of the theme featuring a new sorting attribute