Бейдж залишку
Показує на картках товару в категорії плашку «Залишилось N шт.», коли залишок опускається до заданого порога. Число читається з реального атрибута чи елемента картки (через CSS-селектор), а не вигадується — якщо даних немає, бейдж тихо ховається. Підсвічує дефіцитні позиції, підштовхує до швидшого рішення й не псує стилі магазину. М'яка пульсація вимикається для користувачів з reduced-motion.
Товари, яких лишилось 1-2 шт., виглядають так само, як ті, що на складі сотнями. Клієнт не поспішає — і товар «зависає» замість швидкого продажу.
Що налаштовується в конструкторі
- Текст бейджа (N = число залишку)
- Показувати, коли залишок ≤ (0 = завжди)
- Колір фону бейджа
- Колір тексту
- Колір крапки
- Заокруглення кутів
- Розмір шрифту
- Пульсація крапки
8 налаштувань · 4 пресетів · під Хорошоп
Купуєте один раз — назавжди.
3 блоки −10% · 5 −20% · 10 −30%
Живе прев'ю
Так блок виглядає на сторінці. Кольори й тексти підлаштуєте в конструкторі.
Прев'ю інтерактивне — наведіть і клікніть, щоб перевірити поведінку блока.
Як це працює
- На картці категорії зʼявляється бейдж «Залишилось N шт.» — але ЛИШЕ де залишок реально малий (поріг задаєте)
- Число береться з РЕАЛЬНОГО залишку магазину (data-quantity Хорошопа) — не вигадується
- Багато на складі або залишок не показано — бейджа нема (чесно)
- Легкий пульс привертає увагу; накладається поверх картки, верстку не зсуває
Питання
Звідки береться число залишку?
З реального залишку товару в Хорошопі (атрибут картки). Блок нічого не вигадує — де залишку в DOM нема, бейджа теж нема.
У мене не показуються бейджі — чому?
Ймовірно, у магазині вимкнено показ залишків на картках. Увімкніть у Хорошопі показ кількості — і блок підхопить реальні числа для товарів із малим залишком.
Можна змінити поріг?
Так — бейдж показується лише коли залишок ≤ вашого порога (за замовчуванням 7). Високий залишок бейджа не отримує.
Впливає на швидкість?
Ні — один невеликий інлайн-скрипт без зовнішніх запитів, у «Скрипти після тегу body».