Работа с CMS NetCat. Урок 21. Модуль минимагазина
Одним из последних приятных, полезных и нужных нововведений в NetCat является модуль минимагазина. Да, в NetCat уже есть модуль интернет-магазина, большой и с кучей настроек, но минимагазин является отличной альтернативой для тех, кому не нужны такие функции как: интеграция с 1C, интеграция с платёжными системами и многое другое.
Данный модуль предназначен для организации магазина у себя на сайте, включающий:
- каталоги товаров ( в том числе и неформализованные )
- корзину
- заказы ( с сохранением истории )
- скидки
- уведомления по почте
В этом уроке будут показаны способы подключения функционала магазина на вашем сайте.
Начнём с того, что модуль минимагазина можно подключить к обычному, уже работающему, каталогу товаров. Для создания каталога мной использовался компонент «Товары и услуги: Простой каталог товаров».
Добавим несколько объектов в этот раздел:
На текущий момент у нас есть просто каталог товаров с возможностью просмотра полного описания, цены и т.д. Давайте подключим к нему модуль минимагазина. Что для этого нужно сделать:
Подключение библиотек
В разделе
вашего шаблона подключить необходимые js-библиотеки двумя способами:- прописав вызов функции ".nc_js()." и этим подключив необходимые библиотек разом или
- прописав требуемые библиотеки вручную: ядро jQuery <script src='/jquery.min.js'></script> и скрипт, необходимый для работы модуля <script src='/netcat/modules/minishop/minishop.js'></script>
Оба скрипта необходимо подключать в том случае, если вы используете AJAX-обработку данных, то есть: добавление товара в корзину без перезагрузки страницы, появление всплывающего окна при добавлении товара в корзину.
Добавить в корзину
Что сделает наш каталог похожим на интернет-магазин? Появление корзины и кнопки у товара «Положить в корзину». Для вывода элемента «Положить в корзину» существует метод show_put_button, в который нужно передать: название товара, ссылку на товар и стоимость товара:
".$nc_minishop->show_put_button('Название товара', 5000, '/goods/tovar.html')."Но это в ручном режиме, а в автоматическом мы, исходя из полей используемого вами компонента, прописываете следующее:
".$nc_minishop->show_put_button($f_Title, $f_Price, $fullLink)."и вставляете в место вывода кнопки. Как правило, код вставляется в поля «Объект в списке» и «Отображение объекта».
Уже сейчас на сайте можно увидеть то, что появилась ссылка «В корзину» у всех товаров каталога.
Это был первый вариант подключение, есть и второй при котором товары можно добавлять в корзину массово. Для этого необходимо:
- в префиксе списка объектов прописать:
".$nc_minishop->mass_put_header()."
- в поле «Объект в списке» вместо прежнего кода прописать:
".$nc_minishop->show_put_button($f_Title, $f_Price, $fullLink, $f_RowID)."
По сути это та же функция, но в ней присутствует 4й параметр — уникальный ID элемента
- в суффиксе вывести кнопку «Положить товары в корзину»
".$nc_minishop->mass_put_footer()."
После внесения необходимых изменений, вы сможете увидеть обновление на сайте:
У вас есть возможность изменить стили, надписи и виды кнопок. О способах читайте ниже в разделе «Отображение».
Предположим, что у вас есть каталог товаров, причем каждый товар может иметь несколько цветов (товары одного наименования, но различных цветов не отличаются по цене), чтобы не создавать для каждого товара несколько объектов, которые отличаются только свойством цвета, можно на основе одного объекта создавать несколько товаров в магазине, в «объекте в списке» компонента с товарами можно написать:
Красный: ".$nc_minishop->show_put_button($f_Title. 'красный', $f_Price, $fullLink)."
Синий: ".$nc_minishop->show_put_button($f_Title. 'синий', $f_Price, $fullLink)."
Зеленый: ".$nc_minishop->show_put_button($f_Title. 'зелёный', $f_Price, $fullLink)."Тогда у каждого товара появится три кнопочки положить в корзину с тремя вариантами цвета.
Есть так жеальтернативный вариант описанный в разделе решений партнёров — «Множественный выбор параметра товара в Минимагазине». Данное решение позволяет обойти стандартное решение. При выборе размера из выпадающего списка с помощью AJAX-запроса, без перезагрузки страницы, генерируется уникальная кнопка "положить в Корзину". Посмотреть полное описание.
Вывод корзины
Для вывода состояния корзины используется метод show_cart_state. В нужное для вас место макета дизайна добавляете вывод корзины, прописав следующее:
".$nc_minishop->show_cart_state()."В зависимости от того, если что-то в корзине или нет, вы увидите соответствующее сообщение: «Корзина пуста» или «В корзине __ товаров на сумму ___».
Так же для работы с корзиной доступны методы, которые позволят вам настроить вывод корзины так, как вам нужно:
- cart_count () — Возвращает количество товаров к корзине.
К примеру, вам нужно выводить корзину только в том случае, если в ней что-то есть. Для этого прописываете:
".( $nc_minishop-> cart_count() ? $nc_minishop->show_cart_state() : "")."
- cart_content() — Возвращает содержимое корзины в виде массива. Пример:
print_r ( $nc_minishop->cart_content() );
- cart_sum ( $with_discount = 0 ) — Возвращает сумму товаров в корзине. Если второй параметр будет равен «1», то скидки учитываться не будут.
- cart_url () — метод возвращает ссылку на корзину. Пример:
<a href='".$nc_minishop->cart_url()."'>Перейти в корзину</a>
После того, как посетитель сайта наполнил корзину, он может переходить к оформлению заказа. В зависимости от настроек модуля, осуществить заказ может как авторизованный, так и неавторизованный пользователь.
По умолчанию, каждый заказ содержит в себе:
- информацию о покупателе ( имя, адрес, телефон, email)
- состав заказа ( позиции заказа)
- статус заказа
- способ доставки и оплаты
- скидку
- стоимость со скидкой и без нее
- примечание
С точки зрения NetCat, каждый заказ — это объект компонента «Минимагазин: Заказы», поэтому вывод, добавление и изменение заказов идет через стандартный средства системы.
Администратор сайта может просматривать все заказы, а так же изменять его, в том числе:
- добавлять, изменять, удалять позиции товара
- вручную устанавливать скидку и окончательную стоимость заказа
- добавлять, изменять, удалять поля информации о пользователе
- править все свойства заказа
Перейдём к настройкам модуля (раздел «Модули и виджеты»).
На вкладке «Информация» выводится статистика заказов.
Общие
На вкладке «Общие» вы можете настроить:
- название магазина
- валюта магазина
- авторизация при оформлении заказа. При наличии модуля личного кабинета, можно выставить функцию на обязательную авторизацию. В этом случае, пользователь не сможет оформить свой заказ пока не авторизуется на сайте
- варианты доставки и оплаты. Варианты доабвляются в разделе списков
- настройки уведомлений. На какой e-mail должны приходить уведомления
Скидки
Модуль позволяет задать скидку в зависимости от всей суммы заказа. Скидка задается в административной части модуля, каждая скидка должна включать ценовой диапозон, к которому она будет применена и сообственно значение скидки.
Отображение
На вкладке «Отображение» вы можете задавать свои шаблоны для отображения следующих элементов:
- Действие при помещении в корзину. Для информирования пользователя о том, что выбранный им товар добавлен в корзину нужно выбрать один из желаемых пунктов.
Функция «Без перезагрузки» требует наличия подключенной библиотеки jQuery. Ниже, на этой же странице, вам будут доступны два поля, в которых можно ввести свой текст для всплывающих окон:
- Элемент «положить в корзину». Данный элемент уже реализован следующими способами:
- текстовая ссылка
- картинка
- текст с картинкой
- кнопка
- кнопка с полем количества
- $name — наименование товара
- $price — цена товара
- $uri — ссылка на описание товара
- $hash — хэш товара ( должен передаваться)
- Выбрать один из способов отображения шаблона.
- Произвести генерацию шаблона и на его основе внести свои корректировки.
Например. Сгенерировав шаблон для текстовой ссылки:<a href='/netcat/modules/minishop/index.php?good[$id][name]=$name&good[$id][price]=$price&good[$id][hash]=$hash&good[$id][uri]=$uri' ".($this->settings['ajax'] ? "onclick='$.get(this.href,{},function(response){nc_minishop_response(response)}, "json");return false;'" : "")." >В корзину</a>
Можно доработать его, добавив вместо текста «В корзину» картинку в соответствии с вашим дизайном<a href='/netcat/modules/minishop/index.php?good[$id][name]=$name&good[$id][price]=$price&good[$id][hash]=$hash&good[$id][uri]=$uri' ".($this->settings['ajax'] ? "onclick='$.get(this.href,{},function(response){nc_minishop_response(response)}, "json");return false;'" : "")." ><img src='/images/mycart.png' title='Добавить в корзину'></a>
- Надпись «товар в корзине». Надпись появляется после того, как товар был добавлен в корзину. Здесь вы так же можете легко заменить стандартный шаблон на свой использовав текст или картинку.
- Внешний вид корзины. Для настройки доступно 3 поля:
- Информер не пустой корзины. Содержит код корзины, отображаемой в то время, когда в неё уже был добавлен хотя бы один товар. По-умолчанию код выглядит следющим образом:
В вашей <a href='$carturl' title='Перейти в корзину'>корзине</a> $cartcount ".nc_numeral_inclination($cartcount, array('товар', 'товаров', 'товара') )." на сумму $cartsum $cartcurrency <br/> <a href='$orderurl'>Оформить заказ</a>
Используя этот код вы можете доработать его в соответствии с дизайном вашего сайта - Информер пустой корзины. По-умолчанию выводится текстовая надпись «Ваша корзина пуста». На её место можно так же вставить картинку или иной текст.
- Вывести на странице корзины после таблицы текст. Любая информация, которую вы посчитаете нужным показать посетителю (описание работы магазина, информация об акциях, правила магазина и т.д.) может быть добавлена в этом окне.
- Информер не пустой корзины. Содержит код корзины, отображаемой в то время, когда в неё уже был добавлен хотя бы один товар. По-умолчанию код выглядит следющим образом:
- Форма оформления заказа. Данный блок содержит настройки формы оформления заказа.
У вас есть возможность выполнить оформление заказа в один шаг либо разделить на два. В первом случае сначала пользователю будет выведена корзина с возможностью редактирования желаемых товаров (настроить внешний вид данной таблицы вы можете в компоненте «Минимагазин: Корзина»):
и следом заполнить свои данные
При включенной функции «показывать форму на странице с корзиной» форма для ввода контактных данных пользователя под таблицей с товарами. В поле «Шаблон текста после оформления заказа» вы можете ввести текст выводимый покупателю после совершения покупки. В поле доступна переменная с номером заказа: $order_id
Шаблоны писем
На вкладке «Шаблоны писем» вы, по своему усмотрению, можете изменить шаблоны отправляемых заказчику и администратору писем. Администратору письмо шлется автоматически. Письма отсылаются в «действии после добавления» компонента «Минимагазин: Заказы».
В шаблонах доступны следующие макропеременные:
- %SHOP_NAME — название магазина
- %USER_NAME — имя пользователя
- %ORDER_NUM - номер заказа
- %SITE_URL — адрес сайта
- %CONTENT — содержимое корзины
- %DISCOUNT — скидка
- %FINAL_COST — итоговая стоимость.
Системные
Вкладка «Системные» содержит пути к компонентам и страницам:
В том случае, если необходимые поля у вас не заполнены — заполните их как на примере.
Компоненты
Два компонента, которые работают с модулем минимагазина:
1. Компонент «Минимагазин: Заказы»
Компонет содержит в себе набор полей, выводимых на странице оформления заказа.
При необходимости вы можете дополнить форму необходимыми полями. Сама форма добавления реактируется на вкладке «Добавление» в шаблонах действий:
2. Компонент «Минимагазин: Корзина». Компонент выводит форму со списком товаров уже добавленными в корзину:
Для корерктного отображения формы на вашем сайте,вы можете добавить следующие стили в свой файл стилей:
table.nc_mscart {width:100%; border-collapse:collapse; margin-bottom: 20px;}
table.nc_mscart th, table.nc_mscart td {padding:5px; border:1px solid #CCC}
table.nc_mscart th {background:#EEE; font-weight: bold;}
table.nc_mscart td {background:#FFF}
table.nc_mscart td.c {text-align: center;}
table.nc_mscart td.r {text-align: right;}
table.nc_mscart td.l {text-align: left;}
table.nc_mscart td.sum {background:#EEE;}Список заказов пользователя
При наличии установленного в вашей редакции модуля «Личный кабинет», вы можете сделать вывод пользователю списка его заказов. Для этого в его личном кабинете создаёте новую страницу, назначаете ей компонент «Минимагазин: Заказы», шаблон отображения «Минимагазин: Заказы для личного кабинета». Теперь пользователь на созданной вами странице сможет увидеть список своих заказов.
Ещё посты из категории: NetCat
914-811
