Меню с многоуровневым списком с помощью wayfinder. Modx wayfinder примеры

[Evo] Документация Wayfinder параметры, документация от Василисы Белозеровой

Параметры modх evo находятся тут

Текущая версия: 2.0.1

Автор: Kyle Jaebker

С помощью этого сниппета создается меню и всевозможные списки.

Особенности Wayfinder

Настраиваемый шаблон.
Динамические классы для каждого пункта меню.
Уникальный идентификатор для каждого пункта меню.
Показывать кол-во документов для каждого родителя.
Несколько вариантов сортировки.
Динамическая загрузка пользовательских JavaScript и CSS.
Многие заполнители для полного контроля над фрагментом выход.
Динамически скрывать / отображать подменю.
Отладочный режим работы для веб-мастеров.

Инструкция по установке

Создайте папку по адресу assets/snippets с именем Wayfinder.
Скопируйте файл wayfinder.inc.php в эту папку

Создайте новый сниппет с именем Wayfinder, через админку (Управление элементами - Сниппет - Новый сниппет)
Скопируйте содержимое файла snippet.wayfinder.tpl.php в содержание сниппета.
Используйте вызов сниппета для создания меню.

Пример использования:

[!Wayfinder?&startId =`0`!]

Параметры Wayfinder Modx Evo

&startIdпо умолчанию: id текущего документаЗначения: [0 | id документа | [*parent*] | [*ID*]]Описание: startId параметр определяет, где Wayfinder должен начать обработку. Все документы, содержащиеся в startId будут обработаны. Для запуска из корневого каталога сайта startId должен быть установлен на 0.&levelпо умолчанию: 0Значения: [0 | номер]Описание: Уровень вложенности меню, насколько глубоко в структуру дерева Wayfinder будет обрабатывать. Если установлено в 0, Wayfinder будет обрабатывать все уровни дерева документа.&includeDocsпо умолчанию: 0Значения: [разделенный запятыми список id идентификаторов документа]Описание: действует как фильтр и ограничивает вывод только документами, указанными в этом параметре.&excludeDocsпо умолчанию: 0Значения: [разделенный запятыми список id идентификаторов документа]Описание: действует как фильтр и не выводит документы, указанные в этом параметре. &ignoreHiddenпо умолчанию: FALSEЗначения: [TRUE | FALSE]Описание: ignoreHidden параметр позволяет Wayfinder не обращать внимания на галочку отображения в меню, которая может быть установлена для каждого документа. С помощью этого параметра установленого в TRUE, все документы будут отображаться независимо от галочек.&phпо умолчанию: FALSEзначения: имя плейсходераОписание: Имя подстановщика, заменяющего непосредственно выводимые результаты&debugпо умолчанию: FALSEЗначения: [TRUE | FALSE]Описание: Режим отладки&hideSubMenusпо умолчанию: FALSEЗначения: [TRUE | FALSE]Описание: Установить в ‘true’, чтобы выводилось только активное подменю&removeNewLinesпо умолчанию: FALSEЗначения: [TRUE | FALSE]Описание: Wayfinder будет автоматически добавлять строки в выводе результата для повышения читабельности кода. Чтобы удалить эти разрывы строк, установите этот параметр в FALSE.&textOfLinksпо умолчанию: MenuTitleЗначения: [ id | menutitle | pagetitle | introtext | menuindex | published | hidemenu | parent | isfolder | description | alias | longtitle | type | template ]Описание: Параметр для названия ссылки (имя поля, которое будет названием ссылки) [+wf.linktext+].&titleOfLinksпо умолчанию: PageTitleЗначения: [ id | menutitle | pagetitle | introtext | menuindex | published | hidemenu | parent | isfolder | description | alias | longtitle | type | template ]Описание: Значение будет вставлено в [+wf.title+]. Имя поля, которое будет использовано для title ссылки.&rowIdPrefixпо умолчанию: FALSEзначения: имя префиксаОписание: Добавлять префикс к id для каждой ссылки (id = rowIdPrefix + docId)&useWeblinkUrlпо умолчанию: TRUE,Значения: [TRUE | FALSE]Описание: Вывод ссылки в плэйсхолдер [+wf.link+]&showSubDocCountпо умолчанию: FALSEЗначения: [TRUE | FALSE]Описание: Выводить количество документов в [+wf.subitemcount+]&sortOrderпо умолчанию: ASCЗначения: [ASC | DESC]Описание: Параметр для сортировки.&sortByпо умолчанию: menuindexЗначения: [ id | menutitle | pagetitle | introtext | menuindex | published | hidemenu | parent | isfolder | description | alias | longtitle | type | template | random ]Описание: Сортировка&limitпо умолчанию: 0Значения: числовые значенияОписание: Максимальное число пунктов меню.&displayStartпо умолчанию: FALSEЗначения: [TRUE | FALSE]Описание: displayStart выведет заголовок - startId и затем подкатегории, с помощью шаблона startItemTpl. Этот параметр работает только в том случае, если startId не равен нулю. Эта функция была добавлена, чтобы легко добавить заголовок подменю. &displayStart=`1` - добавить заголовок подменю.

Шаблоны

