RealChem — бренд и вёрстка магазина

О проекте

RealChem — интернет-магазин химической продукции, для которого разработан интерфейс и продолжена его интеграция с OpenCart 3. Реализованная часть охватывает товарные страницы, корзину, авторизацию и личный кабинет. Отдельно проработано администрирование: редактирование главной страницы, публикаций блога и приветственного видео вынесено в собственные формы.

Что сделано

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

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

Приветственное видео оформлено как накладка на главной странице. В административной части задаются видео и постер, а частота показа учитывает cookie. Накладка появляется при наличии видеофайла; учёт показа связан с фактическим отображением материала.

Технические решения

Тема использует Twig-шаблоны и стили Tailwind. Для кабинета подготовлен общий контроллер навигации, который получает активный раздел. Авторизация вынесена в отдельные контроллеры и модальные окна, а коды подтверждения хранятся в сессиях OpenCart в базе данных. Клиентский сценарий запуска подтверждения общий для входа и работы с email.

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

Контент блога редактируется как набор абзацев через повторяющиеся поля и хранится в формате JSON. Для публикаций предусмотрены языковые SEO-адреса. В управлении макетами добавлено изменение порядка перетаскиванием, а блог и тизер получили собственные пункты административного меню.

SEO и производительность

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

В корзине размер миниатюр увеличен до 128 × 128, чтобы фотографии соответствовали подаче товаров в новом интерфейсе. Приветственный тизер подключается на уровне главной страницы, а его содержимое и правила показа управляются через настройки магазина.

На этом этапе RealChem объединяет собственную тему OpenCart, кабинет со входом по коду и средства повседневного редактирования контента. Реализованные формы позволяют менять блоки главной, тексты блога и приветственное видео из административной части.