"За цінами стежити — бажання не обмежити". Створюємо потрібний функціонал для інтернет-магазину на Bitrix.

20 Серпня 2020

наступна стаття
Оксана Сорока

Back End Developer

Оксана Сорока
"За цінами стежити — бажання не обмежити". Створюємо потрібний функціонал для інтернет-магазину на Bitrix.

Досить часто під час "прогулянок" Вашим інтернет-магазином, покупець наштовхується на дійсно вподобаний ним товар, але... З певних причин саме зараз купити його він не наважується. Можливо, ціна на дану річ здається йому занадто високою, можливо, перемагає бажання "походити й подивитися ще", а можливо у нього виникають десятки інших причин, за якими так чи інакше покупка відкладається. І Ваш інтернет-магазин покидають назавжди. Звичайно, Ви можете припускати, що якщо річ клієнтові дійсно сподобалася, то він додасть сторінку магазину в закладки. Але, як показує практика, частіше трапляється так, що відвідувач сайту просто закриває її: чи то через неуважність, чи то вирішує, що принагідно йому не важко буде знайти її знову.

Утримати будь-якою ціною

Напевно Ви погодитеся з тим, що втрачати таких ось потенційних покупців, це просто недозволена розкіш. А тому необхідно всіма можливими способами нагадати про себе, повернути клієнта на сайт і переконати його все-таки здійснити покупку! Ну а що може привернути увагу нерішучого покупця краще, ніж гаряча знижка на вподобаний ним раніше товар? Правильно, нічого! І як клієнт дізнається про те, що на вподобаний йому товар діє знижка? Відповідь проста: за допомогою простого, але в той же час досить дієвого в даному випадку функціоналу "Стежити за ціною".

Що ж собою являє даний функціонал? Як правило, це невелика й з характерним дизайном кнопка на картці детального перегляду товару, при натисканні якої на екрані з'являється відповідна форма і клієнту пропонується ввести туди своє ім'я та адресу електронної пошти (якщо ж вам зручно відсилати клієнту повідомлення на телефон, то номер мобільного телефону). Надалі ж, якщо ціна на даний товар стане меншою тієї, що була дійсна на момент "підписки", клієнту автоматично надсилається лист з характерним заголовком "Ціну на Ваш товар знижено!", "Поспішайте купити!" тощо. Як показує практика, це відмінний спосіб нагадати про себе, проявити увагу і турботу про клієнта і в підсумку, можливо, переконати його купити товар.

Складові функціоналу

Наче все просто і досить зрозуміло, але, на жаль, стандартними засобами Bitrix таке ось відстеження та порівняння цін "від А до Я" вам зробити не вдасться. Проте, реалізувати це все одно не складно і нижче я розповім, як це зробити.