&outerTplпо умолчанию: см. примерзначения: имя шаблона кусокОписание: outerTpl шаблон используется в качестве внешней оболочки для меню. Если не указано innerTpl, то outerTpl используется при создании подменю.доступные заполнители:[+wf.classes+] - классы, где specifed будет вставлен (включает в себя класс = "") [+wf.classnames+] - выводит только имена классов (без классом = "") [+wf.wrapper+] - где внутреннее содержание будет вставленНапример:<ul [+wf.classes+]>[+wf.wrapper+]</ul>&rowTplпо умолчанию: см. примерзначения: имя шаблона кусокОписание: rowTpl шаблон используется для внутренней оболочки меню.доступные заполнители: [+wf.classes+] - классы, где specifed будет вставлен (включает в себя класс = "") [+wf.classnames+] - выводит только имена классов (без классом = "") [+wf.link+] - HREF значение для вашей ссылки [+wf.title+] - текст для ссылки названием [+wf.linktext+] - текст для ссылки дисплей [+wf.wrapper+] - куда вставлять подменю [+wf.id+] -, где вставить уникальный идентификатор [+wf.attributes+] - куда вставлять ссылки атрибутов [+wf.docid+] - идентификатор документа для текущего элемента [+wf.subitemcount+] - отображает количество элементов в папке [+wf.description+] - вывод описания полей [+wf.introtext+] - вывод introtext полеНапример: <li [+wf.id+] [+wf.classes+]><a href="[+wf.link+]" title="[+wf.title+]" [+wf.attributes+]>[+wf.linktext+]</a>[+wf.wrapper+] </li> &parentRowHereTplпо умолчанию: NULLзначения: имя шаблона кусокОписание: Шаблон вывода активного документа-контейнерадоступные заполнители: То же, что RowTpl.Например: <li [+wf.classes+]> <a href="[+wf.link+] " title=" [+wf.title+] "> [+wf.linktext+] »</a>[+wf.wrapper+] </li> &parentRowTplпо умолчанию: NULLзначения: имя шаблона кусокОписание: Шаблон документа контейнераНапример: <li [+wf.classes+]> <a href = "[+wf.link+] " title=" [+wf.title+] "> [+wf.linktext+] </a> [+wf.wrapper+] </li> &hereTplпо умолчанию: NULLзначения: имя шаблона кусокОписание: hereTpl шаблон используется, когда текущий элемент активен в меню.доступные заполнители: То же, что RowTpl.Например: <li [+wf.classes+]><span> [+wf.linktext+]</span>[+wf.wrapper+]</li> &innerTplпо умолчанию: NULLзначения: имя шаблона кусокОписание: innerTpl шаблон используется в качестве оболочки для каждого подменю. Если не указано innerTpl, то используется outerTpl. доступные заполнители: То же, что OuterTpl.Например: <ul [+wf.classes+]>[+wf.wrapper+]</ul> &innerRowTplпо умолчанию: NULLзначения: имя шаблона кусокОписание: innerRowTpl шаблон внутренний для подменю.доступные заполнители: То же, что RowTpl.Например: <li [+wf.classes+]><a href="[+wf.link+]" title="[+wf.title+]"> [+wf.linktext+]</ a>[+wf.wrapper+]</li> &innerHereTplпо умолчанию: NULLзначения: имя шаблона кусокОписание: innerHereTpl шаблон используется, когда текущий элемент активен и при этом находится в ПОДменю (пункт имеет уровень больше чем один, находится в папке).доступные заполнители: То же, что RowTpl.Например: <li [+wf.classes+]><span>[+wf.linktext+]</ span>[+wf.wrapper+]</li> &activeParentRowTplпо умолчанию: NULLзначения: имя шаблона кусокОписание: activeParentRowTpl шаблон используется для родителей, и т.д.. текущего пункта меню. Шаблон применяется на всех уровнях вверх по дереву документов.доступные заполнители: То же, что RowTpl.Например: <li [+wf.classes+]> <a href= "[+wf.link+]" title=" [+wf.title+] "> [+wf.linktext+] </ a> [+wf.wrapper+] </li> &categoryFoldersTplпо умолчанию: NULLзначения: имя шаблона кусокОписание: categoryFoldersTpl используется, когда элемент представляет собой папку, и либо имеет шаблон blank или имеет rel="category" в поле ссылки атрибутов. доступные заполнители: То же, что RowTpl.Например: <li [+wf.classes+]> <a href = "[+wf.link+] " title=" [+wf.title+] "> [+wf.linktext+]</ a> [+wf.wrapper +] </li> &startItemTplпо умолчанию: см. примерзначения: имя шаблонаОписание: startItemTpl используется для создания шаблонов заголовка - startId, когда параметр &displayStart установлен в TRUE.доступные заполнители: То же, что RowTpl.Например: <h3> [+wf.linktext+]</h3> [+wf.wrapper+]

Заказ шаблонов обработки

startItemTpl
parentRowHereTpl
innerHereTpl
hereTpl
activeParentRowTpl
categoryFoldersTpl
parentRowTpl
innerRowTpl
rowTpl

Имена классов

&firstClassпо умолчанию: NULLзначения: имя классаОписание: Firstclass будут применены к первому пункту, для каждого уровня.&lastClassпо умолчанию: последнийзначения: имя классаОписание: lastClass будет применяться к последнему пункту, для каждого уровня.&hereClassпо умолчанию: активнаязначения: имя классаОписание: hereClass будут применены к активному элементу и каждому родителю вверх по дереву документов.&selfClassпо умолчанию: NULLзначения: имя классаОписание: selfClass будут применены только к текущему (активному) элементу.&parentClassпо умолчанию: NULLзначения: имя классаОписание: ParentClass будут применяться к каждому элементу, который имеет детей (папка, контейнер).&rowClassпо умолчанию: NULLзначения: имя классаОписание: rowClass будут применяться к каждому элементу отображается.&levelClassпо умолчанию: NULLзначения: имя классаОписание: levelClass будут применяться к каждому элементу обозначающие каждый пункты уровне, на уровне номер будет добавлен в выбранный класс (level1 т. е. Level2, Level3, и т.д. ..)&outerClassпо умолчанию: NULLзначения: имя классаОписание: OuterClass будет применяться к outerTpl контейнер.&innerClassпо умолчанию: NULLзначения: имя классаОписание: InnerClass будет применяться к контейнеру, используемые в innerTpl.&webLinkClassпо умолчанию: NULLзначения: имя классаОписание: webLinkClass будет применяться ко всем вебссылок включены в выходные.

CSS и Javascript для включения в меню

&cssTplпо умолчанию: FALSEзначения: имя кусок CSSОписание: cssTpl позволяет за кусок содержащей ссылку на таблицу стилей или стилей информацию, которая будет вставлена ??в головной части создаваемой страницы.&jsTplпо умолчанию: FALSEзначения: имя чанка с кодом JavascriptОписание: jsTpl параметр позволяет за кусок, содержащий некоторые Javascript для вставки в головной части создаваемой страницы.

Практические уроки:

Встроенные конфигурации меню

Как создать меню на ModxEvo

Фильрация Wayfinder

Уровневое меню

yotadom.com

Wayfinder, компонент для создания меню

Wayfinder — компонент для создания меню или списка ссылок. Существует как для MODX evo так и для revo.

Параметры

&config — Имя внешнего php файла с настройками меню

&debug — Режим отладки

