«1С-Битрикс: Управление сайтом» — одна из самых популярных систем управления веб-проектами в России. Из коробочных решений является самой нафаршированной различным функционалом системой. Ее используют для разработки корпоративных сайтов и интернет-магазинов, а также крупных интернет-порталов и информационных систем. Примеры крупных магазинов на Битриксе:
Битрикс — платная CMS, на данный момент есть 4 редакции:
- Старт — 5 400 руб.;
- Стандарт — 15 900 руб.;
- Малый бизнес — 35 900 руб.;
- Бизнес — 72 900 руб.
Подробнее о различиях версий писали в статье. Для тестирования есть 30-ти дневная пробная версия, по окончании которой предлагается приобрести одну из версий в течение двух недель.
Кроме того, потестировать CMS можно онлайн — bitrixlabs.ru. На три часа предоставляется доступ к демосайту редакции Бизнес.
Для интернет-магазина подойдет лицензия «Малый бизнес» или «Бизнес», т.к. в них есть необходимый модуль «Интернет-магазин» для создания каталога. Рассказывать о возможностях CMS и различиях редакций не будем, ранее об этом уже писали в статье.
Сегодня поговорим об основных моментах при создании интернет-магазина в рамках нашего тарифа Создание интернет магазина: Индивидуальный дизайн на примере магазина электроники.
1. Торговый каталог
Важнейшая часть интернет-магазина — это его каталог. В Битриксе для создания каталога товаров используется модуль «Торговый каталог». С его помощью можно создавать каталоги товаров и услуг, управлять ценами и скидками, загружать и выгружать данные о товарах. Каталог можно разбить на разделы и подразделы для хранения товаров разных категорий.
В нашем каталоге будут храниться различные товары: от смартфонов до электросамокатов. Как мы понимаем, у этих товаров разные характеристики.
CMS позволяет указать как общие характеристики для всех товаров, так и характеристики, присущие определенному типу продукции.
Информация о товаре заполняется в карточке товара, которую можно настроить под себя — расположить поля там, где вам удобно.
Для товаров, у которых есть различающиеся свойства, помимо общих характеристик (например, телефон с различными вариантами цветов и памяти), предусмотрены торговые предложения. Для работы с торговыми предложениями сперва создается новый инфоблок. Назовем его «Торговые предложения».
После этого в настройках инфоблока «Каталог товаров» на вкладке «Торговый каталог» нужно поставить галочку, что он имеет торговые предложения, и выбрать созданный инфоблок «Торговые предложения».
Для инфоблока «Торговые предложения» мы создаем свойства, которые будем использовать как характеристики товаров: цвет, объем памяти, галерея.
Свойство «Элемент каталога» создается автоматически. Для свойства «Цвет» указываем тип «Справочник», создаем новый справочник и заносим в него названия цветов и иконки. Свойство «Объем памяти» делаем списком и вносим все виды объемов памяти.
После этого мы сможем создавать товары с торговыми предложениями.
Чтобы не создавать одинаковые товары с различными цветами и объемом памяти, Битрикс может автоматически сгенерировать эти товары, подставляя значения из свойств, и для каждого сгенерированного товара можно указать свою цену.
Такими нехитрыми манипуляциями мы создадим довольно объемный и полноценный каталог с различными категориями товаров.
На странице товара есть возможность переключаться между разными товарами по свойствам торговых предложений:
В карточке товаров, добавляем возможность оставлять комментарии и оценку товара. В нашем случае мы реализовали эту возможность только для зарегистрированных пользователей:
В стандартном шаблоне карточка товара с торговыми предложениями выводится только одна, с возможностью выбирать свойства по наведению на карточку. Пример из стандартного шаблона:
Но для нашего интернет-магазина такой вариант не подходит, т. к. пользователь, заходя на страницу каталога, должен иметь возможность сразу видеть все доступные варианты телефонов. Поэтому мы реализовали вывод товаров с торговыми предложениями в разных карточках:
Решение было реализовано нестандартное и довольно непростое. Далее немного углубимся в технические нюансы.
Вывести товары с торговыми предложениями можно, проверяя каждый товар на наличие у него массива с торговыми предложениями. Если есть торговые предложения, то получаем следующий массив:
У товаров без торговых предложений этого массива не будет. Но тут есть один нюанс: по умолчанию Битрикс выводит в массив только первые 5 предложений. Чтобы это исправить, в настройках компонента «Каталог» нужно установить значение «Максимальное количество предложений для показа» — 0.
Получив массив с торговыми предложениями, запускаем цикл для проверки массива, создавая новую карточку и подставляя название, картинку и цену из полученного массива торговых предложений. Также нужно подставлять ссылку на товар. В стандартном шаблоне ссылка ведет на общую страницу товара с отмеченными первыми свойствами торговых предложений, но поскольку мы выводим все карточки по отдельности (Mi 8 32 Гб Розовый, Mi 8 32 Гб Золотой, Mi 8 16 Гб Черный и т.д.), нужно, чтобы пользователь, кликнув по карточке «Mi 8 32 Гб Розовый», попадал на страницу с телефоном, у которого отмечен розовый цвет и объем памяти — 32 Гб. Для реализации данного перехода мы изменили ссылку на товар, добавив к ней параметр с ID торгового предложения. В настройках инфоблока торговых предложений изменяем URL страницы детального просмотра, добавив параметр с ID.
Чтобы при попадании на страницу товара были отмечены конкретные торговые предложения, необходимо внести изменения в JavaScript-код, отметить активными те свойства торговых предложений, чей ID равен ID полученному из адресной строки.
Итак, каталог наполнен товарами и теперь следует дать покупателю возможность фильтровать товары по необходимым для него параметрам. Здесь на помощь приходит компонент «Умный фильтр». В фильтре отображаются только те характеристики, что указаны в характеристиках товаров данного раздела.
Чтобы выбрать свойства для фильтрации в умном фильтре, необходимо в настройках раздела в колонке «Показать в умном фильтре» отметить галочкой нужные свойства.
Больше настроек и изменений стандартного фильтра нам не потребовалось.
2. Товарный маркетинг
Практически в каждом интернет-магазине периодически проводятся акции и предоставляются скидки на товары.
Для работы со скидками и акциями в Битриксе используется модуль «Товарный маркетинг: скидки и акции». Данный модуль имеет богатый функционал:
- скидки на товары, доставку, оплату, зависящую от платежной системы;
- скидки на комбинацию/группы товаров;
- скидки, ограниченные по дате;
- создание купонов на скидки.
Покажем на примере. Создадим скидку в 10 % на группу товаров «Смартфоны» и распространим ее только на зарегистрированных пользователей.
В результате скидку будет видеть только зарегистрированный пользователь:
Все довольно просто. Можно настроить различные варианты скидок (процентные, на определенную сумму), для этого вполне достаточно готового функционала и не требуются какие-то доработки.
3. Сравнение товаров
Для сравнения товаров в Битриксе есть специальные компоненты. Они реализуются с помощью технологии ajax, чтобы количество добавленных товаров в список сравнения динамически изменялось при добавлении и удалении товаров из списка.
На странице сравнения товаров отображаются все заполненные характеристики. Также можно посмотреть только различающиеся характеристики.
4. Список избранных товаров
А вот создание избранных товаров в данной CMS не предусмотрено, поэтому здесь придется реализовывать все самостоятельно либо искать готовые модули на маркетплейс.
Для хранения списка избранных товаров у зарегистрированных пользователей мы использовали дополнительное поле пользователя с типом «Привязка к элементам инф. блоков», куда записывали ID избранных товаров.
Для незарегистрированных пользователей ID выбранных товаров записывается в cookie.
При клике на кнопку добавления товара в избранное, ID-номер выбранного товара записывается в дополнительное поле или в cookie-файлы, и кнопка помечается активной.
В результате на странице с избранными товарами выводятся все товары, чьи ID-номера есть в списке. Таким образом формируется список избранных товаров.
5. Корзина
Все выбранные товары попадают в корзину. В ней сразу происходит пересчет общей стоимости с учетом всех скидок, если они имеются. Также есть возможность ввести купон на получение скидки.
При оформлении заказа пользователь может выбрать адрес доставки, способы доставки и оплаты, ввести информацию о покупателе. Для пользователей, которые уже делали заказ, при оформлении нового сразу подставляются данные с предыдущего, если пользователь авторизован. Это позволяет не вводить одни и те же данные, а изменить их при необходимости.
Для оплаты в Битриксе уже есть готовые способы, среди которых — оплата наличными, по квитанции, по выписанному счету, PayPal, Робокасса, RBK Money, Assist, Яндекс.Деньги, WebMoney, Qiwi и др.
Для доставки есть службы перевозки курьером, самовывоз, СПСР-Экспресс, остальные можно установить из маркетплейса или настроить самостоятельно.
Процесс оформления заказа стандартный. Если нужны какие-либо изменения, это требует крупной переработки всего модуля, что очень трудозатратно. Поэтому чаще всего оформление заказа оставляем без изменений.
Вывод
CMS Битрикс — масштабируемая и многофункциональная система для разработки сайтов. Но она требует большого опыта и квалификации, поэтому может показаться очень сложной для тех, кто с ней малознаком.
Если вы решили создать сайт на CMS 1C-Битрикс — обратитесь к нам, наши сертифицированные специалисты разработают для вас индивидуальный проект. Кроме того, при покупке любого продукта Битрикс у нас, вы получите скидку 15 %.