SectionAI is free + 20K tokens if you're a The4 customer, Free plan is available Install App  

Header background

Product Swatch Types

Annie

Written by Annie

Last updated

2241 views

On this page


When you view the Theme live demo, on the Megamenu you will see all swatch types of products in the image below:

11.png

In this article, we will show all styles of the product swatches, so you can choose to use the swatch types that you wanna use so easily!

1. Show swatch type

1.1. On Product page

Go to Product page > Product Main > Product Form > Product Swatch option to configure the swatch types, please follow this video:

1.2. In product grid layout

It will show the color swatches in product items on homepage/collection page/etc..

Go to Theme settings > Product Items > COLOR SWATCHES

12.png

To show Size list:

13.png

1.3. Change your custom colors

You need to follow this guide to configure your own colors to the swatches.

2. Multi-languages

The color swatches only work when the variant name is Default: "Color, Colors, Couleur, Coloure".

If the primary language of your theme is not English, or you are using multi-languages, example: English and German. You need to add the variant name for other languages.

Please follow this video:

🎁 Exclusive Deals for The4 Customers

SectionAI

🤖 SectionAI – Build Sections with AI

Generate Shopify sections from text or wireframes.
The4 users get +20,000 bonus tokens when verifying their theme license.

  • ✅ No-code section builder
  • ✅ Works with your The4 theme
  • ✅ Build FAQs, banners, product grids & more
🚀 Try Free – Claim Tokens
EComposer

🎉 EComposer – Free 6-Month Plan

Build landing pages, sales funnels, and more with drag & drop.
The4 users get 6 months free (save $114).

  • ✅ 100+ templates ready to use
  • ✅ Build any Shopify page
  • ✅ No coding required
🔓 Get 6 Months Free

Enjoy a free 3-day trial. Then get your first month for $1. Try Now

We uses cookies to ensure you get the best experience on our website.