Формат: 0 | 1Значение по умолчанию: 0Примечание: Установить режим отладки для диагностики.Пример: &debug=`1`

&displayStart — Показать начальную папку, указанную в startId

Формат: 0 | 1Значение по умолчанию: 0Примечание: Если &displayStart=1 заставит Wayfinder вывести ссылку на документ, используемый в качестве &startId, используя шаблон &startItemTpl. Параметр работает, если только &startId не равен нулю.Пример: &displayStart=`1`

&excludeDocs — Исключаемые документы

Формат: ID документов, разделенных запятойЗначение по умолчанию: нетПримечание: список любых документов, разделенный запятымиПример: &excludeDocs=`6,7,8`

&fullLink — Вывести полный URL

Формат: 0 | 1Значение по умолчанию: 0Пример: &fullLink=`1`

&hereId — Id документа, текущего для генерируемого меню.

Значение по умолчанию: текущий idПримечание: Нужно указывать только если скрипт сам его неверно определяет, например при выводе меню из чанка другого сниппета.Пример: &hereId=``

&hideSubMenus — Скрывать подменю и выводить для активного пункта

Формат: 0 | 1Значение по умолчанию: 0Пример: &hideSubMenus=`1`

&ignoreHidden — Выводить документы не отмеченные для показа в меню

Формат: 0 | 1Значение по умолчанию: 0Пример: &ignoreHidden=`1`

&includeDocs — Документы, обязательные для вывода

Формат: ID документов, разделенных запятойЗначение по умолчанию: нетПример: &includeDocs=`5,6,7`

&level — Количество уровней в меню

Формат: числоЗначение по умолчанию: 0Примечание: 0 — показывать все уровниПример: &level=`3`

&limit — Максимальное число пунктов меню

Формат: целое числоЗначение по умолчанию: 0Примечание: 0 — без ограниченияПример: &limit=`5`

&ph — Вывод результата в плейсхолдер

Формат: плейсхолдерЗначение по умолчанию: нетПримечание: Весь код результата будет сохранен в переменную, значение которой можно вставить в страницу при помощи плейсхолдера с именем переменной.Пример: &ph=`wf_menu`

&removeNewLines — Удалять символ переноса в результате

Формат: 0 | 1Значение по умолчанию: 0Примечание: Убирать символ переноса строки при выводе. т. е. весь результирующий код будет в виде одной строки.Пример: &removeNewLines=`1`

&rowIdPrefix — Добавлять префикс к id для каждой ссылки

Значение по умолчанию: нетПримечание: Добавлять префикс к идентификатору (id) для каждого элемента (id складывается из значения rowIdPrefix + docId)Пример: &rowIdPrefix=``

&showSubDocCount — Выводить количество документов в плейсхолдер wf.subitemcount

Формат: 0 | 1Значение по умолчанию: 0Пример: &showSubDocCount=`1`

&sortBy — Параметр используемый для сортировки

&sortOrder — Порядок сортировки документов

Формат: ASC | DESCЗначение по умолчанию: ASCПримечание: ASC — по возрастанию | DESC — по убываниюПример: &sortOrder=`DESC`

&startId — Источник документов для меню

Формат: ID документаЗначение по умолчанию: текущий документПримечание: Любой номер (ID) документа— контейнера.Пример: &startId=`0`

&textOfLinks — Параметр для названия ссылки

&titleOfLinks — Параметр для title ссылки

&useWeblinkUrl — Вывод ссылки в плейсхолдер wf.link

Формат: 0 | 1Значение по умолчанию: 0Пример: &useWeblinkUrl=`1`

&where — Дополнительные условия запроса в БД (v 2.0.2)

Значение по умолчанию: нетПримечание: Соответствует where в MySQLПример: &where=`isfolder = 1`

Шаблоны

&activeParentRowTpl — Шаблон родителей текущего пункта меню

Формат: имя чанкаЗначение по умолчанию: нетПримечание: Возможные плэйсхолдеры: [[+wf.classes]] — место для указания используемого CSS-класса (включает) [[+wf.classnames]] — содержит только название CSS-класса (не включает) [[+wf.link]] — адрес (href) для ссылки [[+wf.title]] — текст для title ссылки [[+wf.linktext]] — текст названия ссылки [[+wf.wrapper]] — место для вывода подменю [[+wf.id]] — вывод уникального идентификатора (id) [[+wf.attributes]] — вывод дополнительных атрибутов ссылки [[+wf.docid]] — идентификатор документа для текущего элемента [[+wf.subitemcount]] — количество элементов в папке [[+wf.description]] — выводит значения поля описания [[+wf.introtext]] — выводит значения поля интротекстаПример шаблона: <li[[+wf.classes]]><a href="[[+wf.link]]" title="[[+wf.title]]">[[+wf.linktext]]</a>[[+wf.wrapper]]</li>Пример: &activeParentRowTpl=`activeParentRowTpl`

&categoryFoldersTpl — Шаблон вывода категории

Формат: имя чанкаЗначение по умолчанию: нетПримечание: Категория определяется установкой шаблона blank или атрибутом ссылки rel="category". Возможные плэйсхолдеры: [[+wf.classes]] — место для указания используемого CSS-класса (включает) [[+wf.classnames]] — содержит только название CSS-класса (не включает) [[+wf.link]] — адрес (href) для ссылки [[+wf.title]] — текст для title ссылки [[+wf.linktext]] — текст названия ссылки [[+wf.wrapper]] — место для вывода подменю [[+wf.id]] — вывод уникального идентификатора (id) [[+wf.attributes]] — вывод дополнительных атрибутов ссылки [[+wf.docid]] — идентификатор документа для текущего элемента [[+wf.subitemcount]] — количество элементов в папке [[+wf.description]] — выводит значения поля описания [[+wf.introtext]] — выводит значения поля интротекстаПример шаблона: <li[[+wf.classes]]><a href="[[+wf.link]]" title="[[+wf.title]]">[[+wf.linktext]]</a>[[+wf.wrapper]]</li>Пример: &categoryFoldersTpl=`categoryFoldersTpl`

&cssTpl — Имя чанка содержащего CSS

Формат: имя чанкаЗначение по умолчанию: нетПример: &cssTpl=`cssTpl`

&hereTpl — Шаблон текущего пункта

