Appearance
Collection focus carousel ​
This guide describes the Collection focus carousel section.
For general guidance with modifying sections, refer to Sections overview, and Shopify help: Sections and blocks.
Configure the Collection focus carousel section ​
To configure your Collection focus carousel section:
Go to Customize theme.
In Theme editor, at the top of the page, use the dropdown to select a page that contains a Collection focus carousel section.
Note
The section can be added into any page, except Giftcard and Customer pages. To add the section into the current page, select Add section > Collection focus carousel. Refer to Shopify help: Add a section.
From the side menu, select Collection focus carousel.
Select a setting described in the following table.
| Setting name | Description |
|---|---|
| Heading | In the Heading text box, enter text to display as title text inside the section. |
| Subheading | In the Subheading text box, enter text to display as subtitle text inside the section. |
| Collection | Use the Collection selector to select a collection to display inside the section. |
| Number of products | Adjust the Number of products slider between 4 and 18 products. The section displays the specified number of products from your chosen collection. |
| Focused slide content > Source | Use the Source options to specify a source of content for the section's focused slide. Set the source to the (product) Description or a specific Metafield. Alternatively, to turn off the source, select None. |
| Focused slide content > Metafield namespace and key | In the Metafield namespace and key text box, enter a metafield namespace and key. Use this option to display content from a metafield on the section's focused slide. For example, enter custom.highlight. To use this option, set theSource option to Metafield. |
| Layout > Display product tiles on cards | Set the Display product tiles on cards checkbox to on or off. |
| Layout > Enlarge active slide | Set the Enlarge active slide checkbox to on or off. |
| Carousel > Mobile slide width | Use the Mobile slide width options to select 3/5 or Full. This option applies to mobile display devices, when layout is set to Grid. |
| Carousel > Desktop slide width | Adjust the Desktop slide width slider between 20 and 60 percent. This option applies to desktop display devices, when layout is set to Grid. |
| Product grid > Image aspect ratio | Use the Image aspect ratio options to select Same as theme settings, Natural, Landscape, Square or Portrait. |
| Product grid > Image shape | Use the Image shape options to select a shape. For example, select Same as theme settings, Default, or Rounded nonagon. |
| Color > Color scheme | Use the Color scheme selector to select a color scheme. |
| Color > Theme settings (link) | Follow the Theme settings link to open Theme editor's Color theme settings. Use the settings to edit the theme colors for your entire store. |
| Color > Use gradient for background | Set the Use gradient for background checkbox to on or off. |
| 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 box, 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. |
Configure a block within a Collection focus carousel section ​
To configure a block for your Collection focus carousel section:
Go to Customize theme.
In Theme editor, at the top of the page, use the dropdown to select a page that contains a Collection focus carousel section.
From the side menu, expand the Collection focus carousel section menu.
To configure an existing block, select the block from the side menu.
To add a new block, select Add
block-name, and then select the block you added.Note
Inside the section, you can add, remove, show, hide, and move blocks. Refer to Configure blocks inside a section, and Shopify help: Sections and blocks.
Apply a block setting described in the following table.
| Block name | Block description | Block setting(s) |
|---|---|---|
| Background pattern | Displays a stylistic pattern as a background inside the section. | Refer to Background pattern. |
| Background shape | Displays a stylistic shape as a background inside the section. | Refer to Background shape. |
| Sticker | Overlays the section with a stylized sticker. | Refer to Stickers. |
| Shape divider | Displays a stylized separator between the current section and the next/previous section. | Refer to Shape divider. |