В першу чергу вам потрібна кнопка з характерною назвою "Стежити за ціною", яку слід розмістити на сторінці того чи іншого товару, тобто в файлі template.php шаблону компонента, що відповідає за виведення детальної інформації по елементу каталогу — catalog.element. Де конкретно вона буде розташовуватися і як буде виглядати, повністю залежить від дизайну вашого інтернет-магазину і, власне, від вашої фантазії (приклади сайтів, де є така кнопка

1.png

Форма, за допомогою якої можна здійснити підписку на спостереження за вартістю того чи іншого товару, спочатку повинна бути прихована і з'являється тільки тоді, коли клієнт натисне на заповітну кнопку "Стежити за ціною". Я не буду загострювати увагу на тому, як зробити подібне спливаюче вікно з формою, адже зараз для цього існує величезна кількість досить простих у застосуванні плагінів (можу лише порекомендувати один з них — зручний, як на мене, jQuery-плагін fancyBox, скачати який ви зможете тут http://fancyapps.com/fancybox/). Замість цього я краще розповім докладніше про те, яким компонентом Bitrix краще скористатися в даному випадку. Варіантів є декілька. Наприклад, для зберігання даних про клієнта і вподобаний ним товар ви можете створити окремий Інформаційний блок, запис в який буде здійснюватися за допомогою стандартного компонента iblock.element.add.form (даний компонент здійснює безпосередній висновок форми створення і редагування правила зазначеного інформаційного блоку) або ж реалізувати таку форму за допомогою компонента main.feedback, але в такому випадку вам доведеться власноруч прописувати код, який відповідає за збереження введених клієнтом даних все в тому ж Інфоблоці або, наприклад, в Highload блоці, який куди більше підходить для зберігання подібної інформації. Я ж для реалізації даного функціоналу скористалася одним з компонентів модуля Веб-форми — form.result.new, що слугує безпосередньо для виведення форми і додавання результату, і тому розповім про нього докладніше.

Створюється нова веб-форма, поля якої ми будемо виводити, а результати заповнення якої — зберігати, в розділі Сервіси вкладки Адміністрування.

2.png

Якщо перейти на вкладку "Налаштування форм" і натиснути кнопку "Створити", на екрані у вас з'явиться вікно для створення нової веб-форми, де ви зможете вказати її назву, створити необхідні для заповнення поля і задати певні настройки: наприклад, увімкнути/вимкнути використання Captcha для запобігання заповнення форми роботами, обмежити можливість заповнення форми тими чи іншими користувачами тощо. (докладніше про створення і редагування веб форм ви зможете прочитати тут https://dev.1c-bitrix.ru/user_help/service/form/form_edit.php). Оскільки крім інформації про клієнта для правильної роботи функціоналу нам потрібна ще й інформація про товар, що його цікавить, наша форма буде мати такі поля:

  • Ім'я клієнта (можна, звичайно, і упустити дане поле, але, погодьтеся, звернення на ім'я в розсилці виглядає куди симпатичніше);

  • Email клієнта (на нього ми і будемо надалі відправляти лист);

  • ID товару (дане поле ми приховуємо і саме воно буде служити нашій прив'язкою до товару);

  • Ціна товару (ще одне приховане поле, які в подальшому дозволить нам порівнювати актуальну ціну товару з ціною на момент підписки);

  • Посилання на товар (це поле я також зробила прихованим, створювати його не обов'язково, але в листі, який буде потім надіслано користувачеві, набагато краще буде смотрется посилання саме на конкретний вподобаний йому товар, а не просто на інтернет — магазин в цілому).

Розмістити виклик компонента form.result.new ви можете або знову таки в шаблоні компонента catalog.element, або на сторінці element.php комплексного компонента catalog. Приклад виклику form.result.new можна подивитися тут https://dev.1c-bitrix.ru/user_help/components/services/web_forms/form_result_new.php. Надзвичайно важливим при виклику даного компонента є параметр "WEB_FORM_ID", яким передається ідентифікатор створеної нами веб-форми інші ж параметри в нашому конкретному випадку є або зовсім необов'язковими (наприклад, такі як "LIST_URL", "EDIT_URL"), або заповнюються виходячи з ваших вимог до роботи компонента. Також для правильної роботи функціоналу в якості одного з параметрів слід передати ідентифікатор проглядається товару (ID). Якщо ви розмістили виклик form.result.new на сторінці element.php комплексного компонента catalog, то зверніть увагу на те, що на тій же сторінці ID елементу повертається при включенні компонента bitrix: catalog.element (в файлі element.php є такий рядок $ elementID = $ APPLICATION-> IncludeComponent ( "bitrix: catalog.element", ...) ;, де $ elementID - якраз те, що нам потрібно передати). Якщо ж виклик form.result.new розміщений у вас в шаблоні компонента catalog.element, взяти ID ви зможете з масиву $ arResult ($ arResult [ "ID"]).

3.png

Далі копіюємо шаблон компонента form.result.new для того, щоб внести зміни у верстку (за необхідності) і передати потрібні значення в поля, що стосуються інформації про обраний клієнтом товар. Кастомізувати даний шаблон досить просто. Головне при цьому знати, що:

  • замість відкриває і закриває тега <form> ми обертаємо нашу форму в $ arResult [ "FORM_HEADER"] і $ arResult [ "FORM_FOOTER"];

  • інформація про питаннях веб-форми зберігається в масиві $ arResult [ "QUESTIONS"];

  • в стандартному шаблоні компонента просте текстове поле для питання має такий вигляд: <input type = "text" class = "inputtext" name = "form_text_ * ID_вопроса *" value = "" size = "0" />;

  • кнопка від відправки форми зберігається в $ arResult [ "SUBMIT_BUTTON"] і спочатку має такий вигляд: <input type = "submit" name = "web_form_submit" value = "* Ваш текст для кнопки заданий в настройках форми *" />.

Атрибут "value" у полів форми, як ми можемо бачити, є порожнім, так як він заповнюється безпосередньо користувачем при введенні даних. Проте, це правило не стосується тих полів форми, які ми спочатку створили для передачі потрібної нам надалі інформації про товар. По-перше, щоб приховати такі поля від очей користувача, для них потрібно прописати атрибут "hidden", а по-друге, нам потрібно вручну прописати їм певний атрибут "value". Так як ID товару, яким зацікавився користувач, ми ще при виклику передавали в параметрах компонента, в "value" відповідного поля ми помістимо наступне: value = "<? = $ ArParams [" PRODUCT_ID "];?>". Далі нам необхідно згенерувати посилання на вказаний товар, щоб також передати її в "value" відповідного прихованого поля. Згенерувати посилання можна, наприклад, таким чином: $ arResult [ "PRODUCT_LINK"] = (CMain :: IsHTTPS ()? "Https: //": "https: //"). SITE_SERVER_NAME. $ APPLICATION-> GetCurPage (false) (де SITE_SERVER_NAME — це константа, яка береться з поля "URL сервера" в настройках поточного сайту).

Що стосується ціни товару, то її, наприклад, можна передати при виклику form.result.new (взявши з масиву $ arResult компонента bitrix: catalog.element подібно ID). Також дізнатися ціну можна за допомогою одного з перерахованих в документації методів Bitrix, передаючи в якості параметра вже відоме нам ID. Я спочатку вирішила знайти оптимальний для визначення ціни товару метод, так як в подальшому він в будь-якому випадку знадобиться нам для написання скрипта, що визначає поточну ціну товару і порівнює її з ціною на момент підписки. Так як у Bitrix зменшити ціну на товар можна не тільки шляхом безпосереднього зміни її в Торговому каталозі вручну, а й за допомогою можливостей розділу "Торговий маркетинг" (шляхом створення маркетингових акцій, правил роботи з кошиком і знижок), потрібна була універсальна функція, що враховує всі ці тонкощі і безпомилково визначає кінцеву вартість того чи іншого товару. І для цього я використовувала таку:

4.png

Таким чином в якості атрибуту "value" для поля, що відповідає за ціну товару, я передаю результат виконання зазначеної вище функції, а саме: $ arResult [ "PRODUCT_PRICE"] = getFinalPrice ($ arParams [ "PRODUCT_ID"]).

Після того як користувач заповнить форму, що ми отримали:

5.png

І натисне кнопку, що підтверджує її відправку, результати, відправлені ним, будуть доступні тут:

6.png

Найважливіша частина

Ну і тепер ми підійшли до найголовнішого питання: яким же чином на сайті буде відслідковуватися зміна ціни на цікавий для користувача товар? Для цього ми напишемо скрипт, який буде виконувати такі дії:

  • спочатку за допомогою методу CForm :: GetResultAnswerArray () ми робимо вибірку всіх результатів, заповнення нашої веб форми;

  • потім, перебираючи отримані результати, ми беремо зазначені в них ID товарів і за допомогою вже відомої нам функції getFinalPrice () визначаємо, якою є їхня ціна на даний момент;

  • порівнюємо отриману ціну з тією, яка записана у нас в форму на момент підписки, і якщо виявиться, що вона стала менше, то за допомогою методу CEvent :: Send () ініціюємо відправку повідомлення користувачу про це на email, вказаний ним;

  • також, щоб запобігти повторну відправку точно такого ж повідомлення, міняємо застарілу ціну в поточному результаті веб-форми на актуальну;

  • слід також врахувати, що якщо в результаті виконання функції getFinalPrice () нам приходить порожній відповідь, можна зробити висновок про те, що товар з таким ID більше недоступний на сайті, а тому запис з підпискою на нього слід видалити.

В цілому виглядає все приблизно так:

7.png

Для того, щоб наше порівняння відбувалося регулярно, ми скористаємося планувальником завдань Cron (системою для автоматичного запуску програм і скриптів на сервері в певний час) і задамо періодичність, з якою буде виконуватися наш скрипт. Ось, наприклад, команда прописує виконання скрипта кожні 5 годин

8.png

Про "листи щастя"

І наостанок декілька слів власне про лист, що повинен отримати потенційний покупець в разі зниження ціни. Для того щоб ініціювати поштове подія за допомогою функції CEvent :: Send () в першу чергу його потрібно створити. Для цього потрібно перейти в Адміністрування → Установки → Установки продукту → Поштові події → Типи поштових подій → Додати тип.

9.png

Далі створюємо відповідний поштовий шаблон для цього типу поштового події (Адміністрування → Установки → Установки продукту → Поштові події → Поштові шаблони → Додати шаблон).

10.png

Важливо при створенні даного поштового шаблону в "Типі поштового події" вказати потрібний нам тип FOLLOW_PRICE.

От і все! Таким чином у вас на сайті з'явиться досить простий, нехитрий, але в той же час дуже корисний функціонал, здатний повернути вашому інтернет-магазину деяку частку покупці.


Схожі статті
Записатись на консультацію

Ми зв'яжемось з Вами протягом 10 хвилин