Формат: имя чанкаЗначение по умолчанию: нетПримечание: Возможные плэйсхолдеры: [[+wf.classes]] — место для указания используемого CSS-класса (включает) [[+wf.classnames]] — содержит только название CSS-класса (не включает) [[+wf.link]] — адрес (href) для ссылки [[+wf.title]] — текст для title ссылки [[+wf.linktext]] — текст названия ссылки [[+wf.wrapper]] — место для вывода подменю [[+wf.id]] — вывод уникального идентификатора (id) [[+wf.attributes]] — вывод дополнительных атрибутов ссылки [[+wf.docid]] — идентификатор документа для текущего элемента [[+wf.subitemcount]] — количество элементов в папке [[+wf.description]] — выводит значения поля описания [[+wf.introtext]] — выводит значения поля интротекстаПример шаблона: <li[[+wf.classes]]><span>[[+wf.linktext]]</span>[[+wf.wrapper]]</li>Пример: &hereTpl=`hereTpl`

&innerHereTpl — Шаблон текущего пункта подменю

Формат: имя чанкаЗначение по умолчанию: нетПримечание: Возможные плэйсхолдеры: [[+wf.classes]] — место для указания используемого CSS-класса (включает) [[+wf.classnames]] — содержит только название CSS-класса (не включает) [[+wf.link]] — адрес (href) для ссылки [[+wf.title]] — текст для title ссылки [[+wf.linktext]] — текст названия ссылки [[+wf.wrapper]] — место для вывода подменю [[+wf.id]] — вывод уникального идентификатора (id) [[+wf.attributes]] — вывод дополнительных атрибутов ссылки [[+wf.docid]] — идентификатор документа для текущего элемента [[+wf.subitemcount]] — количество элементов в папке [[+wf.description]] — выводит значения поля описания [[+wf.introtext]] — выводит значения поля интротекстаПример шаблона: <li[[+wf.classes]]><span>[[+wf.linktext]]</span>[[+wf.wrapper]]</li>Пример: &innerHereTpl=`innerHereTpl`

&innerRowTpl — Шаблон для пункта подменю

&innerTpl — Шаблон для подпапок

Формат: имя чанкаЗначение по умолчанию: нетПримечание: Возможные плэйсхолдеры: [[+wf.classes]] — место для указания используемого CSS-класса (включает) [[+wf.classnames]] — содержит только название CSS-класса (не включает) [[+wf.wrapper]] — место где будет выводиться содержимое меню.Пример шаблона: <ul [[+wf.classes:tag]]>[[+wf.wrapper:tag]]</ul>Пример: &innerTpl=`innerTpl`

&jsTpl — Имя чанка содержащего JavaScript

Формат: имя чанкаЗначение по умолчанию: нетПример: &jsTpl=`jsTpl`

&lastRowTpl — Шаблон последнего пункта меню (v 2.0.3)

Формат: имя чанкаЗначение по умолчанию: rowTplПримечание: Возможные плэйсхолдеры: [[+wf.classes]] — место для указания используемого CSS-класса (включает) [[+wf.classnames]] — содержит только название CSS-класса (не включает) [[+wf.link]] — адрес (href) для ссылки [[+wf.title]] — текст для title ссылки [[+wf.linktext]] — текст названия ссылки [[+wf.wrapper]] — место для вывода подменю [[+wf.id]] — вывод уникального идентификатора (id) [[+wf.attributes]] — вывод дополнительных атрибутов ссылки [[+wf.docid]] — идентификатор документа для текущего элемента [[+wf.subitemcount]] — количество элементов в папке [[+wf.description]] — выводит значения поля описания [[+wf.introtext]] — выводит значения поля интротекстаПример шаблона: <li[[+wf.classes]]><a href="[[+wf.link]]" title="[[+wf.title]]">[[+wf.linktext]]</a>[[+wf.wrapper]]</li>Пример: &lastRowTpl=`lastRowTpl`

&outerTpl — Шаблон контейнера меню

Формат: имя чанкаЗначение по умолчанию: <ul[[+wf.classes]]>[[+wf.wrapper]]</ul>Примечание: Возможные плэйсхолдеры: [[+wf.classes]] — место для указания используемого CSS-класса (включает) [[+wf.classnames]] — содержит только название CSS-класса (не включает) [[+wf.wrapper]] — место где будет выводиться содержимое меню.Пример шаблона: <ul [[+wf.classes]]>[[+wf.wrapper]]</ul>Пример: &outerTpl=`outerTpl`

&parentRowHereTpl — Шаблон вывода активного документа— контейнера

Формат: имя чанкаЗначение по умолчанию: нетПримечание: Возможные плэйсхолдеры: [[+wf.classes]] — место для указания используемого CSS-класса (включает) [[+wf.classnames]] — содержит только название CSS-класса (не включает) [[+wf.link]] — адрес (href) для ссылки [[+wf.title]] — текст для title ссылки [[+wf.linktext]] — текст названия ссылки [[+wf.wrapper]] — место для вывода подменю [[+wf.id]] — вывод уникального идентификатора (id) [[+wf.attributes]] — вывод дополнительных атрибутов ссылки [[+wf.docid]] — идентификатор документа для текущего элемента [[+wf.subitemcount]] — количество элементов в папке [[+wf.description]] — выводит значения поля описания [[+wf.introtext]] — выводит значения поля интротекстаПример шаблона: <li[[+wf.classes]]><a href="[[+wf.link]]" title="[[+wf.title]]">[[+wf.linktext]]»</a>[[+wf.wrapper]]</li>Пример: &parentRowHereTpl=`parentRowHereTpl`

&parentRowTpl — Шаблон документа контейнера

Формат: имя чанкаЗначение по умолчанию: нетПримечание: Возможные плэйсхолдеры: [[+wf.classes]] — место для указания используемого CSS-класса (включает) [[+wf.classnames]] — содержит только название CSS-класса (не включает) [[+wf.link]] — адрес (href) для ссылки [[+wf.title]] — текст для title ссылки [[+wf.linktext]] — текст названия ссылки [[+wf.wrapper]] — место для вывода подменю [[+wf.id]] — вывод уникального идентификатора (id) [[+wf.attributes]] — вывод дополнительных атрибутов ссылки [[+wf.docid]] — идентификатор документа для текущего элемента [[+wf.subitemcount]] — количество элементов в папке [[+wf.description]] — выводит значения поля описания [[+wf.introtext]] — выводит значения поля интротекстаПример шаблона: <li[[+wf.classes:tag]]><a href="[[+wf.link]]" title="[[+wf.title]]">[[+wf.linktext]]»</a>[[+wf.wrapper]]</li>Пример: &parentRowTpl=`parentRowTpl`

