Прогрес оформлення
Горизонтальний степер «Товар → Кошик → Оформлення → Готово» з підсвіченим поточним кроком, який задає власник магазину. Пройдені кроки позначаються галочкою та залитою лінією, поточний крок пульсує акцентним кольором, наступні лишаються приглушеними. Знижує тривогу «скільки ще заповнювати» і візуально підштовхує покупця завершити замовлення. Кольори, підписи кроків, кількість кроків і номер поточного кроку повністю налаштовуються.
На чекауті клієнт не бачить, скільки ще кроків до кінця — здається, що це довго й складно, і він кидає кошик на півдорозі.
Що налаштовується в конструкторі
- Заголовок над степером (порожньо — сховати)
- Поточний крок (1–4)
- Назва кроку 1
- Назва кроку 2
- Назва кроку 3
- Назва кроку 4 (порожньо — крок прибрати)
- Галочка на пройдених кроках
- Акцентний колір (активний/пройдений)
- Колір фону блока
- Колір основного тексту
10 налаштувань · 4 пресетів · під Хорошоп
Купуєте один раз — назавжди.
3 блоки −10% · 5 −20% · 10 −30%
Живе прев'ю
Так блок виглядає на сторінці. Кольори й тексти підлаштуєте в конструкторі.
Прев'ю інтерактивне — наведіть і клікніть, щоб перевірити поведінку блока.
Як це працює
- Над формою оформлення зʼявляється акуратний степер: Товар → Кошик → Оформлення → Готово
- Показує, що лишився фактично один крок — знижує тривогу й кидання кошика
- Форму замовлення знаходить сам (типові класи Хорошопа), стає повноширинним над нею — і на ПК, і на телефоні
- Не на сторінці кошика/чекауту — блок не показується, без помилок; не чіпляється до іконки кошика в шапці
Питання
А якщо на моєму магазині інша форма замовлення?
Блок перебирає типові класи форми замовлення Хорошопа. На нестандартній темі напишіть — підлаштуємо селектор.
Впливає на швидкість?
Ні — один невеликий інлайн-скрипт без зовнішніх запитів, у «Скрипти після тегу body».
Скільки кроків можна показати?
2, 3 або 4 — залежить від того, скільки назв ви залишите. Порожня остання назва прибирає крок.
Працює на мобільному?
Так, степер стає повноширинним над формою і на ПК, і на телефоні (розмітка Хорошопа врахована).