Магазин техники на Bitrix. Большие страницы товаров и сторис.2026

Apple Inside

jQueryJavaScriptSwiperCSSBitrixFlask

Apple Inside — магазин техники на Bitrix, без сборщиков: jQuery и статика. Начинал с A+ контента: большие страницы товаров с видео, анимацией и вёрсткой под конкретный девайс. Первая такая страница собиралась два рабочих дня. Бóльшая часть времени — на то, чтобы разобраться, как к ней подступиться.

Из этого выросла общая основа, когда задача разрослась до 6 контентников разом: набор классов под типовую сетку и слой поведения — автоплей видео, анимация по вьюпорту, ленивая загрузка со скелетоном. Всё специфичное для страницы (цвета, градиенты, пропорции) остаётся внутри неё. С этой основой новая страница собирается за три-шесть часов, на сложных макетах — дольше.

A+ контент живёт только внутри Bitrix. Разрабатывать его неудобно: чтобы увидеть результат, надо выложить. Поднял локальный бэкенд: он берёт разметку обычной страницы товара, вставляет в неё мою вёрстку и подменяет прод-ссылки на медиа локальными. Страница выглядит так же, как на проде, — проверка без выкладки.

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

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

Открыть проект