&rowTpl — Шаблон пункта меню

Формат: имя чанкаЗначение по умолчанию: <li[[+wf.id:tag]][[+wf.classes]]><a href="[[+wf.link]]" title="[[+wf.title]]" [[+wf.attributes]]>[[+wf.linktext]]</a>[[+wf.wrapper]]</li>Примечание: Возможные плэйсхолдеры: [[+wf.classes]] — место для указания используемого CSS-класса (включает) [[+wf.classnames]] — содержит только название CSS-класса (не включает) [[+wf.link]] — адрес (href) для ссылки [[+wf.title]] — текст для title ссылки [[+wf.linktext]] — текст названия ссылки [[+wf.wrapper]] — место для вывода подменю [[+wf.id]] — вывод уникального идентификатора (id) [[+wf.attributes]] — вывод дополнительных атрибутов ссылки [[+wf.docid]] — идентификатор документа для текущего элемента [[+wf.subitemcount]] — количество элементов в папке [[+wf.description]] — выводит значения поля описания [[+wf.introtext]] — выводит значения поля интротекстаПример шаблона: <li[[+wf.classes]]><a href="[[+wf.link]]" title="[[+wf.title]]">[[+wf.linktext]]</a>[[+wf.wrapper]]</li>Пример: &rowTpl=`rowTpl`

&startItemTpl — Шаблон ссылки на начальную папку, указанную в startId

Формат: имя чанкаЗначение по умолчанию: <h3[[+wf.id]][[+wf.classes]]>[[+wf.linktext]]</h3>[[+wf.wrapper]]Примечание: Используется при &displayStart=`1` Возможные плэйсхолдеры: [[+wf.classes]] — место для указания используемого CSS-класса (включает) [[+wf.classnames]] — содержит только название CSS-класса (не включает) [[+wf.link]] — адрес (href) для ссылки [[+wf.title]] — текст для title ссылки [[+wf.linktext]] — текст названия ссылки [[+wf.wrapper]] — место для вывода подменю [[+wf.id]] — вывод уникального идентификатора (id) [[+wf.attributes]] — вывод дополнительных атрибутов ссылки [[+wf.docid]] — идентификатор документа для текущего элемента [[+wf.subitemcount]] — количество элементов в папке [[+wf.description]] — выводит значения поля описания [[+wf.introtext]] — выводит значения поля интротекстаПример шаблона: <h3>[[+wf.linktext]]</h3>[[+wf.wrapper]]Пример: &startItemTpl=`startItemTpl`

Классы

&firstClass — CSS-класс первого пункта меню на данном уровне

Формат: название CSS классаЗначение по умолчанию: нетПример: &firstClass=`firstClass`

&hereClass — CSS-класс текущей цепочки пунктов меню

Формат: название CSS классаЗначение по умолчанию: activeПример: &hereClass=`hereClass`

&innerClass — CSS-класс для подпунктов меню

Формат: название CSS классаЗначение по умолчанию: нетПример: &innerClass=`innerClass`

&lastClass — CSS-класс последнего пункта меню

Формат: название CSS классаЗначение по умолчанию: lastПример: &lastClass=`lastClass`

&levelClass — CSS-класс для каждого уровня меню

Формат: название CSS классаЗначение по умолчанию: нетПримечание: Число уровня будет добавлено к указанному классу (то есть level1, level2, level3, и т.д... )Пример: &levelClass=`level`

&outerClass — CSS-класс для контейнера меню

Формат: название CSS классаЗначение по умолчанию: нетПример: &outerClass=`outerClass`

&parentClass — CSS-класс документов-контейнеров

Формат: название CSS классаЗначение по умолчанию: нетПример: &parentClass=`parentClass`

&rowClass — CSS-класс для всех пунктов меню

Формат: название CSS классаЗначение по умолчанию: нетПример: &rowClass=`rowClass`

&selfClass — CSS-класс текущего пункта меню

Формат: название CSS классаЗначение по умолчанию: нетПримечание: Определяет только текущий документ.Пример: &selfClass=`selfClass`

&webLinkClass — CSS-класс для пунктов меню — ссылок

Формат: название CSS классаЗначение по умолчанию: нетПример: &webLinkClass=`webLinkClass`

Примеры

Простой вариант вызова

[[Wayfinder? &startId=`15`]]

15 — ID папки, из которой нам необходимо вывести документы в меню

Дочерние документы

[[Wayfinder? &startId=`[[*id]]`]]

где [[*id]] автоматически заменяется на ID текущего документа.

Соседние документы/разделы

[[Wayfinder? &startId=`[[*parent]]`]]

где [[*parent]] автоматически заменяется ID родителя текущего документа.

Примечание: [[*parent]] у главной страницы равен 0.

Карта сайта

[[Wayfinder? &startId=`0`]]

Примечание: Проверяйте результат на наличие документов, которые не выводятся в основных меню, но могут попасть в карту сайта. Так как галочка «показывать в меню» по умолчанию включена, то можно случайно пропустить служебные документы (результаты поиска, страница 404, RSS и т.д.)

Вывод подменю не у всех разделов

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

<li> <a href="[[+wf.link]]">[[+wf.linktext]]</a> [[+id:ne=`5`:then=`[[+wf.wrapper]]`]] </li>

www.riwkus.pro

| Сниппет Wayfinder | Уроки MODx Evo

Кэшируемый вызов сниппета

[[Имя_сниппета? &параметр1=`значение` &параметр2=`значение`]]

Некэшируемый вызов сниппета.

[!Имя_сниппета? &параметр1=`значение` &параметр2=`значение`!]

Сниппет Wayfinder

Меню, карта сайта и др. на сайте выводится сниппетом Wayfinder.

Кэшируемый вызов сниппета Wayfinder.

[[Wayfinder]]

Некэшируемый вызов сниппета Wayfinder.

[!Wayfinder!]

