Featured collection
Last updated
Last updated
In the editor side panel, click (+) Add section and select Featured collection. Click and hold the drag handles ⋮⋮ to re-order sections.
Editing a template will change all pages that use that template.
Create and assign new templates to design different page layouts.
Add dynamic content to show page-specific content in the same template.
Click the section to customize the general section styles for colors and spacing, available in all sections:
The Section header appears above the section. Add a Heading, Text, and optional Link.
Click Featured collection section to find settings
>
| Setting | Description |
|---|---|
Heading | Change or remove the title of the section. |
Heading tag | Change the heading tag to modify the page structure. Use H2 to indicate important topics, and use H3-H6 for related topics. Learn how to replace default H1 headings. This option doesn't change the heading's appearance. |
Text | Add multiple lines of rich text below the heading. |
Link URL | Select a page or URL for the link. |
Link label | Add text to display the link. |
Click Featured collection section to find settings
| Setting | Description | Options |
|---|---|---|
Collection | Select a collection to display its products. Collections are created and edited in your Shopify admin. | |
Maximum number of products | Set the maximum number of products that should be displayed from the collection. | 1-12 Default: 8 |
Number of columns on desktop | Select the number of products per row on desktop screens. | 2 3 Default 4 |
Number of columns on mobile | Select the number of products per row on mobile screens. | 1 2 Default |
Show slider scrollbar | When checked, the scrollbar appears below the products and allows visitors to move through the slider. |
Click Featured collection section to find settings
| Setting | Description | Options |
|---|---|---|
Maximum number of products | Set the maximum number of products that should be displayed from the collection. | 1-12 Default: 8 |
Number of columns on desktop | Select the number of products per row on desktop screens. | 2 3 Default 4 |
Number of columns on mobile | Select the number of products per row on mobile screens. | 1 2 Default |
Show slider scrollbar | When checked, the scrollbar appears below the products and allows visitors to move through the slider. |
Add a promotion tile with an image or autoplay video, promotional text, and link to other pages.
Add an image or autoplay video (without sound) as the promotion tile's background.
For autoplay videos, make sure your video files meet the following requirements:
Video file type |
|
Video length | > 30 seconds (Recommended) |
Video size | > 10MB (Recommended) |
Click Promotion tile block to find settings
| Setting | Description |
|---|---|
Image | Select or upload an image for the promotion tile. |
Mobile image | Select or upload an alternate image for mobile devices. |
Video | Add a short autoplay video (without sound) to replace the image. |
The image overlay adds a layer of color to your image. Overlays help balance image and text for clarity and readability.
Choose a Color scheme for the overlay and overlay text
Change the Opacity to make the overlay more or less transparent
Instead of displaying an image, you can show a solid color tile by setting the Overlay opacity to 100%.
Click Promotion tile block to find settings
| Setting | Description | Options |
|---|---|---|
Overlay opacity | Adjust the transparency of the color overlay on the promotion tile. | 0-100 Default: 20 |
Click Promotion tile block to find settings
| Setting | Description | Options |
|---|---|---|
Heading | Add a title for the promotion tile. | Default: Promotion |
Text | Add descriptive text for the promotion. | |
Text alignment | Set the position of the text content within the promotion tile. | Top left Default Top center Top right Middle left Middle center Middle right Bottom left Bottom center Bottom right |
You can make the promotion tile a clickable link or add a button to redirect visitors to another page.
| Setting | Description | Options |
|---|---|---|
Link URL | Enter the URL that you want the promotion tile to link to. | |
Button label | Enter the text to display on the button. | Default: Shop now |
Button style | Choose the visual style of the button. | Solid Default Outline Text |
Button placement | Select where to position the button within the promotion tile. | Standard Bottom-anchored Default |
