Что такое чанки в modx

MODX чанки (chunks)

В прошлых уроках мы разобрали различный синтаксис модх парсера и fenom, а также перенесли HTML шаблон в MODX Revo (там можно скачать шаблон на основе которого пойдут дальнейшие уроки). Сейчас код шаблона статичный и чтобы что то поправить нужно править код — начнем это исправлять. В данном уроке разобьем код на отдельные части — MODX чанки, чтобы в будущем с кодом шаблона было проще работать.

Что такое

MODX чанки – это контейнеры для HTML/CSS/JS-кода (нельзя добавлять php-скрипты, вернее можно но они будут игнорироватся, для этого есть сниппеты). В чанке можно вызывать другие чанки, tv и сниппеты (можно вкладывать другие элементы).

Где хранятся

Чанки, хранятся в БД, в таблице modx_site_htmlsnippets (где modx_ — это префикс таблиц, который задан во время установки движка).

Как создать

Есть несколько способов создания чанков, рассмотрим каждый из них.

Переходим во вкладку «Элементы» и кликаем:

Как вызывать

Выводятся чанки в шаблоне при помощи следующей конструкции:

Чанк с параметрами

Допустим у нас есть чанк «info», со следующим содержимым:

Он имеет 2 плейсхолдера: [[+name]] и [[+mesCount]]. Передать значения данным плейсхолдерам можно при помощи указания соответствующих параметров вызову чанка:

В результате, получим следующее содержимое:

Условия в чанках

Условия и другие phx фильтры / модификаторы MODX можно использовать в любых специальных тегах. Например, нам нужно вывести чанк в чанке (один или другой) в зависимости от идентификатора родителя текущего ресурса.

Внимание! Будьте осторожными, условия могут сильно увеличить время генерации страницы.

Натягиваем шаблон — логика разбивки шаблона

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

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

Выносим весь код шаблона (у на пока только один шаблон базовый, смотрите урок Перенос HTML шаблона в MODX Revo) в отдельный чанк tpl и вызываем чанк tpl в самом шаблоне [[$tpl]] или .

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modx

Если сейчас перейти на главную страницу — у нас не чего не поменялось — она также открывается с перенесенным html дизайном. Далее открываем чанк tpl и вырезаем из него весь контент который меняется в чанк tpl.1, а на месте вырезанного кода вставляем вот такую конструкцию [[$tpl.[[*template]]]] или тоже самое на fenom:

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modx

Для чего все это?

Тэг «template» выводит id примененного шаблона, а выше приведенная конструкция обращается к соответственному чанку и выводит его. Так мы в дальнейшем сэкономим кучу времени при внесении изменений в верстку сайта.

В дальнейшем мы будем создавать дополнительные шаблоны (для типовых страниц, для статей, для портфолио и т.д.), вызывать во всех будем чанк tpl — там у нас шапка, подвал и другие элементы которые присутствуют на всех остальных страницах. У каждого нового шаблона будет свой id, следовательно, мы будем создавать дополнительные чанки tpl.2, tpl.3, …, tpl.7 и уже в них вносить недостающий контент. Забегая вперед, у нас получится примерно такая структура.

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modx

В следующем уроке, мы рассмотрим сниппеты — для чего они нужны и как их использовать.

Источник

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modx

В этой статье рассмотрим понятие, назначение и применение чанков в MODX Revolution. Кроме этого познакомимся с тем, как выполняется обработка и управление чанками в сниппетах через API.

Что такое чанк

Например, чанк (его содержимое), который используется для вывода меню сайта:

Кроме этого чанки в MODX Revolution также используются в качестве шаблонов для вывода результатов работы сниппета.

Например, чанк (tpl.Tickets.list.row), который используется в качестве шаблона сниппета getTickets :

Внутри чанках, как и во многих других элементах MODX Revolution (шаблонах, TV-параметрах, полях ресурса), нельзя непосредственно размещать php-код. Размещение в этих элементах динамического содержимого осуществляется посредством вызовов сниппетов, которые исполняют хранящийся внутри них PHP-код.

Где хранятся чанки

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modx

Работа с чанками в админке MODX

Чанки в админке MODX Revolution расположены на левой панели во вкладке «Элементы».

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modx

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

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modx

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

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modx

Редактирование чанка

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

Как использовать чанки в MODX

Вставка чанка в шаблон или содержимое ресурса осуществляется с помощью следующего тега MODX:

Во время обработки страницы, парсер MODX заменит тег чанка его содержимым.

Чанк и его параметры

Чанки в MODX могут иметь параметры. Например, рассмотрим чанк «intro», имеющий следующее содержимое:

Он имеет 2 плейсхолдера: [[+name]] и [[+messageCount]]. Передать значения этим плейсхолдерам можно с помощью указания соответствующих параметров вызову чанка:

В результате, получим следующее содержимое:

или в содержимом чанка:

Условия в чанках

Условия и другие фильтры MODX можно использовать в любых специальных тегах этой системы.

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

Но с фильтрами в MODX надо быть очень осторожными, т.к. они могут сильно увеличить время генерации страницы. Это происходит потому, что условия в тегах MODX работают не так как обычные условия в php. Например, в вышеприведённом примере оба чанка вызовутся, не зависимого от того какой идентификатор имеет родитель текущего ресурса. А уже только потом будет определяться какой из этих чанков будет выведен на страницу. Поэтому в MODX они и называются фильтрами. А теперь давайте представим, что в этих чанках есть вызовы некэшируемых сниппетов. В результате в не зависимости от идентификатора родителя текущего ресурса эти вызовы будут выполняться как в первом, так и во втором чанке. Это может привести к значительному увеличению времени генерации страницы и нагрузке на сервер. В таких случаях лучше фильтры не использовать, а выполнять эти действия с помощью сниппета.

Обработка чанка с помощью API

Чанки часто выступают в качестве шаблонов для вывода результатов работы сниппета. Обрабатывается чанк в сниппете через функцию getChunk().

Например, рассмотрим, как использовать чанк «rowTpl» в сниппете.

Чанк «rowTpl», имеет следующее содержимое:

Содержимое (php-код) сниппета, который получает все опубликованные ресурсы на сайте и выводит их в таблицу. Для вывода данных отдельного ресурса (одной строки таблицы, состоящей из 2 ячеек) используется шаблон rowTpl.

Источник

Что такое чанки в modx

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modxДобро пожаловать на 5 урок MODX Revolution для новичков. В предыдущем уроке мы начали рассматривать работу с шаблонами в MODX Revolution. Мы начали со статичного HTML/CSS шаблона и перенесли его в нашу установку MODX Revolution, изменили пути к файлам и начали изучать синтаксис тегов MODX Revolution и как его использовать. В этом уроке мы продолжим работу над нашим шаблоном и изучим концепцию чанков.

В данном уроке я использую шаблон 7-in-1 Business Success Site студии Themeforest. Если вы работаете над шаблоном, который вы скачали или сделали сами, то это даже лучше. Подход к построению сайта одинаков вне зависимости от используемого шаблона.

Давайте начнем. Наш сайт выглядит сейчас точно так же как и загруженный шаблон, потому что мы изменили все пути к css, js и image файлам. Давайте рассмотрим что же такое чанки

Чанки MODX Revolution

Чанки — это куски HTML кода или текста. Важно отметить что чанк — это чистый HTML код без всякой логики. Чанк не может содержать PHP код, он просто не будет выполнятся. PHP код необходимо вставлять в сниппет (разберёмся в этом в следующих уроках). Этот сниппет потом может быть вызван в чанке. В то же время чанк сам по себе не может содержать всередине чистый PHP.

Для чего использовать чанки?

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

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

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

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

Видно, что этот шаблон разделён на три различные секции: шапка, подвал и средняя область (по такому принципу делятся почти все шаблоны). Соответственно можно поделить наш шаблон на эти три части. После разделения мы можем далее еще разделить эти секции.

Поэтому первой вещью, что мы сделаем — это создадим два новых чанка, которые назовём: 7in1-header и 7in1-footer.

Для создания чанка зайдем в менеджер и в дереве слева зайдем во вкладку Elements. Можно создать чанк двумя способами: правым кликом на Chunk и выбрать“New Chunk” или кликнуть на иконку Chunk.

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modx

В появившемся окне вводим необходимую информацию — имя чанка, описание и категория, если это необходимо.

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modx

Пока сохраним этот чанк, чуть позже вставим туда код.

Давайте продолжим и создадим чанк для подвала.

Сейчас если мы взглянем на дерево ресурсов, то увидим наши два новые чанка в разделе Чанки.

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modx

Если мы теперь посмотрим на наш сайт, то увидим, что он не выглядит так, как должен выглядет.

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modx

Это случилось потому что сайт больше не видит наших css и js файлов, так как мы вырезали всю информацию об этом из нашего шаблона. Так как эта информация теперь содержится в чанке, то нам необходимо просто вызвать чанк в шапке шаблона.

Как вызывать чанк в MODX Revolution

Синтаксис чанков в MODX Revolution очень прост:

В нашем случае мы просто перейдём в наш шаблон и разместим там вызов нашего чанка 7in1-header в области, где мы убрали код шапки. Таким образом верхняя часть кода нашего шаблона будет иметь следующий вид:

