Zegar
Widget Zegar to motor pilności: żywe, tykające odliczanie pokazujące ile czasu zostało do dzisiejszego cut-offu. Po jego minięciu odliczanie przeskakuje na cut-off następnego dnia roboczego.
Co pokazuje
Dział zatytułowany „Co pokazuje”Zamów w ciągu 02 godziny 14 minut 39 sekund — wysyłka pnTekst składa się z czterech etykiet (konfigurowalnych per kanał sprzedaży w karcie Widget → Clock):
- Order in the next — etykieta przed odliczaniem
- Order in the next with days — alternatywna etykieta, gdy odliczanie obejmuje więcej niż jeden dzień (
%days% %transDays%) - For dispatch — etykieta po odliczaniu
- Date — sformatowana data wysyłki (domyślnie
%shippingMinDate%)
Warianty layoutu
Dział zatytułowany „Warianty layoutu”Zegar wspiera dwa layouty i dwa warianty:
clockLayout | Zachowanie |
|---|---|
default | Stos: info o wysyłce na górze, odliczanie pod spodem |
compact | Obok siebie: info po lewej, odliczanie po prawej |
Dla layoutu compact wybierasz też Compact text order:
orderFirst— najpierw linia “Order in the next”, potem dispatchdispatchFirst— najpierw dispatch, potem “Order in the next”
Wariant
Dział zatytułowany „Wariant”clockVariant | Zachowanie |
|---|---|
default (kółka) | Godziny/minuty/sekundy rysowane jako animowane SVG progress circles |
boxes | Cyfry renderowane jako boxy, z konfigurowalną szerokością i zaokrągleniem ramki |
Konfigurowalne kolory i rozmiary
Dział zatytułowany „Konfigurowalne kolory i rozmiary”Karta Widget → Clock udostępnia pełen zestaw pól stylizacji:
- Ikona: przełącznik
clockWithIcon,clockIcon(icon picker),clockIconColor,clockIconSize - Tło:
clockBackground,clockCircleBackground - Tekst:
clockTextColor,clockTextFontSize - Cyfry:
clockDigitsColor,clockDigitsFontSize - Jednostki (s / m / h):
clockUnitsFontSize - Wskazówki kółek (wariant default):
clockCircleHoursColor,clockCircleMinutesColor,clockCircleSecondsColor - Ramki boxów (wariant boxes):
clockBorderWidth,clockBorderRadius - Skeleton loader:
clockSkeletonBackground,clockSkeletonShimmerDarkColor,clockSkeletonShimmerLightColor
Icon picker używa biblioteki ikon P2Lab — wyszukaj “truck”, “shopping-basket”, “clock” itd.
Format daty
Dział zatytułowany „Format daty”Odliczanie tyka w czasie rzeczywistym, ale data wysyłki obok niego jest renderowana w formacie wybranym per widget (clockDateFormat). Wybierz z długiej listy formatów PHP (d/m, D, jS M, l, j F, …) albo wybierz Default, żeby dziedziczyć globalny format z zakładki Settings.
Gdy cut-off jeszcze nie minął
Dział zatytułowany „Gdy cut-off jeszcze nie minął”Dziś jest dzień roboczy, aktualny czas jest przed cut-offem: zegar odlicza do dzisiejszego cut-offu, a etykieta dispatch pokazuje dziś.
Gdy cut-off już minął
Dział zatytułowany „Gdy cut-off już minął”Dziś jest dzień roboczy, ale cut-off jest już za nami, albo dziś nie jest dzień roboczy (np. weekend / święto): zegar odlicza do następnego cut-offu w dniu roboczym, a etykieta dispatch pokazuje odpowiednią datę (np. pn).
Jeśli odliczanie przekracza 24 godziny (np. zamówienie w piątek wieczorem na dostawę poniedziałkową), używany jest snippet Order in the next with days i obok godzin/minut/sekund pokazana jest liczba dni.
Skeleton loader
Dział zatytułowany „Skeleton loader”Ponieważ dokładny pozostały czas zależy od zegara użytkownika, wartość jest liczona client-side. Dopóki to nie nastąpi (zwykle kilkaset milisekund), zegar pokazuje shimmer skeleton — kolory konfigurowalne w tej samej karcie. Wyłącz globalnie przełącznikiem Layout → Skeleton loader, jeśli wolisz.