Часть третья. Интеграция шаблонов интернет-магазина.
Интеграция иконок регистрации/авторизации и корзины
Производится интеграция верстки иконок проекта с функциональностью платформы. Осуществляется вывод окон форм для регистрации нового клиента и авторизации в личном кабинете.
Далее рассматривается интеграция иконки корзины.
Интеграция постраничной навигации (пагинатора)
На данном шаге переходим к настройке шаблона каталога товаров.
Первым элементом каталога в структуре макета ювелирного интернет-магазина является пагинатор.
Сначала устанавливаем метку вывода постраничной навигации в шаблон и настраиваем состав выводимых на сайт элементов навигации.
Далее перенастраиваем в файле style.css стили и классы на новую структуру, которую сгенерировал движок.
Скачать модифицированный файлы style.css из рассматриваемого примера
Интеграция верстки для списка товаров
В этом материале рассматриваются следующие этапы интеграции платформы с шаблонами каталога товаров:
- Чтение верстки в области каталога товаров;
- Вывод верстки поисковой формы в шаблон с помощью метки search_form;
- Настройка шаблона каталога и шаблона отдельного товарного предложения;
- Вывод товарных предложений с помощью метки items;
- Настройка пагинации.
Интеграция верстки формы поиска
Интеграция верстки полного описания товара
Переносим верстку карточки товара из файла шаблона донора.
Интегрируем функциональность магазина с шаблоном с помощью меток системы, а так же создаем новые метки, для интеграции дополнительных сниппетов.
Настраиваем функциональность выбора количества товаров и отправки заказа в корзину.
Дорабатываем верстку блока покупки товара и перенастраиваем стилизацию на новую структуру через файл style.css
Интеграция шаблона корзины
Рассматривается процесс интеграции шаблонов для:
- верхний уровень корзины;
- товар в списке корзины;
- форма заказа;
- положительный результат отправки заказа.
Производится полный цикл оформления заказа в корзине и получения его в панели администрирования платформы.