Разработка и доработка маркетплейса G4Sky на Webasyst

Маркетплейс на английской витрине с сохранением русского магазина

На этапе постановки задачи G4Sky использовал Shop-Script 9: одна административная панель обслуживала два домена — G4Sky.ru и G4Sky.net. Сайт размещался на виртуальном хостинге Timeweb. Заказчик хотел добавить возможность продавать собственные товары сторонним продавцам, ориентируясь на модель площадок вроде eBay и Авито.

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

Вход через кнопку Sell

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

Расположение и размеры кнопки впоследствии доработали отдельно для компьютеров и телефонов. Это позволило учитывать не только наличие входа в кабинет, но и его размещение в уже существующей шапке G4Sky.

Английский интерфейс и цены в долларах

В требования к кабинету вошли английский язык и работа с ценами в долларах США. Выбор рублей продавцу предоставлять не требовалось. Отдельное внимание уделялось текстам настроек, уведомлений и служебных сообщений, чтобы английский интерфейс не смешивался с русскими подписями.

Заказчик также поставил условие сохранить корректную работу действующего сайта и не ухудшать скорость витрины и административной панели при подключении плагина.

Кабинет продавца: собственные товары, заказы и модерация

Разделение доступа между продавцом и владельцем площадки

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

Выбор категорий и типов товаров ограничивался английской витриной. Категории, типы и другие элементы, относящиеся к русскому магазину, не должны были попадать в этот интерфейс. При переносе плагина на рабочий сайт требовалось использовать реальные характеристики и категории G4Sky с сохранением их установленного порядка, а не данные тестового каталога.

Публикация после проверки администратором

Согласованная модель предусматривала скрытое состояние нового товара. Продавец заполняет карточку, а владелец площадки проверяет её и самостоятельно открывает для показа на витрине. При этом продавцу должна оставаться возможность редактировать или удалить собственный товар.

Для настройки New Product Status отдельно обсуждалось английское отображение вариантов состояния товара. В материалах проекта показаны значения Visible, Hidden и Hidden and unavailable (404).

Несколько артикулов и выбор параметров

В первоначальном задании продавцу требовались оба способа работы с вариантами товара: Purchase options и Selectable parameters. Это позволяло описывать несколько артикулов в одной карточке, а не создавать отдельный товар для каждого сочетания параметров.

В ходе сопровождения разъяснили и отображение нескольких строк под одним товаром: они относятся к его артикулам, для которых могут указываться отдельные цены и остатки. Чтобы различать такие строки, рекомендовали задавать артикулам понятные наименования.

Доступ к вкладкам редактора также оговаривался отдельно: на первом этапе продавцу требовались все вкладки, кроме «Рекомендуемые товары» и «Подстраницы». Позднее заказчик уточнил ограничения отдельных кнопок и полей — эти изменения описаны в разделе о характеристиках и редакторе.

Ссылка на условия продажи

Дополнительное требование к личному кабинету — ссылка или сноска на страницу с условиями продажи товаров на G4Sky. Подтверждение размещения этой ссылки в переданной истории работ отсутствует; пункт сохранён как требование к кабинету.

Исправление цен, остатков и быстрого сохранения товаров

Сохранение изменений без смешивания артикулов разных товаров

В списке товаров кабинета продавца предусмотрено быстрое редактирование полей Price, Compare Price и Stock. При последовательном изменении сначала одного, затем другого товара возникала ошибка: артикул одной карточки присваивался другой.

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

Повторное изменение цены и ошибки кнопки Save

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

Также исправили быстрые изменения цены и количества через кнопку Save, сопровождавшиеся сообщениями об ошибке. В первоначальных проверках появлялись русские сообщения, включая отказ в доступе. Быстрое сохранение восстановили.

Начальный остаток при создании нового товара

У нового товара значение Stock первоначально не сохранялось сразу: сначала требовалось создать карточку, затем повторно открыть её и указать количество. Исправили сохранение остатка при первом добавлении товара.

Доработка убрала необходимость повторно заходить в только что созданную карточку ради заполнения уже введённого количества.

Зачёркнутая цена вместо неверной подписи Purchase price

В списке товаров поле, предназначенное для зачёркнутой цены, было подписано Purchase price, то есть «Закупочная цена». Исправили его обозначение на соответствующее назначению поля — Compare Price.

В результате в этом интерфейсе различаются текущая цена продажи, зачёркнутая цена и остаток. Изменение относилось к конкретному полю списка товаров, а не к удалению закупочных цен из Shop-Script.

