سواچ‌های تنوع محصول (Product Variation Swatches)
Bricks 2.0 Product variation swatches را معرفی می‌کند و کنترل بیشتری روی نمایش گزینه‌های attribute (رنگ، سایز، الگو) در فرانت‌اند می‌دهد.
به‌جای dropdown می‌توانید تنوع‌ها را به‌صورت swatch رنگ، دکمه تصویر یا برچسب سفارشی نشان دهید.
این قابلیت مستقیماً در المان Add to cart یکپارچه است و بدون افزونه اضافی swatchها را استایل می‌دهید.
قبل از Product Variation Swatches
بعد از Product Variation Swatches
فعال‌سازی product variation swatches
بریکس (Bricks) > تنظیمات (Settings) > ووکامرس (WooCommerce) > Enable product variation swatches را روشن کنید.
پس از فعال‌سازی، swatchها را از تنظیمات attribute محصول سفارشی می‌کنید.
تعیین نوع swatch برای attributeها
محصولات (Products) > Attributes را باز کنید و attribute موجود را Edit کنید (یا attribute جدید بسازید).
تنظیم جدید Swatch type با گزینه‌ها:
- None (default): رفتار استاندارد WooCommerce (dropdown)
- Color: swatch با مقدار رنگ
- Label: برچسب متنی سفارشی برای هر term
- Image: swatch با تصویر از media library
مثال: «Color» برای جعبه‌های قرمز و آبی؛ «Label» برای S، M، L.
مقدار fallback (اختیاری)
Fallback value را تنظیم کنید تا اگر term مقدار swatch نداشت از آن استفاده شود.
مقدار swatch برای termها
Configure terms را برای attribute ویرایش‌شده بزنید.
term مشخص (مثل «Red» یا «Large») را Edit کنید.
برای هر term ورودی متناسب با نوع swatch:
- Color → انتخاب رنگ
- Image → انتخاب یا آپلود تصویر
- Label → متن سفارشی
این مقادیر در المان Add to cart در فرانت‌اند نمایش داده می‌شوند.
استایل swatchها در المان Add to cart
swatchها داخل Add to cart رندر می‌شوند اگر محصول attribute با swatch type داشته باشد.
- المان Add to cart را انتخاب کنید (مثلاً در قالب تک محصول)
- گروه Variation swatches را در تنظیمات باز کنید
اندازه، فاصله، border، حالت active، tooltip و موارد دیگر را تنظیم کنید.
با variation swatchها dropdownهای استاندارد به selector تعاملی و polished تبدیل می‌شوند — مستقیماً در Bricks.