Контакты | E-mail: info@modx-evo.ru | Заказать обратный звонок



Урок 4 - Чанки MODx

Мы уже создали наш первый шаблон на MODx, в рамках данного урока мы продолжим работу с нашим шаблоном и познакомимся с рядом терминов, которые традиционны для MODx.

Прежде чем мы продолжим работать над нашим шаблоном, давайте познакомимся с термином «чанк». Который вы могли уже видеть в административной части нашего сайта на ряду с вкладкой шаблоны.

Чанк это ничто иное, как кусок статического кода HTML. Чанки используются для упрощения работы с шаблонами, если один и тот же кусок кода повторяется в нескольких шаблонах или в нескольких местах в одном шаблоне, то лучше вынести данный кусок кода в отдельный чанк. Если мы в дальнейшем захотим изменить этот код, то нам это нужно будет сделать только в одном месте в рамках чанка, а не в каждом шаблоне.

Теперь давайте посмотрим на наш шаблон и определим, какие части нашего шаблона было бы неплохо вынести в отдельные чанки MODx.

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

чанки modx

Далее у нас идет интересный слайдер, для него мы тоже создадим свой чанк. На самом деле он у нас будет находиться только на главной странице и выносить код нашего слайдера в отдельный чанк было бы необязательно, но чтобы научиться мы сделаем это в рамках данного урока.

modx чанки

Анонс последних статей или новостей на сайте.

modx чанки

Ну и футер (подвал сайта).

чанки modx

Создаем чанки MODx

Для того чтобы создать новый чанк, мы авторизовываемся в административной панели и переходим по следующим вкладкам: «Элементы»-«Управление элементами»-«Чанки». Жмем на кнопку «Новый чанк» и заполняем следующие поля:

создаем чанк modx

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

Теперь открываем код шаблона главной страницы и копируем содержимое от тега head до его закрывающего тега включительно. Вставляем скопированное в поле «Код чанка» нашего созданного чанка.

код чанка

Сохраняем чанк и переходим к редактированию шаблона главной странице на вкладке «Элементы»-«Управление элементами»-«Шаблоны», вместо скопированного кода вставляем следующую инструкцию { {head} }, сохраняем и обновляем наш сайт. Если вы все сделали правильно, то увидите, что ничего не изменилось.

Теперь давайте разберемся, что означает { {head} }?

Инструкция вида { {имя чанка} } – это фактически вызов кода чанка внутри шаблона, то есть если мы хотим, чтобы содержимое чанка отображалось в определенном месте, мы делаем его вызов в этом самом месте.

Теперь создайте другие чанки, я рекомендую вам для начала создать следующие чанки:

header – чанк шапки сайта, slider – чанк слайдера с разделами, news – анонс новостей на главной, footer – подвал сайта.

В результата в вашей категории появится некоторое количество чанков MODx, не обращайте внимания на мой список, всему свое время.

список чанков

Замените в шаблоне куски кода на вызовы чанков, указав вызовы { {header}}, { {slider}}, { {news}}, { {footer}}.

шаблон и чанки modx

У вас должно получиться, что то вроде такого. Теперь сохраните шаблон и обновите страницу сайта, если ваш сайт выглядит все также хорошо, значит вы все сделали правильно.

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

Скачать файлы урока.


Просмотров: 3447


Статьи по теме:


Написать комментарий

Поля помеченные * обязательны для заполнения.



Будь в курсе!

Введите Ваш Email и имя.

Digital Newsletter

Чтобы отписаться нажмите сюда ».