Многоуровневое меню с разными стилями

Доброго времени суток!
А можно ли с помощью pdoMenu сгенерировать так,
как на этой верстке (Мебель (верхний уровень) — > Миссия (выпадающее) -> ...)
Короче, в данном случае, трехуровневое меню, где на каждый уровень свой CSS?

С уважением.

Андрей Иванов

01 апреля 2015, 11:54

3 108

-1

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

Ганин Роман

01 апреля 2015, 14:57

Конечно. Задаете требуемый уровень вложенности и указываете соответствующие классы для контейнеров/неконтейнеров.

Андрей Иванов

01 апреля 2015, 15:27

Там все — контейнеры.
Вот html этого «отрезка»:

<ul id="ddmenu">
  <li><a href="#">МЕБЕЛЬ</a>
    <ul class="l_1">
      <li>
        <a href="#"><span></span>   Миссия</a>
	  <ul class="l_2">
	       . . .
	  </ul>
        </li>
     </ul>
  </li>	 				
</ul>

С первым и вторым уровнями все понятно, это

&tplOuter=`nav_main_tpl_outer`
&tplInner=`nav_main_tpl_inner`
&tplInnerRow=`nav_main_tpl_inner_row`

Вы бы не могли подсказать, как, к примеру, указать класс для ul третьего уровня, речь о классе "l_2"?

Руслан Кундиус

01 апреля 2015, 15:33

Дочерний селектор не поможет?

Андрей Иванов

01 апреля 2015, 15:37

А это ход! Большое спасибо всем!

Ганин Роман

01 апреля 2015, 15:36

Это решается или через уровень вложенности на css, как написал Руслан, или через атрибуты ссылки.

Андрей Иванов

01 апреля 2015, 15:37

Допёр :-) Большое спасибо!

Виктор

01 апреля 2015, 15:47

А еще через &levelClass

Андрей Иванов

01 апреля 2015, 18:32

Большое спасибо! А как? Я читал про этот параметр в документации, но не понял, как это сделать.

Руслан Кундиус

01 апреля 2015, 18:49

Укажи и посмотри что получится)

Виктор

01 апреля 2015, 21:29

Вообще да, если не понятен параметр нужно его опробовать, иногда даже с логированием.

А так, вот пример небольшой:

[[pdoMenu? &levelClass=`level`]]

<ul class="">
  <li class="first level1"><a href="index.php?id=2">1</a>
    <ul class="">
      <li class="first level2"><a href="index.php?id=3">1.1</a></li>
      <li class="last level2"><a href="index.php?id=4">1.2</a></li>
    </ul>
  </li>
</ul>