How to find these settings...
- Online Store
- Customize (Theme Editor)
- Theme settings
- Product grids
The Product Grid options contain features that are similar to Product Pages & the Featured Product section. This will allow you to customize your product selection in the sections and product pages plus whenever the product grid is used. When adjusting these settings, it is suggested to use one of these product grid examples:
- Section product grids like Featured Collection and Product List
- Product page Related Products
- Collection product grid
Recommended reading
- Products
- Product media
- Creating custom metafield definitions
- Shopify Search & Discovery app
- Adding values to metafields
- Setting sale prices for products
- Uploading files to your website
In this section...
Media
Insta filter
App like filters can be applied to your images
Image aspect ratio
The image has 4 options for display:
- Natural: Uses the height of the image
- Short (4:3): A landscape format will be applied
- Square (1:1): A square format will be applied
- Tall (2:3): A vertical format will be applied
Enable image crop
The image will crop to fill up the container format chosen with 'Image aspect ratio'. NOTE: If disabled, white space will be applied around the image. Has no effect when media aspect ratio is set to 'Natural'
Show second product image on hover
If enabled and there is more than 1 product image, on rollover the second image will be displayed
Options
Show badges
Display badges for on sale or out of stock products
Text/Heading alignment
Text can be aligned to the left, right or centered to the container
Show product vendor
Displays the manufacturer, wholesaler, or other vendor for the product
Heading font
Choose either the 'Primary' or 'Secondary' heading font set in Theme Settings > Typography
Heading size
Set the heading size with the slider. 12px is the minimum, and it steps up by 1 to a maximum of 30px
Show product meta data
Requires a metafield. Copy the 'Namespace and key' and separate each with a comma.
Show out of stock product transfer message
Inventory transfers can be automatically displayed. Learn more about transfers from suppliers
Icon/Content separator
Select an icon to be used from the preset list. You can view the icons on the 'What Icons are Included?' FAQ page
Icon color
Preferred color of the icon. Defaults to the color assigned to the Headings color
Icon highlight color
Some icons have elements that can be assigned a different color. Defaults to the Accent color
Custom icon
Add your own icon. It is recommended to use an SVG or PNG file to keep the icons sharp
Icon size*
Set the icon size with the slider. 10px is the minimum, and it steps up by 1 to a maximum of 30px
Color swatches
'Swatches' can be customized with Category Metafields. Choose from 1 of 4 options:
- None: Do not display color swatches
- Swatch: Show colors based on the swatch set in the Search & Discovery app
- Variant image: Display the variant image associated with the variant. If an image is not available, it will default to the color
- Magnified variant image: Display the zoomed in variant image associated with the variant. If an image is not available, it will default to the color
Enable rounded swatches
Buttons can be sharp edged squares or rounded circles
Show original sale price
Display the original price when a product has a manually set sale price
Show product rating
Display the product rating based on reviews collected from review apps
NOTE: Requires a product review app, and metafield definitions for 'reviews.rating_count' and 'reviews.rating'.
* NOTE: May not be available on all sections, blocks or templates