Характеристики, варианты товара и ограничения редактора

Устранение ошибки 500 при переходе между вкладками

В плагине «Маркетплейс» на английской витрине возникала ошибка 500 при добавлении товара. Она проявлялась после перехода в «Выбор параметров», а затем во вкладку «Характеристики» или «Фото/Видео».

Исправили этот сценарий переключения вкладок. Задача затрагивала последовательность работы продавца с параметрами, характеристиками и изображениями в одной карточке.

Корректные названия артикулов по цветам

Устранили ошибку сохранения названий артикулов при использовании Selectable parameters и параметра Color. Выбранные оттенки цвета должны были соответствовать названиям созданных вариантов, но до исправления эти названия сохранялись некорректно.

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

Light и Stand: скрыть в Features, оставить в выборе параметров

По уточнённому требованию скрыли характеристики Light и Stand во вкладке Features кабинета продавца. При этом те же параметры требовалось сохранить в разделе выбора вариантов товара.

Ограничение было адресным: убрать пункты из одной вкладки, не исключая саму возможность выбора соответствующей комплектации через параметры. Это важно для товаров с вариантами наличия подсветки или подставки.

Удаление лишних полей и действий из интерфейса продавца

Чтобы ограничить редактирование общих элементов каталога и убрать ненужные продавцу настройки, выполнили несколько самостоятельных изменений:

• Убрали блок Custom parameters внизу вкладки Description & SEO.
• Убрали пункт New feature во вкладке Features, через который продавец мог добавлять новые характеристики.
• Скрыли пункты характеристик в меню More, открывающемся через шестерёнку в блоке Prices & availability вкладки Basics.
• По последующему запросу скрыли кнопку + Add purchase option во вкладке Basics.

Настройки редактора уточнялись поэтапно: первоначальная задача охватывала оба способа задания артикулов, а последующие правки ограничивали конкретные действия продавца. Запросы на скрытие элементов не были заданиями на удаление характеристик и существующих артикулов из магазина.

Заказы и email-уведомления в кабинете продавца

Просмотр заказов с собственными товарами

В требованиях к площадке заказ должен появляться у продавца, если в его составе есть добавленный этим продавцом товар. Сам заказ доступен для просмотра, но не для редактирования продавцом.

В существующем интерфейсе заказа исправили отсутствие адреса доставки. Дополнительно изменили формат количества в колонке Qty: вместо значения вида 1.000 стали отображать целое число 1.

Контактные данные без лишних переходов

Имя покупателя и его email в просмотре заказа сделали обычным текстом вместо активных ссылок. Это изменение убирало переходы из конкретного блока, но не означало удаления самих контактных данных.

Из списка заказов убрали ненужный значок «Почта России». Отдельно удалили графические значки статусов заказов на компьютерах и телефонах — зелёные кружки, фиолетовые галочки и другие обозначения, которые заказчик просил не выводить.

Уведомление о новом заказе и редактируемый шаблон письма

Для продавца предусматривалось email-уведомление при поступлении заказа с его товаром. Отправку проверяли тестовым заказом: продавец получил письмо. Содержимое уведомления можно изменять в настройках плагина.

Заказчик также просил привести оформление письма к дизайну уведомлений основной витрины. В истории работ зафиксированы получение письма и возможность редактировать шаблон, а окончательное совпадение дизайна с витриной отдельно не подтверждено.

В административной панели перевели на английский язык служебную запись истории заказа об отправке уведомления поставщику. Эта правка относится к тексту события в заказе, а не к изменению состава получателей письма.

Адаптивная вёрстка и оформление кабинета продавца

Расположение и оформление кнопки Sell

Кнопку Sell переместили влево, перед именем пользователя. В мобильной версии уменьшили её размер, чтобы она помещалась в верхнюю строку шапки.

По согласованному оформлению для кнопки задали насыщенность шрифта 500, размер текста 16 px и скругление углов 7 px. Это точечная настройка существующего интерфейса, а не замена дизайна всей витрины.

Выравнивание товарных строк и служебных элементов

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

Добавили пробел после подписи Link:, чтобы она не сливалась с адресом карточки. Под шапкой кабинета убрали ссылку Homepage. Также удалили всплывающее окно «Редактировать», которое появлялось при наведении на значок карандаша возле статуса товара.

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

Кнопка Save и сообщения о сохранении

