# Collection thumbnails

The **Category Icon List** feature is designed to display multiple product categories on a page, each with an icon and a name. This functionality helps users quickly browse and navigate to the product categories they are interested in.

### Feature Details

1. **Adapt for transparent image**

   If the collection image has a transparent background, it is recommended to enable this option for optimal display.<br>
2. **Layout Style**:

   You can choose the layout style for the Category Icon List:

   * **Horizontal**: Arrange all category icons and titles horizontally. This layout is suitable for a landscape orientation.<br>

     <figure><img src="https://3086053958-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUtxdyhQYbUmYMEm4SSNh%2Fuploads%2FcbpjrmwolUaxCblG2oSy%2Fimage.png?alt=media&#x26;token=5485ed75-6920-4e0b-8cf0-2ed7449b9a4d" alt=""><figcaption></figcaption></figure>
   * **Vertical**: Arrange all category icons and titles vertically. This layout is suitable for a portrait orientation.<br>

     <figure><img src="https://3086053958-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUtxdyhQYbUmYMEm4SSNh%2Fuploads%2Fj9H4rQOGsGRPyNwIQUXq%2Fimage.png?alt=media&#x26;token=bd43b7c4-cbf9-471d-8008-663d621253e4" alt=""><figcaption></figcaption></figure>
3. **Icon Block Settings**:

   Each icon block represents a product category. For each category, you can set the following:

   * **Image**: Upload an image for the product category. This is often used to showcase featured products within that category.
   * **Select Product Series**: Choose a product series from existing ones to serve as the content source for the category.
   * **Custom Series Title**: Optionally, set a custom title for the product series, which will be displayed below the icon.

### **Usage Suggestions**

* **Clear Navigation**:Use the category icon list to help users quickly identify and navigate to their desired product categories. Ensure that icons and titles are clear and easily understandable for users.
* **Consistent Style**:Maintain consistency in the color scheme and icon style to enhance brand image and user experience.
* **Regular Updates**:Update category icons and product series content according to product updates or promotional events to keep the content fresh and relevant.