Wayfinder для чайников- кто просвятит?

23 Posts

SergeyK Reply #21, 16 years, 4 months ago

Привет!
Поимев у себя почти такую-же менюху (см. ниже) и покопавшись-порывшись-поковырявшись с ВайФандером (ничего, что так, запанибратски) пришел к выводам:
1. ВайФандер -крут! Блин... действительно крут.
2. Опция debug=`TRUE` - тоже весьма приятна. Если чего надо посмотреть, а именно: в какие пункты чего ВайФандер вставляет и обрамляет - так эти есть наипервейшее средство. Дальнейшие разбирательства заметно упрощеваются.

Теперь по-существу. У меня меню выглядит , скажем, так:

<dl id="menu">
	<dt class="menutop"></dt>

	<table cellpadding=0 cellspacing=0 border=0><tr><td id="leftcolumncell"> 

	<dt onclick="javascript:openItem();"><a href="#">Menu 1</a></dt>
		
	<dt onclick="javascript:openItem('smenu2');"><a href="#">Menu 2</a></dt>
		<dd id="smenu2" style="display:none;">
			<ul>
				<li><a href="#">Sub Menu 2.1</a></li>
				<li><a href="#">Sub Menu 2.2</a></li>
				<li><a href="#">Sub Menu 2.3</a></li>
			</ul>
		</dd>	

	<dt onclick="javascript:openItem('smenu3');"><a href="#">Menu 3</a></dt>
		<dd id="smenu3" style="display:none;">
			<ul>
				<li><a href="#">Sub Menu 3.1</a></li>
				<li><a href="#">Sub Menu 3.2</a></li>
				<li><a href="#">Sub Menu 3.3</a></li>
				<li><a href="#">Sub Menu 3.4</a></li>
				<li><a href="#">Sub Menu 3.5</a></li>
				<li><a href="#">Sub Menu 3.6</a></li>
			</ul>
		</dd>
	</td></tr></table> 

	<dt class="menubottom"></dt>
</dl>

Решение покамест такое:
1. В шаблоне вызов ВайФандера такой (в нужном месте, ессно)

<dl id="menu">
<dt class="menutop"></dt>
<table cellpadding=0 cellspacing=0 border=0><tr><td id="leftcolumncell"> 
[[Wayfinder? &startId=`3` &level=`2` &parentRowTpl=`cssplay_revParentRow` &innerRowTpl=`cssplay_revInnerRow` &rowTpl=`cssplay_revRow` &outerTpl=`cssplay_revOuter`]]
</td></tr></table> 
<dt class="menubottom"></dt>
</dl>

На вопрос: а почему, блин, такие шаблончики прописаны в вызове? - отвечаю: Смотри п.2 в предисловии (выше, в самом начале).
На menutop и menubottom предлагаю забить и не обращать внимания. Там просто скругления углов сверху-снизу.

2. Чанки следующие:
cssplay_revInnerRow

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

cssplay_revOuter

[+wf.classes+] [+wf.wrapper+]

cssplay_revParentRow

<dt onclick="javascript:montre('smenu[+wf.docid+]');"><a href="#">[+wf.linktext+]</a></dt>
<dd id="smenu[+wf.docid+]" style="display:none;">
<ul>
[+wf.wrapper+]
</ul>
</dd>

cssplay_revRow

<dt onclick="javascript:montre();"><a href="[+wf.link+]">[+wf.linktext+]</a></dt>

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

За сим позвольте откланяться.

2 Posts

warriorbutch Reply #22, 10 years, 1 month ago

Добрый день!
Очень надеюсь, что тут мне помогут решит свою проблему.

1) Мне нужно видеть вот такой список для главного меню на сайте:

<ul>
	<li class="main"><a href="/"><h3>Главная</h3></a></li>
	<li class="results"><a href="/our_results.html"><h3>Наши результаты</h3></a></li>
	<li class="prise"><a href="/stoimost_sozdaniya_saita.html"><h3>Цены</h3></a></li>
	<li class="about"><a href="/about_us.html"><h3>О нас</h3></a></li>
</ul>

2) Создаю чанк {{menuclass}} и в него прописываю:

<li class="[+wf.classnames+][+wf.attributes+]"><a href="[+wf.link+]" title="[+wf.title+]" ><h3>[+wf.linktext+]</h3></a>[+wf.wrapper+]</li>

3) Делаю вызов

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

в нужном месте

Всё работает, кроме назначения классов.
Выводится вот такая структура:

<ul>
	<li class="active"><a href="/"><h3>Главная</h3></a></li>
	<li class=" "><a href="/our_results.html"><h3>Наши результаты</h3></a></li>
	<li class=" "><a href="/stoimost_sozdaniya_saita.html"><h3>Цены</h3></a></li>
	<li class="last"><a href="/about_us.html"><h3>О нас</h3></a></li>
</ul>

ВОПРОС: как назначить классы? У меня в MODx Evo, в редактировании "ресурсов" нет поля "Атрибуты ссылки" и я не знаю где её найти, видимо по этому классы выводятся пустыми:

<li class=" "><a...

Или может есть другой способ назначения классов не используя

[+wf.attributes+]

?

2 Posts

warriorbutch Reply #23, 10 years, 1 month ago

Всё решил, спасибо!

просто сделал вот такую конструкцию в чанке с кодом для <li>, у меня он назывался {{menuclass}}

<a href="[+wf.link+]" title="[+wf.title+]" ><li class="[+wf.classnames+] menuitem[+wf.docid+]"><h3>[+wf.linktext+]</h3>[+wf.wrapper+]</li></a>

В общем я добавил в <li class="..." плейсхолдер [+wf.classnames+] (это надо чтобы выводился автоматический класс "active") и menuitem[+wf.docid+] (таким образом у меня буду генерироваться классы menuitem1, menuitem2, menuitem3 .... menuitem(ID).

Осталось только поменять в файле CSS старые названия классов на новые menuitem1, menuitem2, menuitem3 .... menuitem(ID) и всё! [ed. note: warriorbutch last edited this post 10 years, 1 month ago.]