General settings (Collection tabs)

You have three alignment options to choose from:

• Left: This aligns the heading to the left side of the section.
• Right: This aligns the heading to the right side of the section, 
• Center: This aligns the heading to the center of the section.

Select the number of products to display per row in the collection:

• 2 columns
• 3 columns
• 4 columns

Choose how many products appear per row on mobile devices:

• 1 column
• 2 columns

Choose what number of products should be displayed under the collection tab. You can choose from 2 to 24. 

*If the actual number of products for example is 20, and we have settings of max quantity – 24 products on the page, the page will show 20.

Choose the color for the underline of the active tab:

• Link – Uses the color defined for links.
• Heading – Uses the color defined for headings.

These colors are set globally in your theme settings under the Colors tab. Changing them here will update the corresponding color across your entire website.

Choose a style for text:

• Default – Uses the sentence case or title case as you’ve named the collection in the dashboard.
• Uppercase – Displays the heading in all capital letters to match your design preferences.

Four styles are available:

• Buttons down hover (When hovering over a product image, the “Add to cart” button and “Quick view” icon are displayed side by side at the bottom of the image)
• Buttons center hover (When hovering over a product image, the “Add to cart” button is displayed in the center of the image with horizontal alignment)
• With borders feature enhances your product display by adding a sleek border to all product card. When a user hovers over a product image, the “Add to Cart” button elegantly appears beneath the border, positioned after the heading and price.
• Title on hover (When hovering over a product image, a heading with the price is displayed in the center of the image. The 'Quick View' icon appears at the top center of the image, allowing users to quickly preview the product. Additionally, the 'Add to Cart' button is positioned at the bottom center of the image, providing users with a convenient option to add the product to their cart).

The image ratio for the collections tabs:

1) Adapt to image: Displays the image in its original aspect ratio without cropping.

2) Portrait: This option crops the images to a 2:3 ratio, where the height of the image is 1.5 times the width. It is suitable for images that have a taller or portrait orientation.

3) Square: This option crops the images to a 1:1 ratio, where the width and height of the image are equal. It creates a square-shaped display for your images.

Sets the alignment of the content:

• Left — Aligns the content to the left.
• Center — Aligns the content to the center.
• Right — Aligns the content to the right.

You can select whether headings use the Heading or Body text style.

• To change the font family, font size, or font weight of heading or body style, go to Theme Settings > Typography.
• Note: Changes in the Typography tab will apply across the entire theme.

Select a color for your headings. You have three options:

• Main
• Secondary
• Heading

The size of the card heading:

• Extra small
• Small
• Medium
• Large

This feature allows you to customize the color style of buttons. You have two options to choose from:

• Primary
• Secondary

This setting can be applied to buttons, links, and underlined links within the section.

*To choose or change the colors for these button styles, go to the “Colors” tab in the theme settings and locate the “Primary button” and “Secondary button” blocks. By changing the colors in the theme settings, the new color style will be applied throughout the entire theme.