Variant picker block (Featured product)


Setting Description
Type This setting determines the style of the variant picker. You can choose between Dropdown or Button.
Enable color swatches for variant color

This setting enables circle button for variant color of the product.

*Color options look like circles with color. To correctly display the color, you need to configure it in the “Product variants” section on detail product page (Products - Shopify Store). For short info, refer to Color Swatches in this documentation. 


Picker settings


Dropdown picker style 

Choose type “Dropdown” and disable “Enable color swatches”, then look at your dropdown style, It can be: 

  • Dropdown with border
  • Dropdown with divider
  • Dropdown with divider full width
Font size Use the slider to adjust the font size of the picker. This applies to various contexts, such as quantity numbers (1, 2, …) or when opting for a dropdown view with divider or with border for color and size options.
Font weight You can change the picker font weight. This applies to various contexts, such as quantity numbers (1, 2, …) or when opting for a dropdown view with divider or with border for color and size options.
Text style

Choose the text style that best fits your design:

  • Initial – Displays text in Title Case or Sentence case, depending on how it's set in the variant options on the product detail page in the dashboard.
  • Uppercase – Displays all text in UPPERCASE.

Label settings


Show label 

Use the “Show Label” toggle to add a label to the variant picker.

  • Toggle On – A label will be displayed above the variant picker.
  • Toggle Off – The variant picker will be shown without a label.
Font size You can set the label font size (it can be for “color”, “quantity”, “size”)
Font weight You can set the label font weight (it can be for “color”, “quantity”, “size”)
Text style

Choose the label style that best fits your design:

  • Initial – Displays text in Title Case or Sentence case, depending on how label named in the variant options on the product detail page in the dashboard.
  • Uppercase – Displays all text in UPPERCASE.
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