Customize the shop page

Store owners and marketplace admins use the page builder to customize the shop page, the storefront page where customers browse and filter products. The Shop template includes filters for price, availability, rating, and brand, along with product and collection grids.

1. Go to Designs → Themes.
2. Select Customize on your current theme card.
3. Select the Shop template, then select Edit.

The template list shows each page template you can customize.

The editor’s left INSERT panel has a block search and groups of blocks. Search for a block by name, or browse the groups.

The Template blocks group includes blocks for the shop page:

• Price Filter lets shoppers filter products by a minimum and maximum price.
• Availability Filter lets shoppers filter by In Stock, Out of Stock, or Unmanaged products.
• Rating Filter lets shoppers filter by average rating.
• Brand Filter lets shoppers filter by brand.
• Blog List shows a list of blog posts.

Drag a block from the INSERT panel onto the page to place it.

The Product Grid block, in the Ecommerce group, displays products in a grid.

1. Search for Product Grid in the INSERT panel and drag it onto the page.
2. Choose the layout, then set the number of columns and rows.
3. Choose which product card elements to show, such as the image, title, price, rating, and add-to-cart button.

On the storefront, shoppers see a Sort by option and a count such as Showing x of y results above the products.

The Collection Grid block, also in the Ecommerce group, shows collections of products.

1. Drag Collection Grid onto the page.
2. Choose the number of columns and rows.
3. Select whether to show all collections or selected collections, then choose whether to show each collection’s image, title, and product count.

• The Breadcrumb block, in the Site group, shows shoppers where they are on the site and lets them move back up the path.
• The Dropdown block, in the Basic group, opens a menu when clicked. Add Link blocks inside it to build the menu items.

1. Use the Desktop, Tablet, and Mobile buttons at the top of the editor to check how the page looks at each size.
2. Select Save in the top bar.

• Page builder overview
• Customize the home page
• Customize the single product page
• Create a collection of products