Just like the home page's Grid section, product pages in Superstore can feature promotional blocks in a Grid section. Combine images, messaging, and links to connect customers to other areas of your store.
Enable the Grid section
Go to Customize > Select Product page from the page dropdown > in the left-side settings controller, open Grid > Enable grid
This section appears on all product pages when activated.
Include optional headings
Add text to introduce the Grid section using the Heading and Subheading fields.
Customize the section's appearance
Use the rounded-rectangle swatch selectors to change the colors used in the section.
Adjust the section spacing for desktop and mobile using the provided sliders.
Depending on the images used, select Maintain aspect ratio to reduce cropping.
For a more minimal layout on mobile, select Compress blocks.
Add the blocks
The section will have two blocks loaded by default. Click these to open their settings. To add more, click [+] Add grid tile. To remove a block, open the block, then select Remove content at the very bottom.
Add media and messaging
For each block, assign the desired Image by clicking Select image. Then add a Heading, Text, Link, and Button text using the text fields.
Customize the block's styling
Configure the block’s Text color using the rounded-rectangle swatch, then choose a Button style from the dropdown.
Use the Width dropdown to control the horizontal space occupied by the block. Half width will include two blocks per row, while Full width spreads the block across the width of the section.
Add an overlay
Activate an overlay, by selecting either Solid or Gradient from the Overlay style dropdown. Then determine the Color with the rounded-rectangle swatch and level of Opacity using the slider.