Липка кнопка «Купити»
На довгій картці товару кнопка «Купити» швидко їде вгору, і клієнт, догортавши до опису чи відгуків, уже не бачить, як замовити. Блок стежить за реальною кнопкою покупки: щойно вона ховається з екрана — знизу випливає компактний липкий бар із назвою товару, ціною та кнопкою «Купити». Кнопка бара тисне ВАШУ справжню кнопку покупки (нічого не підробляється), ціна й назва беруться з реальної картки. Особливо піднімає мобільну конверсію, де прокрутка довга.
На довгій картці товару кнопка «Купити» швидко їде вгору. Клієнт читає опис, відгуки — і вже не бачить, як замовити. На мобільному це втрачені замовлення.
Що налаштовується в конструкторі
- Де показувати бар
- Текст кнопки
- Показувати назву товару
- Показувати ціну
- Колір фону бару
- Колір кнопки
- Заокруглення кнопки
- Показувати фото товару
8 налаштувань · 4 пресетів · під Хорошоп
Купуєте один раз — назавжди.
3 блоки −10% · 5 −20% · 10 −30%
Живе прев'ю
Так блок виглядає на сторінці. Кольори й тексти підлаштуєте в конструкторі.
Прев'ю інтерактивне — наведіть і клікніть, щоб перевірити поведінку блока.
Як це працює
- Бар випливає знизу, щойно основна кнопка «Купити» ховається з екрана
- Показує назву й ціну; кнопка тисне ВАШУ справжню кнопку покупки (нічого не підробляється)
- Знаходить кнопку/ціну/назву сам (типові класи Хорошопа); не на картці товару — не показується
- Плаває поверх (position:fixed) — верстку не зсуває
Питання
Кнопка справжня?
Так. Бар не створює окрему покупку — його кнопка натискає саме вашу справжню кнопку «Купити». Ціна й назва — реальні, з картки товару.
А якщо в мене інша кнопка покупки?
Блок перебирає типові класи Хорошопа (.j-buy-button-add тощо). На нестандартній темі напишіть — підлаштуємо селектор.
Впливає на швидкість чи верстку?
Ні — один невеликий інлайн-скрипт без зовнішніх запитів; бар плаває поверх, тому нічого не зсуває (CLS 0).
Працює на мобільному?
Так, і найбільше користі саме там: на вузькому екрані назва ховається, лишаються ціна й кнопка.