Collection carousel

This guide describes setting up the Collection carousel section.

Use the section on a page to display products from a collection, arranged in a carousel layout.

For general guidance with modifying sections, refer to Sections overview and Shopify help: Sections and blocks.

Set up a Collection carousel section

To set up a Collection carousel section:

1. In Theme editor, at the top of the page, use the theme templates dropdown menu to select a page that contains a Collection carousel section.

   Note

   The section can be added into any page, except Checkout and Gift card pages. To add the section into the current page, select Add section > Collection carousel. Refer to Shopify help: Add a section.

2. From the side menu, select Collection carousel.

3. Select a setting described in the following table.

Setting name	Description
Collection	Use the Collection picker to set up a collection to display inside the section.
Product tile type	Use the Product tile type options to specify the type of product tile to display inside the section. The options are Standard or Text overlay. With Standard product tiles, product details, like product title and price, are displayed below the section's product images. With Text overlay product tiles, product details overlay the section's product images.
Product limit	Adjust the Product limit slider to specify the maximum number of products from a collection to display inside the section. The minimum number is 5 and the maximum is 20.
Product tiles > Use custom image crop	Select the Use custom image crop option to turn on or off custom image cropping for the section's product tile images. With this option enabled, the cropping shape you select for the Image crop option is applied to the section's product tile images.
Product tiles > Image crop	Use the Image crop options to set a cropping shape for the section's product tile images. The options are Natural, Square, Landscape, and Portrait. To use this option, enable the Use custom image crop option.
Product tiles > Image crop style	Use the Image crop style options to set a Fill or Fit style for displaying cropped images inside the section's product tiles. To use this option, enable the Use custom image crop option and set the Image crop option to Square, Landscape, or Portrait.
Product tiles > Mobile width	Use the Mobile width options to specify a width for the section's product tiles on mobile display devices. The options are 60%, 80%, and 100% (percentage the width of the section).
Product tiles > Desktop width	Adjust the Desktop width slider to specify a width for the section's product tiles on desktop display devices. The slider ranges from 20% to 40% (percentage the width of the section).
Quick buy > Enable quick buy	Use the Enable quick buy option to show or hide a "Choose options" button on product tiles inside the section. A store visitor uses the button to choose product options, like variants, to add to the cart. To use this option, set the Product tile type to Standard.
Header > Subheading	In the Subheading field, enter text to display as a subheading for the section. Note that the Subheading field is hidden in Theme editor when the Heading field is empty.
Header > Heading	In the Heading field, enter text to display as a heading for the section.
Header > Show "View all" link	Use the Show "View all" link option to show or hide a link inside the section for accessing an entire collection.
Header > Show collection products count as superscript	Use the Show collection products count as superscript option to show or hide a number inside the section. The number is displayed as superscript and indicates how many products there are in a collection.
Color > Color scheme	Use the Color scheme picker to select a color scheme for the section. Refer to Colors.
Theme settings	If available, select Theme settings to access additional settings for the section. Refer to Section theme settings menu.
Custom CSS	Select Custom CSS. In the CSS field, enter custom CSS styles to apply only to the current section. Refer to Shopify help: Add custom CSS. To apply custom styles to your entire online store, refer to Theme settings > Custom CSS.
Remove section	Select Remove section to delete the section from the current page.

Note

To connect a metafield to a setting that supports metafields, select the Connect dynamic source icon displayed beside the setting in Theme editor.

To learn how to connect a metafield to a supported setting, refer to Shopify help: Connecting metafields to your theme by using the theme editor.