Create a grid of customizable blocks of different sizes. The grid section is a great way to break up the look of your page and set apart your store.

Key components

  • Layout and design: Use the individual block settings to change the layout of the entire section.

  • Display essentials: For the best look ensure that the combined width of all blocks on each row is equal to 100% (or as close as you can get). For example, you can use 2 blocks with 25% width and 1 block with 50% width to fill out a row.

  • Text and call to action: Define your block headings and customize the main buttons to invite users further into your store pages.

Using one 33% and one 66% wide block will fill out a row perfectly.

Configuring your section: Settings overview

In the section settings, you’ll find common options like button colors and styles. However, this section's uniqueness lies in its versatile blocks and their settings.

  • Block types: Explore four types of blocks, each with unique settings:

  1. Collection: Showcase and link to collection pages.

  2. Product: Directly link to product pages, including product price display.

  3. Image: Use for visuals or to link to store pages.

  4. Text: For speedy links to store pages.

  • Block width: Customize individual block widths to control screen space, enabling distinctive grid layouts.

Last updated