Поддержка и доработка интернет-магазина электроники TehnikaLux
О проекте
TehnikaLux — интернет-магазин цифровой техники, электроники и аксессуаров на Webasyst Shop-Script. Quadro Design выполняла техническое сопровождение tehnikalux.ru: исправление ошибок темы и плагинов, доработку карточки товара, корзины, доставки и оформления заказа.
В проекте важно было согласовать несколько сценариев: выбор цвета и объёма памяти, покупку основного товара и аксессуаров, оформление на одной странице, быстрый заказ и обращение за обратным звонком. Отдельные направления развития касались маркетплейсов, оптовых покупателей и писем после выполнения заказа.
- Проект
- tehnikalux.ru, интернет-магазин TehnikaLux.
- Тематика
- Цифровая техника, электроника, мобильные телефоны и аксессуары.
- Платформа
- Webasyst Shop-Script, тема магазина и установленные плагины.
- Формат работы
- Техническая поддержка, программирование, исправление ошибок, доработка вёрстки и функциональности.
В кейсе представлены работы с отметками о выполнении, требования к дальнейшему развитию и замечания, появившиеся после первоначальных исправлений.
Задачи сопровождения магазина
- Устранить ошибки в шаблонах карточки товара и товарных списков.
- Исправить работу плагина аксессуаров.
- Привести покупку в один клик и обратный звонок к общему дизайну магазина.
- Восстановить одностраничное оформление заказа после обновления.
- Убрать дублирующиеся кнопки и вернуть покупку рекомендованных товаров.
- Сделать выбор цвета и памяти заметнее.
- Подготовить текстовые значения цвета для товарных выгрузок.
- Доработать доставку, контактную страницу и отображение пункта выдачи.
- Проработать отдельные цены для Ozon и оптовых покупателей.
- Подготовить требования к письму с благодарностью и сбором обратной связи.
Исправление ошибок PHP, темы и плагина аксессуаров
В рамках поддержки разбирались сообщения из PHP- и серверных журналов. Подтверждённые исправления касались карточки товара, списка товаров и обращения к данным плагина аксессуаров.
| Ошибка | Участок работы | Статус в задачах |
|---|---|---|
| count(): Parameter must be an array or an object that implements Countable | Обработка данных в шаблоне товарного списка list-thumbs.html. | Отмечено как исправленное. |
| Non-static method shopAccessoriesPlugin::getAccessoriesByProduct() should not be called statically | Вызов метода плагина аксессуаров в карточке товара. | Отмечено как исправленное. |
| Undefined index: features | Обращение к характеристикам в шаблоне списка товаров. | Отмечено как исправленное. |
| Undefined index: vendor | Обращение к значению vendor в шаблоне карточки товара. | Повторяющиеся сообщения отмечены как исправленные. |
Отдельная задача по ошибке плагина аксессуаров также отмечена как выполненная. Увеличена ширина полей ввода характеристик, чтобы с ними было удобнее работать.
Дополнительные сообщения серверного журнала
В исходных обращениях присутствовали ещё две группы ошибок:
- Отсутствие файлов уменьшенных изображений товаров, включая варианты изображений с суффиксом @2x.
- Connection refused при подключении к FastCGI upstream.
Эти сообщения сохранены как отдельные диагностические случаи. В документе нет самостоятельной отметки о завершении исправлений для всей этой группы.
Карточка товара: цвет, память, аксессуары и стикеры
Более заметный выбор характеристик
Для карточки модели дорабатывался блок выбора цвета и объёма памяти. Увеличение и перевёрстка блока отмечены как выполненные.
- Цветовые круги увеличены, чтобы варианты товара были заметнее.
- Выбор объёма памяти выделен более явно.
- Для выбранного варианта предусмотрено хорошо различимое оформление.
- В качестве ориентира использовалось представление цвета с кругами и текстовым названием выбранного оттенка.
- Отдельно требовалось перенести название цвета к самому блоку выбора, вместо его отображения ниже.
Визуальный цвет и текстовое значение
Выполнена задача дублирования характеристики цвета: в магазине должны использоваться два представления одного значения.
| Представление | Назначение |
|---|---|
| Цветовой круг | Визуальный выбор варианта в карточке товара. |
| Текстовое название цвета | Передача понятного значения в характеристиках и товарных выгрузках, включая подготовку данных для Ozon. |
В ТЗ требовалось использовать существующие значения цвета из карточек моделей, чтобы подготовить текстовую характеристику для выгрузки. Дублирование значений отмечено как готовое; постоянная автоматическая синхронизация двух характеристик отдельно не описана.
Аксессуары в карточке модели
Исправлялись работа плагина аксессуаров и отображение связанных товаров. Отдельная задача касалась горизонтальной полосы прокрутки в блоке групп аксессуаров.
Первоначально исправление прокрутки было отмечено как готовое, но затем заказчик сообщил, что полоса осталась, а группы аксессуаров перестали помещаться в одну строку. Для этого участка сохранён запрос повторной проверки.
Стикеры товаров
Плагин товарных стикеров интегрирован в используемую тему магазина. Задача отмечена как выполненная.
Кнопки покупки
- Форма и кнопка покупки в один клик приведены к общему стилю сайта.
- Из карточки товара убрана лишняя повторная кнопка «Купить в один клик».
- Отдельно устранено дублирование этой кнопки в товарной категории.
Корзина и оформление заказа на одной странице
После обновления требовалось восстановить ранее используемую одностраничную схему покупки. Задача по вёрстке и настройке такого оформления отмечена как выполненная.
В качестве ориентира использовалась страница, объединяющая состав корзины, данные покупателя, доставку, подтверждение и рекомендации товаров.
Структура оформления
- Список товаров с выбранными характеристиками, количеством и возможностью удаления.
- Переход между быстрым и подробным оформлением.
- Поля данных покупателя.
- Выбор способа доставки.
- Адресные поля, соответствующие выбранному способу.
- Комментарий к заказу.
- Раздельное отображение стоимости товаров, доставки и итоговой суммы.
- Кнопка «Оформить заказ».
- Блок рекомендованных товаров.
Покупка рекомендованных товаров
В корзине восстановлены кнопки покупки для рекомендованных товаров. Обращение возникло из-за того, что товары показывались, но добавить их через соответствующую кнопку было невозможно. Исправление отмечено как выполненное.
Компактная страница
Выполнена отдельная задача сделать страницу оформления более компактной. Это направление объединяло упорядочивание блоков, кнопок и полей без изменения самого сценария одностраничного заказа.
Информационные ссылки и текст подтверждения
В исходных обращениях отмечалась проблема информационных страниц из корзины, включая страницу условий продажи по адресу /garantija/usloviya-prodazhi-v-internet-magazine/.
Подтверждено изменение текста возле кнопки оформления: из него убрано упоминание условий договора и услуг связи. По ТЗ оставлена следующая формулировка:
Нажимая «Оформить заказ», я подтверждаю, что ознакомлен с информацией о товаре и принимаю условия договора купли-продажи и даю согласие на обработку моих персональных данных.
Замена текста отмечена как выполненная. Исправление всех связанных информационных ссылок отдельно не подтверждено.
Обратный звонок, быстрый заказ и элементы интерфейса
Единый стиль форм
Выполнены доработки покупки в один клик и обратного звонка под общий дизайн интернет-магазина. Эти формы должны выглядеть как часть одной темы вместе с карточкой товара, корзиной и оформлением заказа.
Чат и кнопка возврата наверх
Исправлено наложение виджета чата на стрелку возврата наверх. Задача отмечена как выполненная.
Поиск в шапке
Отдельно поставлена задача исправить отображение поиска в шапке: заказчик указал на некорректную вёрстку в Safari и приложил изображение. Для этого обращения сохранена отметка о необходимости повторной проверки.
Регистрация
В ответ на запрос добавления CAPTCHA при регистрации в переписке указано, что такая защита уже установлена. Этот пункт относится к существующей функциональности магазина.
Обновление Shop-Script
В ТЗ присутствовало требование обновить Shop-Script до актуальной на соответствующем этапе версии. Конкретная установленная сборка и отдельная отметка о завершении обновления не указаны. При этом восстановление одностраничного оформления после обновления отмечено как готовое.
Доставка, пункт выдачи и контактная страница
Поле станции метро
Для доставки в пределах МКАД требовалось добавить строку «Станция метро». Используемый плагин доставки изначально не предусматривал это поле. Соответствующая доработка отмечена как выполненная.
Оформление вариантов доставки
Для блока доставки выполнена задача изменения внешнего вида кнопок:
- Сделать варианты более прямоугольными и вытянутыми.
- Усилить визуальное выделение выбранного способа.
- Увеличить толщину линии выделения.
- Убрать значок вопроса возле заголовка блока.
В материалах показаны самовывоз, обычная и срочная доставка в пределах МКАД. В макете одностраничного оформления также представлены доставка за МКАД, доставка по России и самовывоз из пункта выдачи.
Изменение пункта выдачи
На странице /kontakty/ требовалось заменить адрес пункта выдачи и обновить карту. Задача первоначально отмечена как выполненная, после чего заказчик уточнил требования к карте и маршруту.
| Данные из ТЗ | Адрес и ориентиры |
|---|---|
| Новый пункт выдачи в обращении | Москва, метро «Пролетарская» и «Крестьянская Застава», улица Воронцовская, 35Бк2, офис 204. |
| Прежний адрес, указанный для замены | Москва, метро «Автозаводская», улица Ленинская Слобода, дом 26. |
Эти адреса приведены как содержание исторической задачи по переносу пункта выдачи.
Требования к карте
- Исправить неверное местоположение.
- Разместить карту почти на всю ширину страницы.
- Использовать согласованное представление карты из приложенного примера.
- Учесть требование быстрой загрузки.
- Показать пеший маршрут от метро.
- Выделить маршрут красной линией.
- Указать вход через торгово-офисный центр.
После первоначальной отметки о выполнении в переписке остался запрос повторной проверки ширины карты, её оформления и маршрута. Измеренный результат по скорости загрузки не приводился.
Подготовка товарных данных и выгрузок для маркетплейсов
Развитие магазина включало требования к размещению товаров на Яндекс Маркете, Avito и Ozon. Для этих направлений важно различать подготовку данных, подключение плагина и завершённую рабочую выгрузку.
Яндекс Маркет
Поставлена задача настроить выгрузку с передачей цвета и комплектации товара. В приложенном примере эти параметры отображались у конкретного предложения магазина и помогали различать варианты модели.
- Передавать цвет товара как понятное текстовое значение.
- Передавать комплектацию соответствующего предложения.
- Сохранять соответствие выгружаемых характеристик выбранному варианту товара.
Для этой настройки нет отдельной отметки о выполнении.
Avito
Заказчик запросил возможность выгружать товары на Avito по аналогии с товарной выгрузкой на Яндекс Маркет. В переписке уточнялось, требуется ли настройка самой выгрузки или её автоматизация.
В качестве технических ориентиров приведены формат автозагрузки Avito и сервис проверки XML. Завершение настройки или автоматического запуска не подтверждено.
Ozon
Плагин Ozon установлен и подключён. Однако на зафиксированном этапе он проходил обновление и тестирование сотрудниками Webasyst, поэтому выгрузка товаров на Ozon тогда была невозможна.
Для дальнейшего подключения сформулированы требования:
- Использовать отдельную цену для Ozon по аналогии с отдельной ценой для регионов.
- Настроить выбор этой цены плагином выгрузки.
- Сохранить общий склад и общее количество товара: отдельная цена не должна означать отдельный остаток.
- Заполнить штрихкоды в характеристиках товаров.
- При наличии системной характеристики штрихкода использовать её вместо создания дублирующего поля.
- Представлять цвет текстовым названием, пригодным для передачи в характеристиках Ozon.
Дублирование визуальной и текстовой характеристик цвета отмечено как выполненное. Рабочая выгрузка на Ozon и завершение настройки отдельных цен в документе не подтверждены.
Оптовые цены с доступом по категории покупателя
Для оптовых клиентов описан отдельный сценарий цен и доступа. Управление доступом должно выполняться через категорию контакта.
- Сотрудник магазина добавляет покупателя в категорию «ОПТ» в контактах.
- После назначения категории покупателю становится доступна оптовая цена на сайте.
- Оптовый клиент видит обе цены: обычную и оптовую.
- Покупку такой клиент может оформлять по оптовой цене.
В административной части рядом с существующими ценами должна появиться отдельная колонка «Цена оптовая».
На витрине оптовая цена предназначена только для покупателей, которым магазин предоставил соответствующий доступ. Само наличие колонки не должно открывать её всем посетителям.
Это согласованные требования к функциональности. Отметки о завершении реализации в документе нет.
Письмо после выполнения заказа и сбор обратной связи
Для заказа, переведённого в статус «Выполнен», описано автоматическое письмо с благодарностью за покупку и предложением оставить отзыв. В материалах приведены исходный визуальный ориентир и макет письма TehnikaLux.
Содержание письма
- Логотип TehnikaLux.
- Персональное приветствие.
- Благодарность за покупку в магазине.
- Ссылка на личный кабинет.
- Предложение поделиться впечатлением.
- Два визуальных блока с эмоциональными иллюстрациями и отдельными действиями.
- Информация о заказе: номер, дата, статус и переход к просмотру статуса.
- Контактный телефон и сайт магазина.
Два направления обратной связи
| Действие покупателя | Назначение перехода |
|---|---|
| «Хочу дать совет» | Обращение на электронную почту магазина с замечанием или предложением. |
| «Мне всё понравилось» | Переход к форме отзыва о магазине на Яндекс Маркете. |
Уточнения к дизайну и вёрстке
- Увеличить логотип.
- Заменить общий серый фон на белый.
- Оставить серый фон у блоков со смайликами и информацией о заказе.
- Убрать отображаемый email из нижней контактной зоны.
- Сделать телефон и адрес сайта крупнее.
- Добавить к телефону и сайту соответствующие изображения или значки.
- Оформить смайлики и действия как кнопки.
- Исправить отображение этих элементов в фактически полученном письме.
Удаление email из контактной зоны не отменяет отдельного перехода для отправки совета на почту магазина.
В переписке осталось замечание о ненастроенной обратной связи и некорректном отображении кнопок после получения письма. Окончательная настройка переходов, автоматической отправки и приёмка всей цепочки не подтверждены.
Последующие уточнения и направления развития
После отдельных исправлений заказчик возвращался к проверке интерфейса. Эти замечания сохраняются в истории проекта вместе с требованиями к ещё не подтверждённым интеграциям.
| Направление | Что требуется завершить или проверить |
|---|---|
| Аксессуары в карточке модели | Устранить оставшуюся горизонтальную прокрутку и проверить размещение групп аксессуаров после первоначального исправления. |
| Поиск в шапке | Повторно проверить отображение в Safari. |
| Название выбранного цвета | Проверить размещение текстового названия рядом с цветовым выбором по согласованному ориентиру. |
| Контактная страница | Проверить новый адрес, ширину карты, красную линию пешего маршрута и обозначение входа. |
| Информационные ссылки в корзине | Проверить открытие страниц условий продажи после изменения текста подтверждения. |
| Серверные ошибки | Разобрать отсутствие файлов изображений и ошибки подключения к FastCGI, для которых нет отдельных отметок о завершении. |
| Яндекс Маркет | Завершить передачу цвета и комплектации в выгрузке. |
| Avito | Уточнить объём автоматизации и завершить настройку товарной выгрузки. |
| Ozon | После готовности плагина проверить выгрузку, отдельные цены, штрихкоды и использование общего остатка. |
| Оптовые продажи | Реализовать отдельную цену с доступом по категории «ОПТ» и отображением обеих цен для оптового покупателя. |
| Письмо после покупки | Завершить вёрстку, переходы обратной связи и отправку при статусе «Выполнен». |
Результат подтверждённых работ
В рамках сопровождения TehnikaLux выполнены доработки, отмеченные в задачах как готовые:
- Исправлены указанные ошибки PHP в карточке товара и товарных списках.
- Скорректирована работа плагина аксессуаров.
- Увеличены поля ввода характеристик.
- Интегрирован плагин товарных стикеров.
- Увеличен блок выбора цвета и памяти, продублирована характеристика цвета для визуального и текстового представления.
- Покупка в один клик и обратный звонок приведены к общему стилю магазина.
- Убраны дублирующиеся кнопки быстрого заказа.
- Восстановлены кнопки покупки рекомендованных товаров.
- Настроено одностраничное оформление после обновления.
- Изменён текст подтверждения возле кнопки заказа.
- Выполнены доработки поля станции метро, внешнего вида вариантов доставки и компактности страницы.
- Устранено перекрытие стрелки возврата наверх виджетом чата.
Следующие направления развития описаны отдельно: товарные выгрузки, цены Ozon при общем остатке, доступ к оптовым ценам и письмо для получения обратной связи после покупки.
Поддержка интернет-магазинов на Webasyst Shop-Script
Quadro Design помогает дорабатывать существующие магазины: исправлять ошибки темы и плагинов, улучшать карточки товаров и оформление заказа, адаптировать характеристики и развивать интеграции с учётом правил бизнеса.
Программирование и доработка сайтов · Другие кейсы доработки интернет-магазинов
