Product grid

Product grid section settings

SettingDescription

Products per page

The number of products that you want to display on each page. From 9 to 27. Defaults to 15.

Number of columns on desktop

Use the range scale to select the number of columns that display on desktop computers. Minimum is 2, maximum is 4.

Image ratio

The image ratio for the product images:

  • Adapt to image (default) - Uses the aspect ratio of the images. This prevents the images from being cropped.

  • Portrait - Crops the images to use a 2:3 ratio.

  • Square - Crops the images to use a 1:1 ratio.

Show second image on hover

When the customer hovers their cursor over the product image, displays the second product image if the product has one.

Show vendor

Displays the vendor for each product.

Enable quick add button

The quick add button allows customers to add an item to their cart from the product card. If the product has variants, then the button will read Choose options and display the product details in a pop-up, where the customer can select the desired variants, add the item to cart, checkout immediately with Buy it now, or click to view the item's full details. Note that this setting is dependent on the Buy it now button being activated on your product page. If Buy it now button isn't activated on the product template, then customers have the option to add the product to their cart, but the quick Buy it now checkout workflow doesn't display. The Desktop media position setting for the page determines which side the media displays on in the quick add modal.

Enable filtering

Lets customers filter the products in the collection based on the filters in your Navigation settings.

Desktop filter layout

Choose between a horizontal (default), vertical, or drawer layout.

Enable sorting

Allows customers to sort search results.

Number of columns on mobile

Set a specific column layout for mobile devices. Choose between 1 and 2 columns.

Section padding

Add spacing to the top or bottom of the product grid. Use the range slider to add between 0px and 100px of space above or below the product grid.

SettingDescription

Banner position

Set the position for the banner on the collection page. From 1 to 25. Banner position must be less than the number of products per page.

Image

Upload image for the banner block

Image ratio

The image ratio for the product images:

  • Adapt to image (default) - Uses the aspect ratio of the images. This prevents the images from being cropped.

  • Portrait - Crops the images to use a 2:3 ratio.

  • Square - Crops the images to use a 1:1 ratio.

Heading

The title of the block.

Button label

The text of the button

Button link

The link of the button

Button style

Select the style for the button. Choose between Filled, Text link, or Outlined.

Last updated