Collection list

The Product Series List Module is a powerful tool for showcasing multiple product series. By configuring various images, titles, and display styles, merchants can present product series on the homepage or other pages, guiding users to view and purchase items from different series. This module supports carousel, navigation buttons, and other features to enhance the user experience.

Configuration Guide

1. Section Title Settings

  • Display Section Title: Enable or disable this option to display the title of the product series module.

  • Title: Enter the title text for the product series list.

  • Description: You can add a brief text to introduce the series list.

  • Watermark Background Text: Set watermark-style text in the background.

  • Button Text: Set the text for the button, such as "View All."

  • Button Link: Set the button’s link, which can lead to other pages or series lists.

2. Content Settings

  • Enable Carousel on Desktop: This option allows carousel functionality for the product series on desktop.

  • Enable Full-Screen Carousel: Optional, allows a full-screen carousel mode for showcasing series.

  • Enable Auto Carousel: Set the carousel speed for automatic switching between product series.

  • Display Navigation Buttons: Show navigation buttons on desktop to help users control carousel switching.

  • Show Pagination Dots: Display dots that indicate the current position in the carousel while switching series.

3. Card Settings

  • Color Scheme: Set the overall color style for the product series cards.

  • Image Ratio: Choose the image ratio when displaying series images, such as square or vertical.

  • Background Opacity: Set the background opacity of the card content, with a default of 60%.

  • Enable Background Blur: When enabled, the card background will have a blur effect.

4. Text Alignment

  • Text Alignment: Set the text alignment inside the cards (left, center, or right).

  • Title Size: Choose the size of the title text (small, medium, large), and there’s an option to display the title in uppercase.

5. Mobile Settings

  • Enable Carousel on Mobile: This option enables carousel functionality on mobile devices, ensuring a good display experience on mobile.

Usage Recommendations

  1. Choose Titles and Descriptions Wisely: Concise and clear titles and descriptions can effectively guide users to click and explore the product series.

  2. Use Eye-Catching Images: Since images are the first element users notice, selecting high-quality, clear product series images can boost conversion rates.

  3. Customize Card Styles: Adjust the image ratio, background opacity, and enable blur effects to make the cards match the store's design style.

  4. Enable Carousel: If there are many product series, enabling the carousel feature can prevent the page from looking too crowded, while allowing users to browse through the series smoothly.

  5. Optimize for Mobile: Ensure a seamless carousel experience on mobile devices to enhance the mobile user experience.

Last updated