Help with dropdown menu in wayfinder

Quote from: jerontopaz at Dec 02, 2015, 03:37 AM

Quote from: sottwell at Dec 02, 2015, 01:01 AM

Where is this data coming from? What kind of listing snippet are you using to display it?

Basically, what you have is two parts: the outer part, the UL tags:

<ul class="list-unstyled timeTableFilters">
???
</ul>

This may be a chunk tpl, in the case of Wayfinder, which concerns itself with the outer containing element, or simply entered in the template itself, in the case of getResources which only concerns itself with the actual listed items, not their outer containing element.

And the inner LI parts, which have variable attributes and content:

<li data-filter="[[+variable]]">[[+text]]</li>

The "variable" bit can come from a TV, or if the data is taken from resources, even the alias of the resource ([[+tv.data-filter]] or [[+alias]]). And the "text" bit can likewise come from any field, such as [[+menutitle]].

i dont understand this .. please .. abit confused link to site : http://demos.kodedlabs.co/modx//index.php?id=11

pleaseeeeeeeeeeeeeeeeeeeeeeeeeeeee help

If you mean the whole page, that's not something I can quickly give you advice or help for. I would charge $250 for a page like that.

I have no idea how the tabs trigger the content. AJAX? Simple tabs that show/hide their content? Where does the content come from? Resources? A calendar app? Porting something like that into a MODX feature isn't a simple task.

Hi,

Will not any child of God help me with this problem? I can not make the correct marking of this menu. It can be pdomenu or wayfinder. I want the mega-menu and the mutablevel working.


The code:

<nav>
<ul>
<li class="active">
<a href="#">Home</a>
</li>
<li>
<a href="#">Pages</a>
<ul class="mega-menu-area">
<li>
<a href="about1.html">About 1</a>
</li>
<li>
<a href="lecturers1.html">lecturers 1</a>
</li>
</ul>
</li>
<li>
<a href="#">Courses</a>
<ul>
<li>
<a href="courses1.html">Courses 1</a>
</li>
</ul>
</li>
<li>
<a href="#">Research</a>
</li>
<li>
<a href="#">News</a>
<ul>
<li class="has-child-menu">
<a href="#">News</a>
<ul class="thired-level">
<li>
<a href="news1.html">News 1</a>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a href="#">Gallery</a>
</li>
<li>
<a href="#">Contact</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</div>