Задача: сделать кнопку “быстрый просмотр” в шаблоне категории, при клике по которой подгружается шаблон. Для решения этой задачи есть 2 пути: править контроллеры или писать модуль. Отличие только в том, что написание модуля займет больше времени, но разрешит обновлять opencart (тоже сомнительно, так как к примеру переход 2.2-2.3 ломает половину модулей), в этой статье используется редактирование контроллеров.
Начиная с текущей записи и далее подразумевается, что Opencart версии 2.3 и выше. Дело в том, что на этой версии произошло изменение путей некоторых файлов и папок, что делает неработоспособными многие модули, которые подходили под opencart 2.2. В дальнейшем выйдет статья про переработку модуля под версию 2.3 из модуля под версию 2.0-2.2.
По порядку:
- Подключить фансибокс
- Изменить шаблон категории
- Изменить шапку
- Изменить контроллер категории
- Изменить вывод товаров (контроллер)
- Изменить шаблоны
- Подредактировать js
1. Фанси нужно подключить свежий, учитывая версию jquery которая на текущем opencart. Подключать или правильно в контроллере шапки – или просто допишем в шаблон вывода шапки с абсолютными путями:
<script src="catalog/view/theme/himi/fancybox/jquery.fancybox.pack.js"></script> |
Так же в js подключить класс fancy-iframe для ссылок. Почитайте документацию для FancyBox чтобы сделать верно (обратите внимание на опции для iframe).
2. В шаблоне категории нужно добавить нужным образом кнопку идентичную ссылке на товар с параметром:
<a class="white-but fancy-iframe" href="<?php echo $product['href']; ?>&fancy=1">Быстрый просмотр</a> |
Мы добавили параметр fancy в url. Если параметр передается в url – он будет передаваться методом get. Чем мы и воспользуемся в контроллерах.
3, 4, 5. В эти места нужно добавить получение этого параметра.
$data['fancy'] = (isset($this->request->get['fancy'])) ? 1:0; |
Такой параметр позволит в шаблонах использовать параметр $fancy – его наличие будет говорить шаблону использовать те или иные элементы, когда вызывается быстрый просмотр.
6. Изменение шаблонов. Для начала нужно используя параметр $fancy скрыть в шапке и футере весь html. Это нужно для того, чтобы не вызывалось меню, футер в окошке быстрого просмотра. Далее нужно поставить таких же ограничителей в тех местах, где нужно. Пример:
<!--?php if ($fancy) { ?--> какой то текст шаблона, модули и всякое такое <!--?php } ?--> |
7. Мелкие правки по js. Во-первых не забудьте про класс .breadcrumbs. После него появляются алерты вроде “товар добавлен в корзину”. Так же желательно добавить скрытие фансибокса после добавления в корзине, так как в этом фанси-окне сайт будет работать полностью – можно перемещаться по ссылкам, если переместиться – будет и шапка и футер и прочее. Пример для шаблона продуктов (там где обрабатывается удачное добавление в корзину):
setTimeout(function(){ parent.$.fancybox.close(); },1000); |