От автора: приветствую вас в серии статей для разработчиков OpenCart. В нашей предыдущей статье мы создали с помощью MVC (Модель-Представление- Контроллер) наш первый модуль «HelloWorld». В этой статье мы расскажем, как создать модуль OpenCart для интерфейса. Я бы рекомендовал вам просмотреть мою предыдущую статью, если вы еще не прочитали ее. Многие разработчики с опаской относятся к созданию модулей OpenCart — они сначала ищут готовые модули. Но на самом деле создать собственный функционал для OpenCart очень просто.
Как вы помните, мы создали простой модуль, который берет входные данные из back-end и сохраняет их в базе данных.
Конфигурация модуля
Поместите контент в поле «HelloWorldCode». Задайте для параметров Макет, Позиция, Статус и Порядок сортировки значения, приведенные на рисунке ниже.
Создание контроллера магазина
Перейдите в папку catalog/controller/module и создайте в ней пустой PHP-файл.
Задайте для файла имя helloworld.php.
Откройте файл в своей IDE и следуйте Конвенцию о присвоении имен OpenCart , т.е. classControllerModuleHelloworldextendsController {}.
Создайте внутри класса функцию OpenCart по умолчанию publicfunctionindex() {}.
Внутри функции index() добавьте приведенный ниже код:
|
1 2 3 4 5 |
$this->language->load('module/helloworld'); // загружаем языковой файл helloworld $this->data['heading_title'] = $this->language->get('heading_title'); // задаем heading_title для модуля $this->data['helloworld_value'] = html_entity_decode($this->config->get('helloworld_text_field')); // получаем сохраненное значение текстового поля helloworld и передаем его в переменную для использования внутри представления нашего модуля $this->template = $this->config->get('config_template') . '/template/module/helloworld.tpl'; // Путь к шаблону модуля магазина helloworld $this->render(); // выводим результат |
И мы закончили создание нашего контроллера. Обратите внимание на комментарии после каждой строки, чтобы вы понимали что делает этот код.
Создание представления магазина
Перейдите в папку шаблонов магазина по умолчанию; в моем случае это: catalog/view/theme/default/template/module.
Создайте новый файл шаблона.
Задайте для него имя helloworld.tpl.
Вы можете написать свой собственный HTML-код, чтобы отобразить содержимое вашего модуля. HTML-код, который написал я выглядит следующим образом:
|
1 2 3 4 |
<div class="box"> <div class="box-heading"><?php echo $heading_title; ?></div> <div class="box-content" style="text-align: center;"><?php echo $helloworld_value; ?></div> </div> |
Создание языкового файла
Создайте файл языка helloworld.php в папке catalog/language/(language)/module.
Добавьте данные в файл языков, в моем случае:
|
1 2 3 4 |
<?php // Heading $_['heading_title'] = 'Hello World Title'; ?> |
Если ваш сайт является многоязычным, добавьте языковые файлы для каждого языка.
Что мы сделали?
В принципе, наш модуль работает просто потому, что он берет данные из панели управления и отображает их через интерфейс магазина. В связи с этим мы добавили некоторые условные данные из внешнего модуля HelloWorld и задали макет для отображения модуля. В нашем случае эти макеты — Contact и Account, а их позиции находятся — в столбце слева и в столбце справа, соответственно.
Проверка нашей работы
Мы завершили написание модуля магазина. Но всегда нужно проверять свою работу.
Вы можете либо перейти на страницу «Contact Us » в нижней части магазина, либо открыть в браузере следующий адрес //localhost/OpencartStore/index.php?route=information/contact.
Ваш модуль должен располагаться, так как приведено на скриншоте ниже.
Замечательно! Модуль располагается, так как нужно. Это означает, что всё в порядке. Вы также можете проверить, отображается ли корректно ваш модуль в Accounts Layout. Если вы сделали все правильно, модуль также должен появиться на странице магазина.
Заключение
В этой статье мыпроделали большую работу. Как я уже упоминал во введении, разработка модулей для OpenCart очень проста. В следующих статьях мы рассмотрим интеграцию API в OpenCart и разработку тем. Надеюсь, вам понравилась эта статья.
Автор: Zaman Riaz
Источник: //code.tutsplus.com/
Редакция: Команда webformyself.
