Структурная компоновка с помощью FreeMarker
Вовсе не нужно быть профессиональным верстальщиком или проектировщиком веб-приложений, чтобы иметь представление о компоновке (layout в англ.). Если полностью опустить все подробности, то этот термин всего лишь навсего означает расположение элементов на странице.
О каких именно элементах идет речь? Вообще, Вашему приложению должно быть виднее, однако стандартный информационный сайт содержит как минимум следующие элементы:
- «шапку» с логотипом и навигационными элементами;
- один или несколько уровней основной навигации;
- путь — еще один навигационный элемент, помогающий ориентироваться в структурной иерархии (англичане часто называют этот элемент «breadcrumb», дословно «хлебные крошки» — аналог клубка Ариадны, который помог древнегреческому герою Тесею выйти из лабиринта минотавра);
- основной контент, причем, это далеко не всегда статьи, гораздо чаще это многочисленные формы, таблицы, списки, графики и т.п.;
- контекстная информация, располагающаяся сбоку от основного контента;
- footer (нижний колонтитул);
- еще немного навигации.
Если Вы построили похожую структуру своего веб-сайта хотя бы у себя в голове (хотя лучше, все-таки, на бумаге), Вы без труда сможете создать в вашем сообществе необходимые папки и расположить в них шаблоны таким образом, чтобы структура естественным образом перетекала в компоновку.
Лучше всего проиллюстрировать все вышесказанное на примере. Допустим, структура вашего сайта будет содержать два принципиально различных по компоновке раздела: новости (директория news/
) и информационные страницы (директория pages/
):
Не сложно заметить, что обе компоновки имеют общую часть:
Этот факт позволяет нам не повторять одни и те же элементы в двух разных шаблонах. С помощью FreeMarker мы сможем создать файл шаблона layout.ftl
в директории templates/
, содержащий общую часть всех файлов. Эту общую часть мы будет «подставлять» во все последующие страницы нашего сайта.
Кроме того, содержимое наших страниц, в свою очередь, будет иметь что-то общее (заголовки, элементы дизайна и т.д.), поэтому к ним тоже будет уместно создать свой файл шаблона FTL. То есть, в каждой из директорий news/
и pagws/
мы создадим файлы layout.ftl
и .ftl
каждый со своим содержанием. Это существенно упростит нам жизнь при разработке сайта в будущем, ведь создавая все новые и новые страницы в этих разделах мы не будем копипастить один и тот же код. Кроме того, если вы захотите поменять дизайн всего сайта, вам не нужно будет редактировать каждый, отдельно взятый файл. Достаточно будет поменять лишь один FTL-шаблон, отвечающий за оформление.
Таким образом, мы имеем следующую структуру шаблонов:
templates/
|
+ --- layout.ftl
|
+ --- pages/
| |
| + --- layout.ftl
| |
| + --- .ftl
|
+ --- news/
|
+ --- layout.ftl
|
+ --- .ftl
Такой структурный подход к компоновке позволяет избежать повторения одинаковых частей разметки, а также делает шаблоны модульными, небольшими и относительно простыми. C увеличением сложности структуры преимущества использования такого подхода становятся все более очевидными, поскольку FreeMarker:
- универсален, т.е. предназначен для любого вида текстовой информации;
- обладает высокой производительностью;
- имеет богатую функциональность;
- хорошо документирован;
- легко и просто встраиваться в любое сообщество SAVANT.PRO.