Создание пользовательской страницы в OpenCart

29 Мая 2022г. в 05:07

Основной рабочий процесс
OpenCart построен с использованием популярного шаблона программирования MVC.
В этот шаблон добавлен еще один элемент под названием «L» — языковая часть, поэтому в OpenCart он называется шаблоном MVC-L. Я не буду вдаваться в детали MVC, поскольку это очень популярный и знакомый шаблон дизайна, и мы подробно рассмотрели его в других уроках. Тем не менее, нам все равно нужно увидеть, как проходит рабочий процесс при использовании этого шаблона.

Контроллер действует как точка входа для любой страницы, на которой вы определите большую часть логики приложения. Модель имеет дело с back-end базой данных, а представление отвечает за подготовку содержимого, которое будет передано конечному пользователю. В контексте OpenCart потребуется реализовать контроллер и представление, чтобы создать новую настраиваемую страницу.

Настройки контроллера
Давайте попробуем понять роль контроллера в OpenCart. Контроллер — это первый элемент, который будет выполняться при запросе любой страницы. Прежде всего, он отвечает за настройку переменных, которые будут позже использоваться в представлении для отображения. Помимо этого в контроллере происходит множество других вещей:

Загружаются языковые файлы, чтобы можно было использовать языковые переменные для отображения статического текста.

Загружаются файлы модели, чтобы была возможность использовать методы, определенные в этих моделях для извлечения данных из базы данных back-end.

Определяется файл шаблона, который будет использоваться представлением.

Настраиваются пользовательские переменные с назначенным им контентом, который будет использоваться в файле шаблона.

Объявляются дочерние шаблоны, которые могут отображаться как часть основного шаблона. Простейшим примером этого являются шаблоны хедера и футера, которые вы хотите отобразить в своем основном шаблоне.

И наконец, устанавливаются значения для материала, такого как название документа, мета-описание и т. д.

Думаю, теории достаточно. Посмотрим, как выглядит наш пользовательский контроллер. Создаём новый каталог custompage в папке catalog/controller. Создаём новый файл mycustompage.php в catalog/controller/custompage. Вставляем в созданный файл контроллера «mycustompage.php» следующий код.

<?php
class ControllerCustompageMycustompage extends Controller {
public function index() {
// set title of the page
$this->document->setTitle("My Custom Page");

// define template file
if (file_exists(DIR_TEMPLATE . $this->config->get('config_template') . '/template/custompage/mycustompage.tpl')) {
$this->template = $this->config->get('config_template') . '/template/custompage/mycustompage.tpl';
} else {
$this->template = 'default/template/custompage/mycustompage.tpl';
}

// define children templates
$this->children = array(
'common/column_left',
'common/column_right',
'common/content_top',
'common/content_bottom',
'common/footer',
'common/header'
);

// set data to the variable
$this->data['my_custom_text'] = "This is my custom page.";
// call the "View" to render the output
$this->response->setOutput($this->render());
}
}
?>
<?php
class ControllerCustompageMycustompage extends Controller {
public function index() {
// set title of the page
$this->document->setTitle("My Custom Page");

// define template file
if (file_exists(DIR_TEMPLATE . $this->config->get('config_template') . '/template/custompage/mycustompage.tpl')) {
$this->template = $this->config->get('config_template') . '/template/custompage/mycustompage.tpl';
} else {
$this->template = 'default/template/custompage/mycustompage.tpl';
}

// define children templates
$this->children = array(
'common/column_left',
'common/column_right',
'common/content_top',
'common/content_bottom',
'common/footer',
'common/header'
);

// set data to the variable
$this->data['my_custom_text'] = "This is my custom page.";
// call the "View" to render the output
$this->response->setOutput($this->render());
}
}
?>
Давайте рассмотрим способ именований класса контроллера. Имя класса контроллера построено, следуя структуре каталогов и верблюжьему регистру. Обратите внимание, что имя класса начинается с ключевого слова «Controller», за которым следует имя каталога («Custompage»), в котором находится файл класса. И, наконец, имя файла класса («Mycustompage») добавляется в конце. Теперь давайте подробно проанализируем каждый раздел. Сначала мы установим значение тега заголовка html для нашей пользовательской страницы.

$this->document->setTitle("My Custom Page");
$this->document->setTitle("My Custom Page");
В следующем разделе мы определим имя файла шаблона, которое будет использоваться элементом «View». Важно отметить, что сначала необходимо проверить, доступен ли файл шаблона в настраиваемой теме, заданной из внутреннего блока, если он доступен, мы будем использовать его, в противном случае, мы будем использовать файл шаблона в теме «default». Это концепция переопределения шаблона.

