Многоуровневое меню с использованием GetResources

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

<ul>
	<li><a class="level1" href="/[[~[[+id]]]]">[[+pagetitle]]</a>
		<ul>		
			<li><a class="level2" href="/[[~[[+id]]]]">[[+pagetitle]]</a>
				<ul>
					<li><a href="/[[~[[+id]]]]">[[+pagetitle]]</a></li>
				</ul>
			</li>
		</ul>
	</li>
</ul>

т.е.

Категория 1
- Подкатегория 1.1
-- Подподкатегория 1.1.1
-- Подподкатегория 1.1.2
-- Подподкатегория 1.1.3
- Подкатегория 1.2
-- Подподкатегория 1.2.1
-- Подподкатегория 1.2.2
-- Подподкатегория 1.2.3
.
Категория n
- Подкатегория n.1
-- Подподкатегория n.1.1
-- Подподкатегория n.1.2
и т.д.

Но что-то у меня ничего не выходит…
Подскажите, пожалуйста, как это возможно реализовать (именно с использованием GetResources)? Или я велосипед изобретаю, и нужно просто другой сниппет использовать?
Заранее большое спасибо всем откликнувшимся!

Сергей

27 июня 2015, 06:23

3 964

Комментарии: 29

Василий Наумкин

27 июня 2015, 09:54

Да, ты изобретаешь велосипед.

Нужно использовать pdoMenu или Wayfinder.

Сергей

27 июня 2015, 09:58

Василий, подключил pdoMenu — действительно все работает, все просто, спасибо!
Единственное, теперь встал вопрос, как сделать так, чтобы классы уровней меню учитывались (level1, level2)?

Василий Наумкин

27 июня 2015, 10:00

pdoMenu по умолчанию и так генерирует разметку с class=«levelN» — тебе нужно только написать соответствующие стили CSS.

Сергей

27 июня 2015, 10:33

Видимо что-то некорректно делаю, так стили не цепляются, и еще у меня при переходе по ссылкам URL почему-то «складывается» с предыдущим, что приводит к 404…

Павел Ширяев

27 июня 2015, 18:34

нужно в заголовке прописать base href. Это чтобы адреса меню «не склеивались».
чтобы в уровнях появлялись классы, нужно к li соотвествующего уровня добавлять плейсхолдер classes:

<li [[+classes]]>...</li>

Сергей

27 июня 2015, 19:14

Павел, спасибо за ответ!
А могу попросить кусок кода-пример, а то, признаться, не совсем понимаю, что в данном случае подразумевается «в заголовке прописать base href», ну и с classes — вроде так и делаю.
В общем буду очень признателен за пример!
Спасибо!

Сергей

27 июня 2015, 11:16

В общем прописал pdoMenu — ниже — на первый взгляд показалось, что все ок — меню сформировалось, НО!
1. Прописанные в css .level1, level2 не цепляются
2. URL как-то странно формируется — первый переход осуществляется нормально, а далее,- как-будто к URL текущей страницы приклеивается URL той, куда перехожу.
Где косяк? Кто-нибудь сталкивался с таким?
Заранее спасибо!

[[pdoMenu?
    &parents=`2`
    &level=`3`
    &&levelClass=`level`
]]

Alexander V

27 июня 2015, 19:35

<head>
    .......
    <base href="[[++site_url]]">
</head>

Сергей

27 июня 2015, 19:43

Александр, спасибо!!!

Сергей

27 июня 2015, 20:16

Путем проб и ошибок почти получилось!

[[pdoMenu? 
&parents=`2`
&level=`3`
&levelClass=`level`
&tplParentRow=`@INLINE 
<li><a href="[[+link]]" class="[[+classnames]]" title="[[+pagetitle]]" [[+attributes]]>[[+menutitle]]</a>
[[+wrapper]]`
]]

НО! Пока почему-то title выводится только у ссылок первого и второго уровня и только у ссылок первой категории, а также к категории 2 не цепляется стиль. Выглядит след. образом:

Категория 1 (есть title, цепляется css)
- Подкатегория 1.1 (есть title, цепляется css)
-- Подподкатегория 1.1.1 (нет title)
Категория 2 (нет title, не цепляется css)

Что не так?
Спасибо!

Alexander V

27 июня 2015, 20:21

Продолжайте! У вас всё получится)
docs.modx.pro/components/pdotools/snippets/pdomenu

Сергей

27 июня 2015, 21:12

Александр, изучил вдоль и поперек!
[[+attributes]] — не нашел описание — подскажите, для чего это?
Спасибо!

Alexander V

27 июня 2015, 21:21

На странице ресурса есть поле атрибуты ссылки. Можно указать например