Параметры сниппета Wayfinder можно посмотреть по ссылкам:

http://i--gu.ru/wayfinder

http://wiki.modxcms.com/index.php/Wayfinder

Примеры вызова сниппета Wayfinder

[!Wayfinder? &startId=`4` &hideSubMenus=`true` &sortBy=`menuindex` &level=`5`!]

[!Wayfinder? &startId=`0` &level=`1` &sortBy=`menuindex` &excludeDocs=``!]

Часто используемые параметры сниппета

&startId=`2`– id ресурса для вывода меню (дочерних ресурсов).

&level=`3` – количество выводимых уровней меню, 0 - показывать все уровни.

&includeDocs=`5,6,7` – документы, обязательные для вывода.

&excludeDocs=`6,7,8` – исключаемые документы.

&hideSubMenus=`1` – скрывать/показывать (1|0) подменю и выводить для активного пункта.

Сниппет Wayfinder генерирует список ul, первый пункт списка имеет класс <li>, последний пункт – класс <li>. Чтобы в таблице стилей присвоить этому списку индивидуальное оформление, список надо окружить тегом <div> с уникальным именем, например вот так:

<div> <ul> <li><a href="/about.html" title="О нас" >О нас</a></li> <li><a href="/contact.html" title="Контактная информация" >Контактная информация</a></li> <li><a href="/novosti.html" title="Новости" >Новости</a></li> <li><a href="/uslugi.html" title="Услуги" >Услуги</a></li> </ul></div>

web-grafika.pro

Фильтрация в Wayfinder

Вряд ли найдется MODx-сайт, на котором не использовался бы мощнейший сниппет для формирования меню Wayfinder. Всем хорош, элегантен, невероятно гибок, но и в нем есть вещи, которые хотелось бы улучшить. Мне, например, иногда не хватает в нем возможности отсечь часть вывода по определенному критерию. Разумеется, можно написать свой сниппет, но зачем заниматься лишней работой, когда в нашем распоряжении вся мощь модэкса?

В нынешнем случае потребовалось сделать меню на сайте интернет-магазина, в котором по документам-контейнерам были распределены товары. Такое разделение условно – возможно, мы будем разделять не товары и категории товаров, а файлы и папки в дереве документов. Принцип останется тем же. В каждый контейнер могут входить как документы-товары, так и другие документы-контейнеры. Например, в документ-контейнер «Продукты» мог попасть «арбуз» (документ) и «фрукты» (контейнер). Тип документа определялся шаблоном: «папка» или «документ». Первоначально меню создавалось вот таким вызовом сниппета:

[!Wayfinder? &startId=`51`!]

Здесь «51» – корневой документ, верхний уровень, «склад» товаров и их категорий, ваша точка «/», если применять аналогию с файлами и папками. В нем расположились другие контейнеры и документы. К сожалению, такое меню быстро перестало меня устраивать. Некоторые контейнеры были вложенными на разные уровни глубины, а вываливать вместе с ними длинные списки документов было некрасиво.

Если бы меню выводилось при помощи Ditto, можно было просто поставить фильтр, который включит в список только документы с нужным шаблоном:

[[Ditto? &startID=`0` &depth=`0` &filter=`template,5,1` &tpl=`menuTpl`]]

Здесь «5» - это номер шаблона для «папок»-контейнеров. К сожалению, Ditto не построит нужной мне иерархической структуры, он просто не предназначен для этого. Значит, придется все-таки воспользоваться Wayfinder. Если как следует подумать, фильтр в этом сниппете все-таки имеется, хотя и в завуалированном виде. Я говорю о параметре excludeDocs.

Вы, наверное, возразите, что это никакой не фильтр, а просто список документов, которые надо исключить из вывода сниппета. Все верно, но кто мешает нам сделать этот параметр динамическим?

[!Wayfinder? &startId=`51` &excludeDocs=``!]

Дело за малым – нам нужно предоставить сниппету чанк, в котором будут через запятую перечислены ID документов с описанием товаров. Давайте создадим чанк с таким названием и внесем в него следующую строку:

