Тема для ветеринарной аптеки v-apteka.ru

Задача

Ветеринарная аптека — это не обычный интернет-магазин. Ассортимент здесь измеряется тысячами позиций: препараты от блох и клещей, вакцины, антибиотики, витамины, корма, средства ухода. Один и тот же товар покупатель ищет по-разному — по бренду, по виду животного, по назначению. Поэтому базовой сеткой категорий из коробки InSales не обойтись: покупателю нужно быстро сузить огромный каталог до пары нужных упаковок, а магазину — не запутать его лишними разделами и не потерять на этом мобильный трафик.

Отдельная специфика ниши — рецептурные препараты. Часть ассортимента отпускается по назначению ветеринара, и это нужно честно показывать прямо в каталоге, а не прятать в описании. Задача сводилась к тому, чтобы собрать под облачную платформу InSales тему, в которой большой каталог остаётся управляемым, навигация подстраивается под то, как ищут владельцы животных, а рецептурная маркировка и определение города работают без ручных действий со стороны клиента.

Функциональные решения

Прежде чем верстать шаблоны, мы разложили каталог на две независимые оси навигации — по виду животного и по бренду — и заложили механику, которая работает штатными инструментами InSales, без сторонних приложений и хрупких костылей.

Меню по типу животного

Владелец собаки и владелец грызуна приходят в аптеку за разным. Чтобы не заставлять их фильтровать общий список, мы добавили отдельное меню каталога по типу животного — для собак, кошек, грызунов и так далее. На десктопе оно живёт в основной навигации, а на мобильных, где горизонтального места нет, аккуратно уезжает в сайдбар, чтобы не съедать первый экран и не ломать вёрстку карточек.

Умные категории для брендов

Бренды реализовали через умные категории InSales. Вместо того чтобы вручную собирать и поддерживать страницу каждого производителя, категория автоматически подтягивает все товары по параметру «бренд». За каждой такой страницей закреплён уникальный пермалинк — это даёт чистые адреса для брендовых разделов и опрятную структуру каталога, которая расширяется сама по мере пополнения ассортимента.

Лейбл «Рецептурное»

Для препаратов, которые отпускаются по назначению ветеринара, мы вывели отдельный лейбл прямо в карточку и в плитку каталога. Покупатель видит статус товара ещё до перехода в карточку и заранее понимает, что для покупки понадобится рецепт, — это снимает лишние вопросы и возвраты на этапе оформления.

Геоопределение города

При оформлении заказа город определяется автоматически. Клиенту не нужно искать себя в длинном списке — поле подставляется само, и оформление идёт на один шаг короче.

Упрощение интерфейса

Второй пласт работы — убрать из шаблона всё, что отвлекает от товара и замедляет страницу. В каталоге и карточке мы сознательно отказались от декоративных элементов в пользу скорости и ясности:

• Убрали баннерные перебивки из каталога
• В карточках товаров оставили только главное фото — без слайдера
• Убрали боковую колонку и лишние вкладки в карточке товара
• Объединили описание и характеристики
• Отзывы без указания города
• Блог и новости объединили в единый раздел с тегами

Техническая реализация

Тема собрана mobile-first: сначала мы проектировали и отлаживали мобильный макет, а десктоп надстраивали поверх него. Динамические данные — меню, лейблы, брендовые подборки — выводятся через Liquid, а стили держали в узде, чтобы вёрстка оставалась лёгкой и предсказуемой на всех экранах.

• Mobile-first подход — акцент на быстродействие мобильной версии
• Оптимизация кода — минимизация медиа-запросов
• Liquid — для вывода динамических данных
• Кроссбраузерность — проверка в Chrome, Firefox, Safari, Edge

Результат

На выходе — тема, в которой большой ветеринарный каталог не давит на покупателя, а мобильная версия остаётся быстрой:

• Быстрая мобильная версия
• Удобная навигация по типу животного
• Автоматические страницы брендов через умные категории
• Понятная маркировка рецептурных товаров
• Упрощённый интерфейс каталога и карточки товара