target="_blank"

Максим Кузнецов

27 июня 2015, 21:26

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

Сергей

27 июня 2015, 21:11

В общем нужно было не &tplParentRow а просто &tpl использовать.)
Все заработало — финальная вставка:

[[pdoMenu? 
&parents=`2`
&level=`3`
&levelClass=`level`
&tpl=`@INLINE <li><a href="[[+link]]" class="[[+classnames]]" title="[[+pagetitle]]" [[+attributes]]>[[+menutitle]]</a>[[+wrapper]]</li>`
]]

Сергей

27 июня 2015, 21:46

Ха! Не все так просто оказалось! Залез, посмотрел код, а там каша!
Т.е. код выше дает желаемую картинку, но в код добавляет кучу мусора…
Продолжаю «оптимизировать».

Alexei

27 июня 2015, 22:25

как можно оптимизировать то, в чем абсолютно в чем не разбираешься?

Сергей

27 июня 2015, 22:27

Я же слово «оптимизировать» в кавычки взял!)
Алексей, может быть поможете разобраться?

Alexei

27 июня 2015, 22:36

нет ))

Сергей

27 июня 2015, 23:02

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

[[pdoMenu? 
&parents=`2`
&levelClass=`level`
&outerClass=`left_menu`
&firstClass=`0`
&lastClass=`0`
&hereClass=`0`
&tplInner=`@INLINE [[+wrapper]]`
&tplParentRow=`@INLINE <li class="[[+classnames]]"><a href="[[+link]]" title="[[+pagetitle]]">[[+menutitle]]</a>[[+wrapper]]</li>`	
]]

При такой вставке формируется след. код:

<ul class="left_menu">
	<li class="level1"><a href="ссылка" title="тайтл_ссылки">Категория 1</a>
		<li class="level2"><a href="сылка" title="тайтл_ссылки">Подкатегория 1.1</a>
			<li class="level3"><a href="сылка" >Подкатегория 1.1.1</a></li>
		</li>
	</li>
	<li class="level1"><a href="ссылка" >Категория 2</a></li>
</ul>

Но никак не могу догнать, как сделать так, чтобы title также наследовался в li третьего уровня и ниже.
Кто подскажет?
Спасибо!

Alexander V

27 июня 2015, 23:39

У вас level2 и level3 не завернут. Или так должно быть?

Сергей

28 июня 2015, 00:04

Александр, «не завернут» — имеете ввиду [[+wrapper]] где-то не хватает?
(предполагал, &tplInner=`@INLINE [[+wrapper]]` распространяется на все конструкции

<li></li>

внутри

<ul></ul>

...)
Можете в виде кода прислать, что имеете ввиду?
Спасибо!

Alexander V

28 июня 2015, 00:46

[[+wrapper]] это содержимое &tplParentRow соотетственно, должно быть

&tplInner=`@INLINE <ul> [[+wrapper]] </ul>`

Сергей

28 июня 2015, 01:10

Понял, спасибо!
Но в моем случае роли это не играет, проблему с НЕнаследованием title по-прежнему не удается решить.

Alexander V

28 июня 2015, 01:30

у меня работает
test.startboxcms.ru/

Сергей

28 июня 2015, 01:52

Хм… очень странно…
А вставку [[pdoMenu?]] можете также прислать?

Alexander V

28 июня 2015, 01:56

[[!pdoMenu? 
  &parents=`0`
  &tplOuter=`@INLINE <ul[[+classes]]>[[+wrapper]]</ul>`
  &tpl=`@INLINE <li[[+classes]]><a href="[[+link]]" title="[[+pagetitle]]" [[+attributes]]>[[+menutitle]]</a>[[+wrapper]]</li>` 
  ]]

Сергей

28 июня 2015, 02:14

Вот спасибо! Теперь и у меня заработало.

Причина — я использовал:
&tplInner
&tplParentRow
а у вас:
&tplOuter
&tpl
Видимо нужно мне лучше разобраться с параметрами шаблонов.

Сергей

28 июня 2015, 02:49

В общем получилось так:

<ul class="left_menu">
		[[!pdoMenu? 
		&parents=`2`
		&levelClass=`level`
		&firstClass=`0`
		&lastClass=`0`
		&hereClass=`0`
		&tplOuter=`@INLINE [[+wrapper]]`
		&tpl=`@INLINE <li class="[[+classnames]]"><a href="[[+link]]" title="[[+longtitle]]" [[+attributes]]>[[+menutitle]]</a>[[+wrapper]]</li>`
		]]
</ul>

Отдельное спасибо Alexander V за помощь!

Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.

Многоуровневое меню с использованием GetResources

Комментарии: 29

Здесь упомянуты