Как известно компонент Zoo — это отличный конструктор контента от Yootheme. С помощью него можно без труда сделать каталог, блог, вопрос-ответы…. А при желании вообще что угодно. Одним словом — конструктор! (или как принято говорить в «забугорье» — CCK, Сontent Сonstruction Kit).
Но вот беда, авторы компонента предусмотрели почти все, но не хватает самого главного — корзины и хорошего поиска по сайту с фильтром. Сегодня мы поговорим о корзине, т.к. именно она является неотъемлемой частью любого интернет магазина, именно она нужна чтобы ваш магазин приносил доход.
Мы решили восполнить этот пробел и разработали конструктор корзины JBZoo, который готовы вам продемонстрировать.
Преимущества корзины JBZoo
Не будем тянуть кота за хвост, а сразу перейдём к сути. Чем хороша корзина JBZoo:
- Есть два элемента цены - JBPrice Plain и JBPrice Calc. Об их различиях читайте в документации.
- Он умеет показывать стоимость товара в разных валютах. Конвертирование происходит «на лету». Данные берутся из различных сервисов валют.
- Есть специальное поле для ввода артикула.
- По элементу можно фильтровать, например, через слайдер диапазоны.
- Элемент цены при себе имеет кнопку «В корзину».
- Добавление и удаление происходит без перезагрузки страницы (AJAX).
- Учитываются остатки на складе.
- Поддерживается импорт в CSV, где ключом может выступать артикул.
-
Можно создать несколько вариаций для одного товара.
-
Скидка указывается как в процентах, так и в любой валюте.
- Есть элемент, с помощью которого на сайте будут отображаться флаги валют.
- Модуль корзины Zoo
- Всегда показывает актуальное состояние корзины, т.к. автоматически обновляется без перезагрузок страницы
- Выводит краткую информацию о количестве товаров, лотов и общей стоимости покупок.
- В настройках можно выбрать валюту, в которой будет отображаться сумма.
- Можно также в настройках указать какие-либо параметры товара и его изображение.
- Список товаров в корзине
- Есть отдельная страница с общим списком товаров, где можно изменять состав и количество своего заказа.
- Все интерактивно работает через AJAX. Согласитесь, перезагружать страницу по каждому клику — это вчерашний день.
- Можно без проблем ограничить заказ только для авторизованных пользователей.
- Форма заказа JBZoo
- Форма заказа основана на системе подачи материалов Zoo, поэтому легко можно настроить свой набор полей.
- Вся информация сохраняется в отдельный каталог Zoo в виде материалов, таким образом у вас будет сохранятся архив всех когда-либо оформленных покупок.
- Для созданного заказа в панели управления можно вручную менять статус и добавлять произвольный комментарий, который увидят только администраторы.
- После отправки или при реальной оплате через платежные системы администратор получит письмо. Также письмо получит пользователь, и человек или группа людей, которые указаны в настройках.
- Есть возможность выбрать различные шаблоны писем для администратора и пользователя.
- Настройка шаблона писем очень похожа на настройку формы — просто берем и тащим нужное поле в нужную позицию шаблона.
Как работает корзина можно посмотреть на нашем демо-сайте. А теперь немного подробнее обо всем.
Кнопка «В корзину» и надпись «Нет в наличии»
Для каждого товара можно выбрать есть он или нет в наличии. Если в наличии товара нет, то показывается соответствующая надпись. Для товара, который есть в наличии можно добавить “В корзину”. При клике на нее появляется всплывающее окно, где перечислены все параметры товара, которые вы добавили в настройках шаблона Quick view.
После добавления в позиции товара показывается кнопка «Удалить из корзины». Либо вы можете оставить только иконку без надписи. Все происходит без перезагрузки страницы.
Все поля заполняются из панели управления. Выглядит это примерно как на картинке
Всплывающее окно для добавления в корзину
Примеры различных вариантов отображения JBPrice:
Виджет (модуль) состояния корзины
Слева имеется небольшой виджет, описывающий состояние корзины на текущий момент. Изначально высвечивается надпись «Ваша корзина пуста». При наполнении показывается сводная информация о будущей покупке.
Заголовок устанавливается из названия модуля — вы можете поставить таким, какой сами пожелаете.
Информация в нем обновляется автоматически без перезагрузок сразу после добавления товаров. Здесь отображается:
-
Количество товаров в корзине.
-
Лотов в корзине — (т. е. количество уникальных товаров).
-
Сумма заказа (стоимость).
-
Кнопка «Перейти в корзину», нажав на которую можно перейти на страницу оформления заказа.
- Кнопка “Удалить из корзины”, чтобы при необходимости убрать лишний товар, не переходя на страницу заказа.
Оформление заказа
Список товаров
На странице оформления можно увидеть таблицу «Список товаров в корзине». Здесь перечисляются основные поля товара. Количество можно менять и в зависимости от этого сумма и стоимость будут меняться автоматически — без перезагрузок и нажатий каких-либо кнопок. Так же синхронно изменяется информация в модуле, который был описан выше. Для большего удобства управления корзиной, имеются кнопки «Удалить» и «Удалить все».
Форма оформления заказа
Функционал стандартных форм Zoo был заимствован и серьёзно переработан. Таким образом можно в формах использовать самые разные типы полей (строки, радио, чекбоксы и даже привязывать файлы…).Они будут проходить валидацию точно так же как и в обычных формах подачи материалов.
Форма оформлена в виде различных блоков, каждый из которых выполняет свою функцию: форма заказа, доставка, оплата.
К тому же вы можете их редактировать и назначать любые поля сами.
Отправка писем на почту
После заполнения полей формы и нажатия кнопки «Оформить заказ» происходит отправка писем менеджеру (его e-mail указывается в настройках) и клиенту. Также можно включить отправку после реальной оплаты, через платежные системы.
Полезные ссылки по JBZoo