General settings (Sticky products)

Heading settings

Setting

Description

Heading

To add a section heading, enter it in the provided field. In the top menu of the field, you can find options to customize the heading.

Heading align

You can use heading alignment for your design preferences.

Left
Center
Right

^{Button settings}

Setting	Description
Show “Discover More” button	Enable the toggle to show the button in the section. A button will lead customers to the collection list page.
Button label	This option allows you to add a label to the button on the page. *Leave the label blank to hide the button.
Button color style	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.
Button style	Choose from seven button styles: Default: Solid background with text. Default with icon: Same as Default, plus an icon. Add icon in Theme Settings > Buttons > Add icon to inline button option by pasting SVG code. For detailed steps on adding an SVG icon, see the “Buttons” article in Theme Settings, and look for the “Add icon to inline button” option. For example, you can use an arrow icon. Outline: Transparent background with colored outline and text. Outline with icon: Outline style with an icon. Add icon the same way as Default with icon style. Inline: Looks like a text link. You can also add an icon using the same steps as the Default with icon style. Inline with underline: Inline style with a permanent underline. Inline with underline on hover: Inline style with underline appearing on hover.
Button align	You can use button alignment for your design preferences. Left Center Right

Grid settings

Setting	Description
Large item position	This setting allows you to choose the placement of the large product image within the grid. You can select either Left or Right alignment, depending on your design preference. To create a large block, add either an Image block or a Product block. This allows one large item to be featured alongside other items in a grid layout.
Column gap	Choose the spacing between columns in the grid layout. You have options for “None”, “Small”, or “Large” gaps, allowing you to adjust the spacing between product images accordingly.
Column gap mobile	Similar to the column gap setting, this option specifies the spacing between columns specifically for mobile devices. Choose between “None” or “Small” gaps to optimize the grid layout for mobile viewing.
Row gap	This setting determines the spacing between rows in the grid layout. You can select from “None”, “Small” or “Large” options to control the vertical spacing between product images.
Row gap mobile	Similar to the row gap setting, this option specifies the spacing between rows specifically for mobile devices. Choose between “None”, “Small”, or “Large” gaps to ensure a consistent grid layout across different screen sizes.

Card settings

Setting	Description
Product style	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).
Image ratio	Sets the image ratio for the product images: 'Adapt to image' uses the aspect ratio of the images. This prevents the images from being cropped. 'Portrait' crops the images to use a 2:3 ratio 'Square' crops the images to use a 1:1 ratio
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.
Custom second image	You can add one image, which will be visible on hover on every product.
Zoom image on hover	See the image in enlarged form.
Show image border	Shows distinct borders of the image.
Show badges	You can show or hide badges for the section, marking the checkbox or removing the checkmark according to your design preferences.
Show quick view icon	Shows a quick-view icon. Clicking on the icon opens a pop-up with short information about the product. You can choose product variant options and add to your cart this variant.
Product variants	On the product page in the dashboard, you can create 1 to 3 variant options. When enabled, these variants will be displayed on the product card in the Collection Tabs section by turning on the toggle. To hide the variants, simply disable the toggle. Check screenshots under the table.
Show add to cart button	Disable this option if you want to hide the “Add to cart” button on the product card.
Content align	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.
Heading font	You can choose 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.
Heading style	This setting enables you to define the capitalization style for the heading. You have the following options: Default: Uses the sentence case or title case as you’ve named the product in the dashboard. Uppercase: Converts all text to uppercase letters. For example, “Box Brown Mini Table” becomes “BOX BROWN MINI TABLE”.
Heading color	This setting allows you to select the color for card heading. Available options: Main Secondary Heading
Heading font size	Select the size of the card heading. Available options: Small Medium Large
Price font size	Select the size of the card price. Available options: Small Medium Large Extra large
Button color style	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.

Product variants option

Set variant options on product detail page on dashboard

Enable “Product variants” toggle

When you select a variant that is out of stock, the product image button immediately displays an “Out of stock” label on the product image, and the variant option under the product heading is crossed out.

When the selected variant is in stock, the “Add to Cart” button will be displayed.

Section settings

Setting	Description
Section top space	Adjust the top spacing of the section using the slider.
Section bottom space	Adjust the bottom spacing of the section using the slider.
Background color	Click the box labeled “Background color”, which displays a color circle and name. Then, select your desired color from the color picker to apply it to the section.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us

Last updated on June 4, 2025