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



Реализуем навигационное меню MODx Revo с помощью сниппета Wayfinder.

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

Сниппет Wayfinder.

Ранее я рассказывал, о том как реализовать меню с помощью сниппета Wayfinder для редакции MODx Evo, сегодня речь пойдет о редакции Revo.

Сниппет Wayfinder выводит список ссылок на ресурсы, соответствующий указанным вами параметрам вызова.

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

Основные параметры сниппета Wayfinder.

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

Шаблоны Wayfinder.

Ниже показан список допустимых шаблонов:

Классы Wayfinder.

Реализуем навигационное меню для MODx Revo с помощью сниппета Wayfinder.

Рассмотрим на примере, как реализовать меню.

На моем одном сайте навигационное меню представляет из себя следующую конструкцию:

меню для MODx Revo с помощью сниппета Wayfinder

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

Как мы видим по верстке моего макета, контейнер списков меню имеет класс «nav navbar-nav». Первый элемент меню задается классом «first», последнему присвоен класс «last». Пункту меню с подпунктами присвоен класс «dropdown». Контейнеру вложенного меню присвоен класс «dropdown-menu». Вложенность меню ровна 2.

Подобная конструкция с легкостью описывается вызов сниппета Wayfinder со следующими параметрами:

[ [Wayfinder? &startId=`0` &outerClass=`nav navbar-nav` &level=`2` &innerClass=`dropdown-menu` &parentClass=`dropdown`]]

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


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


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


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

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



Будь в курсе!

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

Digital Newsletter

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