Odznaki produktów bez przeskoków układu
Marks dodaje odznaki do produktów WooCommerce. Automatyczne odznaki pojawiają się same na podstawie stanu produktu - Promocja, Nowość, Niski stan i Bestseller - a do wybranych produktów dodasz jedną ręczną odznakę. Render jest oparty tylko o CSS, bez JavaScript, więc odznaki nie przesuwają układu strony.
Działa z
Odznaki nie powinny psuć układu sklepu
Sklep chce wyróżnić promocje i nowości, ale odznaki ładowane skryptem często przesuwają obrazki produktów i utrudniają spójny wygląd na listach i karcie produktu.
- ✗ Odznaki ładowane skryptem, które przesuwają układ (CLS)
- ✗ Ręczne oznaczanie promocji i nowości produkt po produkcie
- ✗ Brak prostego progu dla odznaki niskiego stanu
- ✗ Niespójny wygląd odznak na liście sklepu i na karcie produktu
Marks pokazuje odznaki bez przeskoków układu
- ✓ Automatyczne odznaki Promocja, Nowość, Niski stan i Bestseller na podstawie stanu produktu
- ✓ Render oparty tylko o CSS, bez JavaScript - brak Cumulative Layout Shift
- ✓ Konfigurowalny próg niskiego stanu i okno nowości
- ✓ Odznaki na karcie produktu oraz na listach sklepu i kategorii
Co dostajesz w wersji darmowej
Wszystko, czego potrzeba, żeby wyróżnić produkty bez psucia wydajności.
Automatyczne odznaki
Promocja, Nowość, Niski stan i Bestseller pojawiają się same na podstawie stanu produktu.
Próg niskiego stanu
Odznaka Niski stan pokazuje się, gdy pozostała ilość spadnie do skonfigurowanego progu.
Ręczna odznaka
Jedna ręczna odznaka per produkt z etykietą i kolorem, sterowana przez meta produktu.
Tylko CSS, bez JavaScript
Odznaki renderowane czystym CSS nad obrazkiem produktu, bez przeskoków układu.
Lista i karta produktu
Odznaki widoczne na karcie produktu oraz na listach sklepu i kategorii.
Włączniki i HPOS
Globalny włącznik, przełączniki per reguła oraz zgodność z HPOS i blokami koszyka.
Jedna etykieta promocji
Opcja ukrycia domyślnego „Sale!” WooCommerce, gdy włączona jest odznaka Promocja Marks.
Start w trzech krokach
Włączenie odznak i pierwszy test na liście sklepu.
Zainstaluj
Aktywuj Marks obok WooCommerce.
Wybierz odznaki
W menu Marks włącz odznaki i wybierz, które automatyczne odznaki mają się pokazywać.
Ustaw próg i etykietę
Ustaw próg niskiego stanu oraz etykietę i kolor ręcznej odznaki.
Dla jakich sklepów
Gdy chcesz wyróżnić promocje i nowości bez dokładania JavaScriptu na każdą listę produktów.
Wyprzedaże i sezony
Automatyczna odznaka Promocja i ręczna etykieta „Last chance” na wybrane SKU.
- ✓ Promocja z WooCommerce
- ✓ Ręczna odznaka per produkt
- ✓ Tylko CSS
Sklepy z dużą siatką produktów
Odznaki na liście i karcie bez przesunięcia obrazków — ważne przy CLS.
- ✓ Bez JavaScript
- ✓ Bestseller i Nowość
- ✓ Próg niskiego stanu
Zespoły merchandisingowe
Włączniki per reguła i prosty próg stanu zamiast ręcznego oznaczania setek produktów.
- ✓ Panel Marks
- ✓ Okno nowości 30 dni
- ✓ Dokumentacja PL+EN
Potrzebujesz kampanii i reguł? Marks PRO
FREE pokrywa automatyczne i ręczne odznaki CSS. PRO dodaje odznaki kampanijne, reguły warunkowe, odznaki obrazkowe i testy A/B etykiet.
- ✓ Odznaki kampanijne z harmonogramem — wdrożone w PRO
- ✓ Reguły warunkowe i odznaki obrazkowe — wdrożone w PRO
- ✓ Testy A/B etykiet z licznikiem wyświetleń — wdrożone w PRO
Wsparcie i zasoby
Każda wtyczka ma własną dokumentację z przewodnikiem konfiguracji. Błędy i pytania trafiają do publicznego repozytorium GitHub danej wtyczki — odpowiadamy otwarcie.
Częste pytania
Czy Marks wymaga WooCommerce?
Tak. Wtyczka działa z produktami WooCommerce.
Kiedy pojawia się odznaka Nowość?
Na produktach utworzonych w oknie nowości - domyślnie 30 dni.
Kiedy pojawia się odznaka Niski stan?
Na produktach z zarządzaniem stanem, których pozostała ilość jest na poziomie skonfigurowanego progu lub poniżej.
Jak dodać ręczną odznakę do produktu?
Ustaw etykietę i kolor ręcznej odznaki w ustawieniach Marks, a następnie ustaw meta produktu _marks_manual_text (i opcjonalnie _marks_manual_style) na produktach, które mają ją pokazywać.
Czy odznaki przesuwają układ?
Nie. Odznaki renderują się czystym CSS nad obrazkiem produktu, więc nie powodują Cumulative Layout Shift.
Czy Marks pasuje do Peek i Reel?
Tak. Peek dodaje szybki podgląd w liście bez opuszczania sklepu, a Reel wzbogaca galerię na karcie produktu. Wszystkie trzy wtyczki są od wppoland.com i nie ładują jQuery na siatkach produktów.
Wyróżnij produkty bez kosztu wydajności
Automatyczne i ręczne odznaki, render tylko CSS, bez przeskoków układu. Pełna edycja FREE na GPL.
Zobacz dokumentacjęDarmowa edycja obejmuje automatyczne i ręczne odznaki — PRO pod kampanie z harmonogramem.