Swatch

Swatch zastępuje domyślne listy rozwijane <select> wariantów WooCommerce wizualnymi, dostępnymi próbkami na karcie produktu. Wybierz typ próbki dla atrybutu (kropki kolorów lub pigułki przyciski/etykiety) i przypisz kolor lub etykietę do każdego terminu.

Dlaczego warto

Swatch steruje natywnym formularzem wariantów WooCommerce, więc cena, stan magazynowy i przycisk dodania do koszyka aktualizują się tak samo jak przy standardowych listach. Stany wybrane i niedostępne odzwierciedlają się automatycznie. Darmowa edycja to pełny produkt GPL — samodzielny, bez usług zewnętrznych.

Najważniejsze

• Dwa typy próbek — kropki kolorów oraz pigułki przyciski/etykiety, wybierane per atrybut.
• Wybór typu per atrybut na ekranie atrybutów globalnych.
• Kolor i etykieta per termin — kolor zapisany przez sanitize_hex_color, etykieta jako term meta.
• Natywny formularz wariantów — bez jQuery, czysty JS wpięty w zdarzenia wariantów WooCommerce.
• Obsługa klawiatury — semantyka radiogroup, strzałki, etykiety dla czytników ekranu.
• Dostępne wizualnie — widoczne obramowania fokusu, odpowiedni kontrast, reduced-motion, bez przeskoków układu.
• Łagodny fallback do standardowej listy, gdy atrybut nie ma danych próbki.
• Strona ustawień w menu WooCommerce — włącz/wyłącz, domyślny typ, rozmiar, kształt, tooltip.

Jak to działa

Każdy skonfigurowany atrybut renderuje się jako radiogroup próbek zamiast listy. Wybór próbki przekazuje opcję do natywnego formularza wariantów WooCommerce, który aktualizuje cenę, stan i przycisk koszyka. Atrybuty bez danych próbki zachowują standardową listę, więc nic się nie psuje.

Edycje

• Darmowa na WordPress.org — próbki kolorów i przyciski/etykiety, typ per atrybut, kolor/etykieta per termin, strona ustawień.
• PRO (planowana) — próbki obrazkowe, obrazy per wariant, tooltipy z podglądem i próbki na listach sklepu.

Kolejne kroki

• Pierwsze kroki — instalacja, ustawienia, przypisanie kolorów i etykiet.