[[Ditto? &startID=`0` &depth=`0` &filter=`template,6,1`]#93;

Здесь «6» - это номер моего шаблона для документов с описанием товара. Иначе говоря – критерий для исключения документа из публикации в меню. Правда, в таком виде эта конструкция работать не будет, поскольку вместо списка номеров мы получим стандартный вывод Ditto с названиями, датами и аннотациями документов. Нам нужны только ID. Чтобы не загромождать систему лишними чанками, вставим нужные шаблоны прямо в вызов Ditto. Для этого я предлагаю использовать один из моих любимых приемов – @-привязку.

[[Ditto? &startID=`0` &depth=`0` &filter=`template,6,1` &tpl=`@CODE ,` &tplLast=`@CODE `]]

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

Итак, что мы имеем? Дитто, согласно критерию фильтрации (нужный шаблон) выдает список документов-«не контейнеров», вернее только их ID через запятую (благодаря использованию микро-шаблонов с @-привязкой). Wayfinder берет полный список папок и документов, а затем исключает из него по списку те, который предоставил ему Ditto. Получается аккуратное и не загроможденное меню с нужной нам информацией.

Обожаю MODx.

Александр Поляков[email protected]

modx.ru

Меню с помощью Wayfinder. Блог на MODx Revo. Часть 3.

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

Мобильная
Обычная

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

&outerTpl=` wayOuterTpl` - чанк обертка основного списка

<ul> [ [+wf.wrapper] ] </ul>

&innerTpl=` wayInnerTpl` - чанк обертка выпадающего списка

<ul> [ [+wf.wrapper] ] </ul>

&rowTpl=` wayRowTpl`- чанк вывод элементов списка

<li [ [+wf.classes] ]> <a href="[ [+wf.link] ]">[ [+wf.linktext] ]</a> </li>

&parentRowTpl=`wayHasChildTpl` - чанк вывод элементов списка-родителей

<li> <a data-toggle="dropdown" href="[ [+wf.link] ]">[ [+wf.linktext] ] <b> </b></a> [ [+wf.wrapper] ] </li>

И привожу вызов сниппета в чанке header:

[ [Wayfinder? &startId=`0` &level=`2` &outerTpl=`wayOuterTpl` &innerTpl=`wayInnerTpl` &rowTpl=`wayRowTpl` &parentRowTpl=`wayHasChildTpl` ] ]

&startId=`0` - задаем начало прохода сниппета, в нашем случае от корня сайта. &level=`2` - количество уровней в нашем меню.

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

&outerTpl=`wayOuterMobileTpl` - чанк обертка основного списка.

<select onchange="window.open(this.options[this.selectedIndex].value,'_top')"> [ [+wf.wrapper] ] </select>

&innerTpl=`wayInnerMobileTpl` - чанк обертка внутреннего списка.

[ [+wf.wrapper] ]

&rowTpl=`wayRowMobileTpl` - чанк вывод элементов списка.

<option value="[ [+wf.link] ]">[ [+wf.linktext] ]</option> [ [+wf.wrapper] ]

&innerRowTpl=`wayInnerRowMobileTpl` - чанк вывод элементов внутреннего списка.

<option value="[ [+wf.link] ]">- [ [+wf.linktext] ]</option> [ [+wf.wrapper] ]

Вызов Wayfinder примет следующий вид:

[ [Wayfinder? &startId=`0` &level=`2` &outerTpl=`wayOuterMobileTpl` &innerTpl=`wayInnerMobileTpl` &rowTpl=`wayRowMobileTpl` &innerRowTpl=`wayInnerRowMobileTpl` ] ]

Все тоже самое, только изменились чанки. Теперь у нас есть мобильная навигация, проверить ее можете с помощью инструмента Responsive Web Design Tester для Opera и Chrome.

Привожу полный код чанка header:

<div> <div> <a href="[ [++site_url] ]"><img src="img/piccolo-logo.png" alt="" /></a> <h5>Big Things... Small Packages</h5> </div> <div> <div> [ [Wayfinder? &startId=`0` &level=`2` &outerTpl=`wayOuterTpl` &innerTpl=`wayInnerTpl` &rowTpl=`wayRowTpl` &parentRowTpl=`wayHasChildTpl` ] ] </div> <form action="#"> <div> [ [Wayfinder? &startId=`0` &level=`2` &outerTpl=`wayOuterMobileTpl` &innerTpl=`wayInnerMobileTpl` &rowTpl=`wayRowMobileTpl` &innerRowTpl=`wayInnerRowMobileTpl` ] ] </div> </form> </div> </div>

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

artemblog.ru

Меню с многоуровневым списком с помощью wayfinder

Здравствуйте. С вчерашнего дня, пытаюсь решить проблему с меню через wayfinder. Но не могу найти решение.Вот тут html код, каким должен создаваться меню:<div> <div> <ul> <li> <a href="index.html"><span>Home</span></a> <ul> <li><a href="index-nivo.html">Alternate</a></li> <li><a href="index-async.html">Alternate 2</a></li> <li><a href="index-flex.html">Alternate 3</a></li> <li><a href="index-style-5.html">Alternate 4</a></li> <li><a href="index-style-6.html">Alternate 5</a></li> </ul> </li> <li><a href="#">Pages</a> <ul> <li><a href="index.html">Homepages</a> <ul> <li><a href="index-nivo.html">Alternate</a></li> <li><a href="index-async.html">Alternate 2</a></li> <li><a href="index-flex.html">Alternate 3</a></li> <li><a href="index-style-5.html">Alternate 4</a></li> <li><a href="index-style-6.html">Alternate 5</a></li> </ul> </li> <li><a href="portfolio-standard-3.html">Portfolios</a> <ul> <li><a href="portfolio-standard-1.html">Standard 1 Column</a></li> <li><a href="portfolio-standard-2.html">Standard 2 Columns</a></li> <li><a href="portfolio-standard-3.html">Standard 3 Columns</a></li> <li><a href="portfolio-standard-3-alternate.html">Standard 3 Alternate</a></li><li><a href="portfolio-standard-4.html">Standard 4 Columns</a></li> <li><a href="portfolio-standard-5.html">Standard 5 Columns</a></li> <li><a href="portfolio-info.html">Info Style</a></li> <li><a href="portfolio-basic-1.html">Basic Style</a></li> </ul> </li> <li><a href="blog.html">Blog Pages</a> <ul> <li><a href="blog.html">Standard Blog</a></li> <li><a href="blog-style-2.html">Blog Style 2</a></li> <li><a href="blog-style-3.html">Blog Style 3</a></li> <li><a href="blog-style-4.html">Blog Style 4</a></li> <li><a href="blog-post.html">Blog Post (Single)</a></li> </ul> </li> <li><a href="contact.html">Contact Pages</a> <ul> <li><a href="contact.html">Contact</a></li> <li><a href="contact-style-2.html">Contact 2</a></li> </ul> </li> <li><a href="sidebar-right.html">Sidebar Right</a></li> <li><a href="sidebar-left.html">Sidebar Left</a></li> </ul> </li> <li> <a href="blog.html">Blog</a> <ul> <li><a href="blog.html">Standard Blog</a></li> <li><a href="blog-style-2.html">Blog Style 2</a></li> <li><a href="blog-style-3.html">Blog Style 3</a></li> <li><a href="blog-style-4.html">Blog Style 4</a></li> <li><a href="blog-post.html">Blog Post (Single)</a></li> </ul> </li> <li> <a href="portfolio-standard-3.html"> Portfolio </a> <ul> <li><a href="portfolio-standard-1.html">Standard 1 Column</a></li> <li><a href="portfolio-standard-2.html">Standard 2 Columns</a></li> <li><a href="portfolio-standard-3.html">Standard 3 Columns</a></li> <li><a href="portfolio-standard-3-alternate.html">Standard 3 Alternate</a></li><li><a href="portfolio-standard-4.html">Standard 4 Columns</a></li> <li><a href="portfolio-standard-5.html">Standard 5 Columns</a></li> <li><a href="portfolio-info.html">Info Style</a></li> <li><a href="portfolio-basic-1.html">Basic Style</a></li> </ul> </li> <li> <a href="contact.html"> Contact </a> </li> </ul> </div> </div> </div>Что я сделала:

Получается у меня так:

[[!Wayfinder? &startId=`0` &outerTpl=`designHeaderMenuOuter` &rowTpl=`designHeaderMenuRow` &innerTpl=`designHeaderMenuInner` &innerRowTpl=`designHeaderMenuInnerRow` &innerTpl=`designHeaderMenuOuter2` &innerClass=`` &hereClass=`` &firstClass=`` &lastClass =`` ]]

У меня чанки для меню созданы таким образом:

В designHeaderMenuOuter добавила: <ul>[[+wf.wrapper]]</ul> В designHeaderMenuRow добавила: <li><a href="[[+wf.link]]" title="[[+wf.title]]" [[+wf.classes]] [[+wf.attributes]]>[[+wf.linktext]]</a>[[+wf.wrapper]]</li> В designHeaderMenuInner: <ul>[[+wf.wrapper]]</ul> В designHeaderMenuInnerRow: <li><a href="[[+wf.link]]" title="[[+wf.title]]" [[+wf.attributes]]>[[+wf.linktext]]</a>[[+wf.wrapper]]</li> В designHeaderMenuOuter2: <ul>[[+wf.wrapper]]</ul>

На сайте html код становится таким

Первый (ul class=«tabs menu»)

Второй (ul class=«child»)

Третий (ul class=«child»)

С первым и вторым получается выводить классы к ul, а в 3-м в wayfinder не получается вывести чистый ul без класса. Пожалуйста, помогите, как сделать третий ul без класса.Например, так:

<ul> <li><a href="http://demomodxrevo.ru/" title="Главная" >Главная</a></li> <li><a href="test-menu/" title="Test menu" >Test menu</a> <ul> <li><a href="test-menu/test1/" title="Тестовое меню 1" >Тестовое меню 1</a> <ul> <li><a href="test-menu/test1/testsub1.html" title="Тестовое меню суб 1" >Тестовое меню суб 1</a></li> </ul></li> </ul></li> <li><a href="test4.html" title="Тест 4" >Тест 4</a></li> </ul>

Спасибо.

modx.ru

web master | Вывод меню с помощью Wayfinder в MODx Evo

НазваниеПо умолчаниюФорматОписание

startId	текущий документ	ID документа-контейнера	Источник документов для меню
level	0	число	Количество уровней в меню
limit	0	число	Максимальное число пунктов меню
ignoreHidden	false	true \| false	Выводить документы не отмеченные для меню
includeDocs	пусто	Список ID документов	Документы обязательные для вывода
excludeDocs	пусто	Список ID документов	Исключаемые документы
ph	false	плейсхолдер \| false	Вывод результата в плейсхолдер
debug	false	true \| false	Режим отладки
hideSubMenus	false	true \| false	Скрывать подменю и выводить для активного пункта
removeNewLines	false	true \| false	Удалять символ переноса в результате
textOfLinks	menutitle	menutitle \| id \| pagetitle \| description \| parent \| alias \| longtitle \| introtext	Параметр для названия ссылки
titleOfLinks	pagetitle	menutitle \| id \| pagetitle \| description \| parent \| alias \| longtitle \| introtext	Параметр для title ссылки
rowIdPrefix	false	название префикса \| false	Добавлять префикс к id для каждой ссылки
useWeblinkUrl	false	true \| false	Вывод ссылки в плэйсхолдер [+wf.link+]
showSubDocCount	false	true \| false	Выводить количество документов в [+wf.subitemcount+]
sortOrder	ASC	ASC \| DESC	Сортировка пунктов
sortBy	menuindex	id \| menutitle \| pagetitle \| introtext \| menuindex \| pub_date \| published \| hidemenu \| parent \| isfolder \| description \| alias \| longtitle \| type \| template	Параметр используемый для сортировки
outerTpl	[+wf.wrapper+]	чанк	Шаблон контейнера меню
rowTpl	[+wf.linktext+]»[+wf.wrapper+]	чанк	Шаблон пункта меню
parentRowHereTpl	false	чанк \| false	Шаблон вывода активного документа-контейнера
parentRowTpl	false	чанк \| false	Шаблон документа контейнера
hereTpl	false	чанк \| false	Шаблон текущего пункта
innerTpl	false	чанк \| false	Шаблон для всех документов-контейнеров
innerRowTpl	false	чанк \| false	Шаблон для пункта подменю
innerHereTpl	false	чанк \| false	Шаблон текущего документа-контейнера
activeParentRowTpl	false	чанк \| false	Шаблон родителей текущего пункта меню
categoryFoldersTpl	false	чанк \| false	Шаблон вывода категории
firstClass	none	none \| CSS-класс	CSS-класс первого пункта меню
lastClass	last	last \| CSS-класс	CSS-класс последнего пункта меню
hereClass	here	here \| CSS-класс	CSS-класс текущей цепочки пунктов меню
selfClass	none	none \| CSS-класс	CSS-класс текущего пункта меню
parentClass	parent	parent \| CSS-класс	CSS-класс документов-контейнеров
rowClass	none	none \| CSS-класс	CSS-класс для всех пунктов меню
levelClass	none	none \| CSS-класс	CSS-класс для каждого уровня меню
outerClass	none	none \| CSS-класс	CSS-класс для контейнера меню
innerClass	none	none \| CSS-класс	CSS-класс для подпунктов меню
webLinkClass	none	none \| CSS-класс	CSS-класс для пунктов меню - ссылок
cssTpl	false	чанк \| false	Добавление CSS на страницу
jsTpl	false	чанк \| false	Добавление JavaSript на страницу

profwebsit.ru

Меню с многоуровневым списком с помощью wayfinder. Modx wayfinder примеры

[Evo] Документация Wayfinder параметры, документация от Василисы Белозеровой

Особенности Wayfinder

Инструкция по установке

Пример использования:

Параметры Wayfinder Modx Evo

Имена классов

(adsbygoogle = window.adsbygoogle || []).push({}); CSS и Javascript для включения в меню

Практические уроки:

Wayfinder, компонент для создания меню

Параметры

Шаблоны

Классы

Примеры

Простой вариант вызова

Дочерние документы

Соседние документы/разделы

Карта сайта

Вывод подменю не у всех разделов

| Сниппет Wayfinder | Уроки MODx Evo

Сниппет Wayfinder

Фильтрация в Wayfinder

Меню с помощью Wayfinder. Блог на MODx Revo. Часть 3.

Меню с многоуровневым списком с помощью wayfinder

web master | Вывод меню с помощью Wayfinder в MODx Evo

CSS и Javascript для включения в меню