Introducing Stiletto - the essential Shopify theme to fuel your ecommerce growth. Learn more.

Featured collection grid

The Featured collection grid section displays a grid of products from one of your collections. With Quick View enabled, customers can buy your products without leaving the page.

See the [Featured collection slider][feature-collection-slider] to display your products as a rotatable carousel in one row.

Set up section

Add this section to any template (except Checkout) and re-order its position. You can use this section multiple times on the same page with different content and settings.

Note: New sections will appear on all pages that use the same template. To add sections to specific pages only, learn how to create and assign multiple templates.


In your theme editor (Customize):

  1. Select a Template to edit from the dropdown menu in the top bar.

  2. In the side panel, click (+) Add section and select Featured collection grid.

  3. Change the order of your sections by using the drag and drop handles ⋮⋮

Select a Collection to display its products in a grid with adjustable rows and columns.


In your theme editor (Customize):

  1. Click on the Collection block nested under the section.

  2. Use the Select collection button find the collection you want to feature.

    We recommend collections with at least 3 products.

  3. Click Save.

Product list style

Change the number of columns and rows, the shape of your product images, and set how many products to display from your collection.


  1. Click on the Featured collection grid and scroll down to the Product list settings.

  2. Use the slider to set the Maximum number of products to display from your collection. Between 3 and 15.

    The products will display in the sort order as set in your Shopify admin settings. Learn more about admin settings for your collection pages layout.

  3. Select the Number of columns to display for both desktop and mobile.

    The size of the product images will change according to the number of columns.

  4. Click on the Theme settings tab to select an Image aspect ratio. This setting applies to all sections that display products.

    Crop all images to Square, Landscape, or Portrait. The default Natural setting will display the original orientation of each image.

    Example of aspect ratio shapes: Square, Landscape, and Portrait
    Example of aspect ratio shapes: Square, Landscape, and Portrait
  5. Click Save.

Section headings and button

Add section headings and an optional button that can link to your collection or another page.


  1. Click on the Featured collection grid section to open the section settings.

  2. Enter Heading text to display a section title in the top-left.

    The default heading is "Featured collection."

  3. Enter Subheading text to display below the heading.

    Use the formatting buttons to add bold, italic, or linked text.

  4. Select or paste a URL for the Button Link.

  5. Enter short text for the Button label.

    Leave this field blank to remove the button.

    The most effective button labels ask customers to do something (e.g. Get started, Join us, Shop now). To learn more, read "What is a Call to Action?"

  6. Click Save.

Section style

Adjust the overall style by changing the Padding around the section content, and add an optional Top divider to clearly separate sections.


  1. Click on the Featured collection grid section and scroll down to the Section style settings.

  2. Choose to display a Top divider that separates sections with a Solid line.

    The Top divider uses the Lines and border color selected in the Theme Settings.

  3. Select a Padding option to add space around the section to either the Top and bottom, Top only, Bottom only, or set it to None.

  4. Click Save.


🇨🇦 Fluorescent Design Inc.

Send us a message
  • Toronto OfficeMonday to Friday, 10am to 6pm ET
  • Victoria (B.C.) OfficeMonday to Friday, 10am to 6pm PT
  • Average Response Time~1 Business Day
* Excludes statutory holidays. All offices closed to the public.