Основные шаблоны для создания пользовательской темы в OpenCart

От автора: в предыдущей части мы научились создавать пользовательские темы и активировать их через back end в OpenCart. Также мы поняли принцип работы системы перезаписи шаблона в приложении. В этой части мы более подробно разберем важные шаблоны темы OpenCart, чтобы понять, из каких базовых элементов состоит основной шаблон. Также мы рассмотрим детальной случай использования, чтобы показать полный процесс создания страницы. Это полезно при кастомизации страниц в OpenCart.

Если взять шаблоны OpenCart, то их можно поделить на 3 категории. Эти категории не прописаны в документации OpenCart, но они помогут нам понять, что необходимо для генерации целой страницы на front end.

В OpenCart шаблоны называют макетами. Шаблон макета — это шаблон-декоратор, собирающий контент под разные области страницы, который проталкивает этот контент в макет и генерирует всю страницу.

Слоты могут представлять собой элементы типа хедера, футера, сайдбара и модульного контента. Почти для каждой страницы на front end существует свой шаблон макета.

OpenCart также позволяет создавать макеты через back end. Это еще один способ изменить частичную структуру определенных страниц.

Бесплатный курс по PHP программированию

Освойте курс и узнайте, как создать динамичный сайт на PHP и MySQL с полного нуля, используя модель MVC

В курсе 39 уроков | 15 часов видео | исходники для каждого урока

Этот тип шаблона генерирует слот под определенный контент. В стандартном сценарии подшаблон генерирует контент и толкает его в шаблон макета. Простейший пример — template/common/header.tpl. Этот файл генерирует хедер для всех страниц на front end.

Мы уже говорили, что OpenCart хорошо организует файлы шаблонов, поэтому header.tpl расположен в папке common. Большинство шаблонов в этой папке генерируют контент под слоты, которые вставляются в макет.

Модуль представляет собой некий блок, который вставляется в определенную область шаблона макета. Как вы, наверное, догадались, модульные шаблоны связаны с разными модулями. Насколько нам известно, в OpenCart много встроенных модулей, расширяющих базовый функционал.

По умолчанию в шаблоне макета доступно 4 позиции. Это:

Модуль можно закрепить в любой из этих позиций. Судя по названию, если прикрепить модуль в позицию content top, он будет отображаться сверху основного контента страницы. Модульные шаблоны хранятся в папке template/module. При создании новых модулей, соответствующие шаблоны необходимо помещать в эту папку.

Для OpenCart модульные шаблоны и подшаблоны очень похожи. Оба считаются дочерними шаблонами и вставляются в шаблон макета в процессе создания страницы.

Сперва давайте пройдемся по процессу рендеринга страниц на front end в OpenCart. При открытии страницы на front end, приложение выполняет следующую процедуру:

По переменной route в URL OpenCart находит соответствующий контроллер для обработки запроса. Ниже мы разберем, что такое и что делает переменная route. Сейчас же давайте представим, что она направляет OpenCart на соответствующий файл контроллера для выполнения.

Как только контроллер обработал информацию, он передает ее в элемент представления, отображающий отображается пользователю. Важно отметить, что контроллер также устанавливает имя файла шаблона макета, который будет задействован в представлении на следующем этапе.

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

Представьте, что вам захотелось поменять структуру макета любой страницы магазина на front end. Первым вопросом будет, как найти шаблон, отвечающий за определенную страницу. Точного способа нет, но давайте рассмотрим несколько способов.

Самый легкий способ предсказания шаблона по роуту. В OpenCart роут – переменная в строке запроса в URL. Например, разберем следующий URL, отображающий страницу авторизации для пользователя: //www.youropencartdomain.com/index.php?route=account/login.

В URL выше account/login – значение параметра route, который нам нужен. Это значение можно просто поискать в папке template стандартной темы. В этом случае путь к шаблону будет следующим: /catalog/view/theme/default/template/account/login.tpl

Вы могли заметить, что вторая часть значения route login становится названием файла шаблона (login.tpl). Разберем еще один пример: //www.youropencartdomain.com/index.php?route=product/product&path=1&product_id=1

Бесплатный курс по PHP программированию

Освойте курс и узнайте, как создать динамичный сайт на PHP и MySQL с полного нуля, используя модель MVC

В курсе 39 уроков | 15 часов видео | исходники для каждого урока

Пример с параметром route для страницы одного товара. Значение параметра route равно product/product. Шаблон для этого роута должен быть в папке: /catalog/view/theme/default/template/product/product.tpl

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