Заказчик просил сделать Save заметнее и разместить её по центру, в том числе на вкладках редактирования товара. Отдельная проблема возникала после нажатия: кнопка смещалась, а индикатор успешного сохранения оказывался далеко справа.

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

Мобильная панель продавца и таблица заказов

В мобильном кабинете блок Seller’s dashboard смещался вправо. Исправили его положение, вернув выравнивание к левой стороне, как в компьютерной версии.

Столбец Buyer в списке заказов скрыли только на телефонах; в компьютерной версии его требовалось оставить. Вместе с изменением кнопки Sell и удалением лишних значков это составляло отдельный набор правок мобильного интерфейса.

Согласование формы входа и возможность CSS-правок

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

Также согласовали возможность дальнейшего изменения оформления кабинета через CSS. Заказчику было важно иметь возможность самостоятельно корректировать внешний вид после подключения функционала.

Изображения товаров и стабильность отображения двух витрин

Миниатюры с фотографиями разных пропорций

В миникарточках товаров возникало небольшое смещение фотографий во время загрузки страницы. Оно было особенно заметно на телефонах и при использовании вертикальных прямоугольных изображений.

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

Дополнительная проверка товарных блоков на странице товара

После первых исправлений заказчик сообщил, что в мобильных версиях обеих витрин смещения сохранились в миникарточках трёх блоков под товаром: Cross-selling, Upselling и ещё одного блока рекомендаций, название которого в обращении не уточнялось.

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

Горизонтальные смещения после обновления Chrome

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

Первую правку связали с поведением полосы прокрутки и отметили выполненной. Однако заказчик повторно заметил небольшие смещения даже после очистки данных браузера и проверки в режиме инкогнито. В Яндекс Браузере он их не наблюдал.

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

Фотоотзывы и короткие видеоотзывы: требования к развитию магазина

Статус: поставленная задача, завершение внедрения не подтверждено.

Фотографии покупателей во вкладке «Отзывы»

Заказчик запросил возможность прикладывать собственные фотографии товара к отзыву на его странице. Доработка должна была работать одновременно на G4Sky.net и G4Sky.ru, непосредственно в существующей вкладке «Отзывы».

На момент обращения в документе указаны Webasyst 2.9.7.816, Shop-Script 9 и PHP 7.4.33. В административной панели уже присутствовала настройка загрузки изображений к отзывам, но используемая тема дизайна не предоставляла эту возможность в форме на витрине.

Таким образом, требование касалось поддержки фотоотзывов в существующей теме с учётом настроек магазина, а не только появления кнопки выбора файла.

Управление фотоотзывами и модерацией

Для администратора требовалось сохранить управление функцией: включать и выключать фотоотзывы, удалять их через административную панель, а также включать и отключать предварительную модерацию. Эти настройки должны были корректно влиять на работу формы в обеих витринах.

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

Короткие видео от покупателей

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

Публичная страница продавца с его товарами

Статус: отдельное техническое задание, завершение внедрения не подтверждено.

После разработки плагина «Маркетплейс» заказчик предложил добавить на английскую витрину публичную страницу продавца. Она отличается от личного кабинета: это страница для посетителей магазина, на которой собран ассортимент конкретного продавца.

Структура страницы на основе категории товаров

За основу предлагалось взять страницу категории PLUSH и изменить её структуру под продавца. Вместо названия категории в заголовке должно отображаться его название. Способ задания этого названия в настройках плагина ещё требовал согласования.

Под заголовком слева предполагалось разместить аватарку или логотип продавца с возможностью самостоятельно загрузить, заменить или удалить изображение. Справа от этого блока должны выводиться только товары, которые продавец добавил через плагин «Маркетплейс».

Собственный ассортимент без фильтров исходной категории

Фильтры, присутствующие на странице категории-образца, на странице продавца выводить не требовалось. Основными элементами оставались его название, изображение и товарный список.

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

Результаты разработки и сопровождения G4Sky

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

Отдельный результат — изменения интерфейса: ограничения полей и кнопок продавца, отображение адреса и количества в заказе, редактируемый шаблон уведомления, положение Sell и Save, выравнивание товарных строк и мобильной панели. Эти задачи показывают развитие уже созданного кабинета на основе конкретных сценариев работы.

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

Нужна похожая доработка на Webasyst?

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

Подробнее об услуге — программирование и доработка сайтов на Webasyst. Другие проекты представлены в портфолио Quadro Design.