if (file_exists(DIR_TEMPLATE . $this->config->get('config_template') . '/template/custompage/mycustompage.tpl')) {
$this->template = $this->config->get('config_template') . '/template/custompage/mycustompage.tpl';
} else {
$this->template = 'default/template/custompage/mycustompage.tpl';
}
if (file_exists(DIR_TEMPLATE . $this->config->get('config_template') . '/template/custompage/mycustompage.tpl')) {
$this->template = $this->config->get('config_template') . '/template/custompage/mycustompage.tpl';
} else {
$this->template = 'default/template/custompage/mycustompage.tpl';
}
Мы также определили дочерние шаблоны, используя массив. Например, common/header сопоставляет файл шаблона, расположенный в catalog/view/theme/default/template/common/header.tpl и он же выполняется. Результат будет присвоен переменной $ header, которую можно использовать в файле шаблона для отображения заголовка сайта.

$this->children = array(
'common/column_left',
'common/column_right',
'common/content_top',
'common/content_bottom',
'common/footer',
'common/header'
);

$this->children = array(
'common/column_left',
'common/column_right',
'common/content_top',
'common/content_bottom',
'common/footer',
'common/header'
);
Кроме того, мы продемонстрировали, как можно настроить пользовательские переменные, которые будут доступны в файле шаблона. Здесь мы использовали простой статический текст, но можно также назначить более разумный контент, например, массив товаров, извлеченный из базы данных.

$this->data['my_custom_text'] = "This is my custom page.";

$this->data['my_custom_text'] = "This is my custom page.";
Наконец, самое главное — вызвать представление, чтобы начать процесс рендеринга.

$this->response->setOutput($this->render());

$this->response->setOutput($this->render());
Таким образом, это проблеск рабочего процесса контроллера. В интерфейсе вы получите доступ к этому контроллеру, используя переменную строки запроса route=custompage/mycustompage. Важно отметить, что если вы определяете метод контроллера с любым другим именем, за исключением index, нужно указать это в URL.

Например, если вы создали метод с именем custom, ваш формат URL-адреса переднего плана должен выглядеть так route=custompage/mycustompage/custom.

Давайте разберёмся, как OpenCart находит по URL определённый файл контроллера. Формат переменной route {directory}/{filename}/{methodname}. {directory} указывает на папку catalog/controller. {filename} указывает имя файла контроллера в папке catalog/controller/{directory}.Далее ищется метод контроллера под названием {methodname}, если он задан. Если метод не задан, это будет стандартный метод index.

Подготовка представления
В этом разделе мы создадим файл шаблона представления, который определили ранее в index методе контроллера. Идем дальше и создаем новый каталог custompage под catalog/view/theme/default/template. Создаём новый файл mycustompage.tpl под catalog/view/theme/default/template/custompage. Вставляем следующий контент в созданный файл шаблона mycustompage.tpl.

<?php
echo $header;
echo $column_left;
echo $column_right; ?>
<div id="content">
<?php
echo $content_top;
echo $my_custom_text;
echo $content_bottom;
?>
</div>
<?php echo $footer; ?>

<?php
echo $header;
echo $column_left;
echo $column_right; ?>
<div id="content">
<?php
echo $content_top;
echo $my_custom_text;
echo $content_bottom;
?>
</div>
<?php echo $footer; ?>
Итак, это наш основной файл шаблона макета, который отвечает за отображение содержимого нашей пользовательской страницы. В этом файле шаблона мы только что использовали переменные, которые установили в index методе контроллера.

Только пользовательская переменная в этом файле шаблона является $my_custom_text, остальные переменные содержат элементы, относящиеся к дочерним шаблонам, такие как хедер, футер и т.д. Переменные $column_left, $column_right, $content_top и $content_bottom используются для отображения модулей, присвоенных нашей пользовательской странице из back-end.

Если нужно назначить модули на настраиваемой странице, сначала необходимо создать новую запись макета из back-end. После того, как новый макет был добавлен, нужно добавить для этого макета маршрут custompage/mycustompageзапись. Теперь можно назначить любой модуль на страницу.

Мы только что создали полную пользовательскую страницу в OpenCart! Можно её проверить по адресу: //www.yoursiteurl.com/index.php?route=custompage/mycustompage.



Вывод
В этом уроке мы узнали, как создать свою собственную страницу в OpenCart. Если вы знакомы с шаблоном MVC, то и рабочий процесс создания новой настраиваемой страницы должен быть знаком. Идем дальше и исследуем несколько основных файлов, чтобы ознакомиться с кодом. Ещё я хотел бы, чтобы вы расширили наш пример, загрузив в контроллер контрольные файлы модели и языка, и посмотрели, как все работает!