Featured collection settings
| Setting | Description |
| Heading | This field is for adding a heading to the section. In the top menu of the field, you can find options to customize the heading, such as making its font bold or light, italic, or adding a hyperlink. Furthermore, you can click the dynamic source button to insert a dynamic source as the title of the section. |
| Heading size | The heading size setting offers three options to control the size of the section headings:
With these options, you can easily customize the heading sizes to best match your website's style, creating a visually appealing and cohesive design throughout your site. |
| Description | This field is for adding a description to the section. In the top menu of the field, you can find options to customize the text such as making it bold, italic, or adding a hyperlink. Additionally, you can use the style of headings from H1 to H6 to the body text and create bullet or numbered lists for your description. Furthermore, you can click the dynamic source button to insert a dynamic source for the featured collection description. |
| Description font size | Choose the font size for description:
Note: Font sizes for all body text across the site can be adjusted in the Typography tab under Theme Settings. |
| Show collection description from the admin | Selecting this option will display the collection description you entered in the Shopify admin, rather than using any text entered in the Description field above. |
Countdown
| Setting | Description |
| Countdown label | In this field, you can add a label to Countdown. You can write, for example, that the offer will end soon and customers should hurry up to buy products at discounts. |
| Label font weight | Select the font weight for your countdown label:
|
| Label background | Choose custom background for your label. |
| Numbers size | Set the size for numbers:
|
| End date | Please refer to the example provided below the field to ensure you correctly input the end date. |
| When date has passed | When the specified date has passed, you can decide how to handle the countdown bar from a dropdown menu:
|
| Days label | Keep the suggested label for days, or write your label in the field. |
| Hours label | Keep the suggested label for hours, or write your label in the field. |
| Minutes label | Keep the suggested label for minutes, or write your label in the field. |
| Seconds label | Keep the suggested label for seconds, or write your label in the field. |
Collection display options
| Collection | Choose a collection from your list to be showcased in this section as a featured collection with products. |
| Maximum products to show | This setting determines the maximum number of products that will appear on the page. You have the flexibility to select a range from 2 to 25 products. |
| Number of columns on desktop | Use the slider to choose the number of columns for desktop view. You can select a range from 2 columns to a maximum of 4 columns. |
| Make products full width | If you mark the checkbox, products on the page will be shown in the full width of the window with small left and right paddings for better appearance. |
| Enable “View all” if collection has more products than shown | If the collection has more products than set in the Maximum products to show slider, then in the section after products, you will see “View all” button which leads customers to a Collection page with all products. |
| “View all” style | Three options of “View all” button are available in settings:
|
| Enable carousel on desktop | Check this box to display products in a carousel format on screens wider than 989 pixels. |
| Color scheme | Color Scheme allows you to customize every aspect of your theme's colors in the settings. When you apply a color scheme to a specific section like the featured collection, it automatically updates all associated colors for a cohesive and professional look across your website. |
Product card
| Setting | Description |
| Image ratio | The “Image ratio” setting allows you to control how images are displayed on your website based on their width-to-height ratio. You have several options to choose from:
|
| Show second image on hover | You can see the second image on hover if on the detail page of this product are 2 or more images in the list. |
| Show vendor | Show the vendor of the products under the image. |
| Show product rating | Displays the average product rating in stars with the number of reviews in parenthesis, for example: ★★★★★ (8). Also requires a product review app, and metafield definitions for reviews.rating_count and reviews.rating. |
| Show quick add button | On product cards are available two buttons, you can click on add to cart and add the item to the cart, or click “Quick view” to view the item's full details or to take a look at other options. |
Mobile layout
| Setting | Description |
| Number of columns on mobile | You can choose the number of columns for mobile display in this setting:
|
| Enable swipe on mobile | Check this box to display products in a carousel format on screens narrower than 989 pixels. |
Section padding
| Setting | Description |
| Top padding | The 'Top padding' setting allows you to adjust the amount of space at the top of the section using a slider. |
| Bottom padding | The 'Bottom padding' setting functions similarly to the “Section top padding” setting, but controls the space at the bottom of the section. |