Блог на MODx Revolution: шаблон одиночной страницы. Часть вторая: чанки

В рассматриваемом материале мы с вами продолжим доводить до завершения шаблон одиночной веб-страницы сайта на MODx Revolution, начатый в одной из предыдущих статей.

Но для начала давайте назначим наш шаблон page одному из документов из дерева ресурсов. Это необходимо для наглядности, т.е. изменили мы template — сразу же подглядели результат. Итак, я выбрал страницу «О проекте»:

Смена шаблона документа в MODx Revolution

Разбиение шаблона страницы на чанки

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

1. Выдергиваем бококую колонку — это код, начинающийся с комментрия <!— SIDEBAR —> и идентификатора #aside. Чанк назовем его просто — sidebar. Соответственно, извлеченный кусок заменяем на:

[[$sidebar]]

Чанк сайдбара MODx Revolution

2. Далее пора вытащить подвал/»футер» — это код, начинающийся с комментария <!— FOOTER —> и обрамленный идентификатором #footer. Чанк называем также лаконично — footer:

[[$footer]]

Чанк подвала шаблона страницы MODx Revolution

3. Завершающим шагом станет замена блока меню и шапки сайта.  Чанк называем header. Выдергиваем HTML-разметку, которая начинается с комментария <!— HEADER —> и идентификатора #header:

Чанк шапки сайта шаблона MODx Revolution

Вместо вырезанного блока разметки в шаблоне одиночной страницы page пишем вызов вот такой вот конструкции:

[[$header]]

Итоги:

Сегодня мы с вами разбили шаблон одиночной страницы page на три чанка, — как итог наша сходная разметка значительно уменьшилась в объеме. Также появились общие элементы — шапка, подвал, боковая колонка («сайдбар»), которые можно будет вызывать из других шаблонов. Но их мы соберем в следующих статьях, «не переключайтесь».

Опубликовано 1-01-2013 в 10:13


Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>











Свежие комментарии

  • krasnov8953: к записи Не работает как мне кажется строчка $newTvId = $ »
  • Dimanski: к записи ничего не понимаю. Ставлю ModX на хостинг r01.ru »
  • Дмитрий: к записи Спасибо! Очень выручили. С битриксом беда, а прав »
  • леонид: к записи как сделать что были в ряд? у меня получается по о »
  • Администратор: к записи Статический IP. »
  • Steel: к записи Администратор, вы данную проблему решили подключен »
  • Дмитрий: к записи Хотел узнать как прикрутить данное окно (http://re »

Blogroll:

Последние твиты