Hydrophob.net

Про проєкт

Hydrophob.net — інтернет-магазин продукції Hydrophob із каталогом засобів догляду та окремим розділом для потенційних дилерів. Проєкт охоплює товарну вітрину, матеріали про виробника, відгуки й сценарії покупки. Для нього створено власну тему OpenCart 3.0.3.9, а підготовлену PHP-верстку перенесено на дані й механізми магазину.

Що зроблено

Реалізовано головну, каталог, пошук, картку товару, кошик, оформлення замовлення, сторінки виробника й дилерів, контакти, відгуки, блог та юридичні розділи. Каталог має фільтри, лічильники кількості товарів і пагінацію. Пошукові підказки показують назву, ціну, фотографію та посилання на товар. Слайдери рекомендацій, нещодавно переглянутих і супутніх товарів використовують спільну поведінку.

Картка товару містить галерею та вкладки опису, характеристик, інструкції й відгуків. Склад винесено в окреме поле й показано тегами біля кнопки покупки. Пагінація відгуків працює через AJAX усередині вкладки. Особистий кабінет містить замовлення, обране й дані покупця; вхід, реєстрація та зміна електронної адреси підтверджуються одноразовим кодом.

Контентні блоки редагуються в адмінці через мовні вкладки й повторювані поля. Універсальний модуль першого екрана підтримує одиночний банер або слайдер, FAQ — довільний список питань і відповідей. Заявки дилерів, контактної форми та швидкого замовлення мають спільний облік. «Купити в один клік» створює окрему заявку на товар, зберігає її в адмінці й надсилає лист адміністратору.

Технічні рішення

Архітектура поєднує PHP-контролери OpenCart, моделі даних, Twig-шаблони та модулі, розміщені через макети сторінок. Тексти модулів зберігаються в базі з прив’язкою до мови. Власне односторінкове оформлення послідовно викликає стандартні механізми збереження адрес, вибору доставки й оплати та створення замовлення.

Передбачено способи доставки Новою поштою, Укрпоштою, Meest, кур’єром і самовивіз. Пошта працює через Brevo API. Форми використовують спільну логіку ідентифікації: авторизованому покупцю підставляються контактні дані, а гість може підтвердити себе кодом. Для товарних, рекламних і відеоблоків використано Swiper із завантаженням за потреби.

SEO та швидкодія

Магазин працює українською та російською. Для сторінок, пошуку, фільтрів, сортування й пагінації реалізовано читабельні адреси та перенаправлення зі старих URL. Одиночний фільтр має canonical на себе, а комбінації фільтрів, пошук і цінові діапазони — noindex та canonical на чистий каталог. Шаблони метаданих і режим індексації керуються з адмінки.

Оптимізація охопила мініфікацію CSS і JavaScript, кешування статики, адаптивне зображення першого екрана та відкладений запуск слайдерів, відео й аналітики. Події перегляду товару, початку оформлення та покупки зберігаються в черзі до завантаження аналітичного скрипту. Відео стиснуто, а ролик у картці товару завантажується при наближенні до області перегляду. Для Google Merchant підготовлено товарний фід із гривнею, мовним параметром та ідентифікаторами brand і mpn.

У результаті працює магазин із керованою товарною та контентною частинами, кабінетом покупця і формами для дилерських звернень. Окремі модулі дозволяють редагувати презентацію бренду в адмінці разом із даними каталогу.