Collection tabs

You can choose between two views for this section:

General settings

Setting	Description
Heading	To add a heading, enter the text in the provided field. In the top menu of the field, you can find options to customize the heading such as making it bold, italic, or adding a hyperlink.
Heading alignment	You have three alignment options for heading 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.
Heading size	The heading size setting offers three options to control the size of the section heading: Small Medium Large With these options, you can easily customize the heading sizes to best match your website's style and create a visually appealing and cohesive design throughout your site.
Description	To add a description, simply enter the text in the provided field. In the top menu of the field, you can find options to customize text such as making it bold, italic, or adding a hyperlink.
Description font size	Choose the font size for description: Small Medium Large Sizes for all body text on site you can set in Theme settings* — Typography tab.

Setting

Description

Font size

Choose the font size for tabs name:

Font weight

Select the font weight for tabs name:

Setting	Description
Heading size	Choose the font size for the collection card heading: Small Medium Large
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: Adapt to image: This option uses the aspect ratio of the images, ensuring that they are not cropped and displayed in their original dimensions. Portrait: This option crops the images to use a 2:3 ratio, creating a taller appearance with a width that is 2/3 of its height. Square: This option crops the images to use a 1:1 ratio, creating a square-shaped display with equal width and height. Landscape: This option crops the images to a 3:2 ratio, where the width of the image is 1.5 times the height. It is ideal for images that have a wider or landscape orientation.
Image overlay opacity	Adjust the opacity of the image overlay for collections and products images.
Reverse card	When this option is turned on the collection heading is at the top of image.

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: Adapt to image: This option uses the aspect ratio of the images, ensuring that they are not cropped and displayed in their original dimensions. Portrait: This option crops the images to use a 2:3 ratio, creating a taller appearance with a width that is 2/3 of its height. Square: This option crops the images to use a 1:1 ratio, creating a square-shaped display with equal width and height. Landscape: This option crops the images to a 3:2 ratio, where the width of the image is 1.5 times the height. It is ideal for images that have a wider or landscape orientation.
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 such as Shopify Product Reviews, and Metafield definitions for reviews.rating_count and reviews.rating.
Show quick add button	Mark the checkbox to show “Add to cart” and “Quick view” button
Maximum products to show	Set the maximum number of products that will be displayed in this section.

Setting	Description
Color scheme	Color Scheme allows you to customize every aspect of your theme's colors in the settings. You can create and apply color schemes to different sections or blocks, specifying background colors, text colors, button colors, and input colors. When you apply a color scheme to a specific section like the collection tabs, it automatically updates all associated colors for a cohesive and professional look across your website.
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 5 columns.

Setting

Description

Number of columns on mobile

You can set a distinct column layout for mobile devices. Choose between:

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.