Revindex Storefront

How to change the number of grid columns

By default, the product list displays products arranged in grid view format of 2 columns. In order to change the number of columns, you need to:

  1. Create a custom display template from the Storefront's Configuration > Display templates menu.
  2. Select the "Product list" module control and Add new.
  3. Give the new custom display template a name (e.g. CustomProductList)
  4. Always choose the latest Base display template with the highest version number.
  5. Look for the following line and change the GroupItemCount attribute value to the number of columns you wish to render:
    <asp:ListView ID="ProductListListView" runat="server" GroupItemCount="2" OnPagePropertiesChanging="ProductListListView_PagePropertiesChanging"
    OnItemDataBound="ProductListListView_ItemDataBound" DataKeyNames="ProductVariantID"
  6. Save the display template.
  7. Under Configuration > Product list menu, set the Display template to your newly created custom display template.


Powered by Revindex Wiki