Если сейчас вы перезагрузите страницу, то увидите, что она примет нормальный вид. Это значит, что парсер MODx видит вызов чанка, он берёт его содержимое и размещает в области, где сделан вызов. Если вы знакомы с программированием PHP, то вы увидите схожесть с концепцией использования включения файлов.

Отлично, теперь мы знаем что делать дальше и сделаем ту же процедуру с подвалом. В моём случае я выделю весь код от начала div подвала до закрывающего тега и размещу его в чанке 7in1-footer, который мы создали. Затем размещу вызов это чанка в нужном месте. Теперь конец кода моего шаблона выглядит вот так:

Снова напомню, можете делать что угодно и как угодно, можете вообще не делить ваш шаблон :). цель данной демонстрации — это показать как работать с чанками и какой их синтаксис при вызове чанков в шаблоне.

Для моих целей, я собираюсь еще поделить мой шаблон и добавить пару чанков. Эта секция шаблона появляется в основном на каждой странице вебсайта:

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modx

Я думаю разумно разместить код для этой секции в собственном чанке и далее вызывать его в наших шаблонах. Я назову этот чанк 7in1-bottomwidgets и таким образом нижняя часть кода моего шаблона приобретёт следующий вид:

Как вы видите, в зависимости от внешнего вида нашего шаблона, мы можем делить его дальше и дальше в отдельные чанки либо же не делить совсем.

Ну вот наш небольшой урок подошёл к концу.

В следующем уроке MODX Revolution для новичков мы будем копать еще глубже и рассмотрим основы переменных шаблона и как использовать их для создания множества редактируемых областей на нашей странице. Если у вас есть какие-либо замечания или исправления — не стесняйтесь, сообщайте мне об этом. Буду стараться их исправить, чтобы уроки были более полезными для всех.

Немного может путать начинающих тот факт что head называют в этой сатье header.
Header-ом обычно называют шапку сайта, но тут header это содержимое head.

Viktorminator
Sergey Larin
Сергей

А что с чантом для контента? Не могу никак понять как выводить контент в зависимости от страницы(

anadikt

У меня не получается работать с чанками. Делаю как все написано, но не выводит текст чанка. Что делать.

Viktorminator
Евгений
Алексей

Универсальный шаблон, чуть ли ни 7 шаблонов в одном, стиль которых можно изменять внося небольшие правки в стили шаблона (Разные цвета, Плоский и 3D шаблон, различное расположение контента на странице и т.д.)

Sergei Ivin
Viktor Minator
Артем Котэ
Sergei Ivin

имел ввиду теги head

Юрий Зюзин

Сергей, кстати я вот пришел на MODx с Joomla, потому что с точки зрения оптимизации, она никакая + очень много всего не нужного приходится в ней урезать. Как правильно оформить Сео теги?

Руслан Юнусов

чанк подвала стоит не перед тегом
Я так понимаю это ОЧЕПЯТКА?

Руслан Юнусов

На последнем примере короче)

Руслан Юнусов
Антон Щёлкин

Хороший урок. Но шпаргалка по чанкам что-то не открывается у меня, пустую страницу выдает.

Источник

MODx: ресурсы, чанки и какие-то телевизоры

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

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

Статья ориентирована в основном на Revolution и отражает основные отличия в синтаксисе её от предшественницы, но для обратной совместимости буду вставлять иногда аналогии с Evolution.

Ресурсы (Resources)

Зачастую ресурс представляет собой страницу сайта. Кроме того существуют другие типы ресурсов, такие как, ссылки, сами файлы, и т.д. По умолчанию тип нового ресурса — документ, точнее представление одной страницы вашего сайта.

Шаблоны (Templates)

Параметры

Используются для вывода значений полей ресурса.
Вызов осуществляется так:

EvolutionRevolution
[*field*][[*field]]

Полный список полей можно посмотреть в документации здесь.

TV параметры

ТелевизорДополнительное поле или переменная шаблона (TV) — это настраиваемое поле, или, точнее это настраиваемое поле для ресурсов MODx. TV-параметры используются для расширения стандартных полей ресурса. Каждый ресурс в MODx имеет определенное количество полей по умолчанию см. выше в разделе про ресурсы.
Если встаёт задача добавить некоторые дополнительные поля на страницу, например, выпадающий список названий месяцев или дополнительное изображение, или любой другой тип пользовательских данных, это можно сделать добавив TV-параметр соответствующего типа. MODx позволяет иметь практически неограниченное количество TV-параметров.
TV-тег заменяется соответствующим значением заполненным пользователем при обработке ресурса. Так же каждый такой параметр привязан к какому либо шаблону и может использоваться лишь в совокупности с ним.
Вызов осуществляется так:

EvolutionRevolution
[*tv*][[*tv]]

TV параметры можно использовать как чанки добавляя им параметры. Например если есть TV-параметр ‘intromsg’ со значением:

Полный список фильтров можно посмотреть тут. Кроме того фильтры можно применять к чанкам и сниппетам.

Комментарии

Чанки (Chunks)

Чанк — кусок статического текста который можно встроить в шаблон, в другой чанк, либо вызвать в снипете. Чанк обладает теми же свойствами что и шаблон за исключением того, что не содержит TV-параметров и не может быть назначен ресурсу напрямую.
Чанк не может содержать какой-либо исполняемый код, но в нём можно вызывать сниппеты для вывода динамического контента.
Вызов чанка осуществляется так:

EvolutionRevolution
<>[[$chunk]]

В чанк можно передавать параметры. К примеру мы создадим чанк с таким содержанием:

Сниппеты (Snippets)

Сниппет — ​PHP код который исполняется во время обработки шаблона MODx. Результат работы его может быть расположен либо на месте его вывода, либо в плейсхолдерах, специальных тегах определяющими куда поместить те или иные результаты.

Вызов сниппета осуществляется так:

EvolutionRevolution
[[snippet]][[snippet]]

Размещение плейсхолдера:

EvolutionRevolution
[+placeholder+][[+placeholder]]

Как и чанки в сниппеты можно передавать параметры, например так:

Чтобы указать системе не кешировать сниппет требуется добавить восклицательный знак перед именем:

Синтаксис тегов

Каждый тег MODx Revolution может содержать в себе другие теги MODx. Для того что бы код был более менее читаем разрешено размещать код тега на нескольких строках придерживаясь такого общего формата (в скобках мои комментарии, которые писать не надо =)):

Источник

Основы движка MODX — чанки, сниппеты и плейсхолдеры

Рассмотрим базовые элементы движка MODX — чанки, сниппеты и плейсхолдеры. Они являются неотъемлемой частью сайтов на этой CMS, поэтому следует четко понимать их отличие и назначение. Посмотрим следующую схему:

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modx

Чанки

Чанк это мини-шаблон для отдельного блока сайта. Например, требуется для разных страниц использовать разные шаблоны, а шапка сайта должна быть одинаковой. В таком случае её лучше вынести в отдельный чанк и подключить его в нужных шаблонах. При необходимости поправить код шапки, не придется редактировать все имеющиеся шаблоны. Достаточно будет поправить один чанк.

Чанки могут быть вложены друг в друга, содержать сниппеты и плейсхолдеры:

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modx

Сниппеты в modx revo

Сниппет — это программный код (PHP,SQL,XPDO), в результате выполнения которого возвращается результат (аналог функций в PHP). Чаще всего результатом является html код, но это не обязательно. Например, он может произвести действия с базой данных и при этом ничего не вывести на экран. Вызываться сниппет может в шаблоне, чанке и даже в содержимом ресурса:

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

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

Что такое чанки в modx. Смотреть фото Что такое чанки в modx. Смотреть картинку Что такое чанки в modx. Картинка про Что такое чанки в modx. Фото Что такое чанки в modx

Передача параметров сниппету

Создадим сниппет «CountChar», который будет в качестве параметров получать строку и цвет, а на выходе выдавать количество букв в строке и выделять это число указанным цветом.

В коде сниппета получаем параметры. При этом, можно задать значение, которое будет присваиваться переменной, если параметр не указывался (», ‘black’). Далее производим вычисления и возвращаем результат.

Передача плейсхолдеров в чанк

Мы реализовали задуманное, но при этом нарушили негласное правило — смешали программный код и теги оформления. Если кому-то потребуется обернуть результат не в тег «span», а в «div», то могут возникнуть проблемы. Конечно, хорошо когда в коде всего десять строк, а если их будет тысяча? Для избежания таких проблем отделим «мух от котлет».

Создадим чанк «tplCountChar», внутрь которого поместим плейсхолдеры:

Осталось доработать сам сниппет. Разбирать его подробно не будем, так как он содержит в себе комментарии:

Результат работы: 11 символов!

Запуск сниппета из сниппета

Про тонкости разработки сниппетов в MODX Revolution можно написать целую книгу, поэтому я ограничусь ещё только одной «фишкой» — возможностью запускать из своего сниппета сторонние. При создании сайтов такой функционал будет требоваться крайне редко, поэтому считайте эту информацию лишь небольшим бонусом.

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

Плейсхолдеры в MODX

Есть ещё системные плейсхолдеры. Они берутся из системных настроек MODX и доступны для вызова в любом месте сайта:

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

Источник

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

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