Collection product grid
Overview
Collection product grid adds a configurable collection product grid experience to your Radian storefront.
Customize Collection product grid
- From Shopify admin, go to Online Store > Themes, find Radian, and select Customize.
- Use the page selector to open the template that contains Collection product grid.
- Select Collection product grid in the template panel, adjust the settings, and select Save.
Section settings
LAYOUT
| Full width | Turns full width on or off. |
|---|---|
| Section layout | Choose from Page, Content, Narrow, Custom. |
COLOR
| Color scheme | Selects one of the color schemes configured in Theme settings. |
|---|
GRID LAYOUT
| Products per page | Adjusts products per page within the available range. |
|---|
PRODUCT CARD
| Use global settings | Turns use global settings on or off. |
|---|---|
| Corner radius | Adjusts corner radius within the available range. |
| Product card thumbnail ratio | Choose from Portrait (3/4), Square (1/1), Landscape (4/3), Landscape (16:9), Portrait (4:5), Portrait (9:16). |
| Hover effect | Choose from None, Instant, Fade image, Soft zoom, Curtain reveal. |
| Autoplay video | Plays a muted, looping Shopify-hosted video when it is the product's first media item. |
| Mobile quick view behavior | Choose from Always show quick view button, Open quick view on card tap, Reveal quick view button on card tap. |
QUICK VIEW BUTTON
| Corner radius | Adjusts corner radius within the available range. |
|---|---|
| Background color | Controls background color. |
| Icon color | Controls icon color. |
FILTERING AND SORTING
| Use global settings | Turns use global settings on or off. |
|---|---|
| Collection filters | Turns collection filters on or off. |
| Show sorting | Turns show sorting on or off. |
| Show filter and sort chevrons | Turns show filter and sort chevrons on or off. |
| Sort style | Choose from List, Inline. |
| Collection filter layout | Choose from Sidebar, Drawer, Dropdown toolbar, Sticky floating panel. |
| Sticky panel corner radius | Adjusts sticky panel corner radius within the available range. |
FILTER GROUPS
| Category filter | Turns category filter on or off. |
|---|---|
| Price filter | Turns price filter on or off. |
| Availability filter | Turns availability filter on or off. |
| Color filter | Turns color filter on or off. |
| Color swatches | Turns color swatches on or off. |
| Color filter layout | Choose from Vertical list, Dot grid. |
| Size filter | Turns size filter on or off. |
| Size filter layout | Choose from Checkbox list, Box grid. |
| Product type filter | Turns product type filter on or off. |
| Brand filter | Turns brand filter on or off. |
| More filters | Turns more filters on or off. |
PAGINATION
| Pagination type | Choose from Page numbers, Load more button, Infinite scroll. |
|---|
SECTION SPACING
| Desktop and mobile spacing | Sets top and bottom spacing independently for desktop and mobile. |
|---|
Add and arrange blocks
Select Add block to include the content required by the section. Drag blocks in the Theme Editor to change their storefront order.
AVAILABLE BLOCKS
| View by card styles | Adds and configures view by card styles content in this section. |
|---|
Recommended setup
- Choose the section width, layout, and color scheme before fine-tuning individual content blocks.
- Configure desktop positioning first, then switch the Theme Editor preview to mobile and adjust the mobile-specific controls.
- Check links, product or collection resources, and interactive controls before publishing the theme.
Conditional settings
Settings that depend on another option appear only when that parent option is enabled. If a control is missing, check the related layout, style, or enable toggle first.