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

Featured collection slider

The Featured collection slider section displays products from multiple collections as a rotatable carousels. With Quick View enabled, customers can buy your products without leaving the page.

See the Featured collection grid to display your collections in multiple rows with adjustable columns.

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.

Steps

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 slider.

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

Select multiple Collections to display their products in a single row that customers can click through. You can also create a Manual product list instead of a collection.

Steps

In your theme editor (Customize):

  1. Click on a Collection block to open the block settings.

    Click + Add block to create new row items.

    Click Remove block or the eye icon to delete or hide a block.

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

    We recommend collections with at least 3 products.

  3. Enter the Collection name that displays as a link that customers can click to switch between collections in the section.

  4. For the Manual product list block, use the Select products button and check off all the products you want to display.

  5. 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.

Steps

  1. Click on the Featured collection slider 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.

Steps

  1. Click on the Featured collection slider 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.

Steps

  1. Click on the Featured collection slider 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 borders 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.

Contact

🇨🇦 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.