How to create an expandable menu

How to work with templates and style sheets

How to create an expandable menu

Postby JTO » Sun Jul 05, 2009 11:57 am

Hello guys, I'm trying typolight and it seems an excellent cms so far

I created a custom navigation menu that I show in a sidebar
This menu should have multiple levels, with sublevels shown only after clicking on the top level (and loading the related page).
I make an example, it's easier than it sounds:

Standard menu, when nothing have been clicked yet:
- Holidays
- Areas
- Shopping
- Nature

When someone clicks on Shopping (or any other item) the related page is shown and the menu is shown as this:
- Holidays
- Areas
- Shopping
---- Food
---- Sports
---- Hi Tech
---- Automotive
- Nature

normally I'd code the website to show a nested <ul> inside a <li> when the user enters the shopping menu item, but if I include Food, Sports Hi Tech in the Custom Navigation page selection all of them are displayed at the same level.

Maybe I'm using a wrong approach...any suggestion?
JTO
User
 
Posts: 27
Joined: Sun Jul 05, 2009 11:43 am

Re: How to create an expandable menu

Postby JTO » Sun Jul 05, 2009 12:14 pm

to clarify I need to do exactly what they di on http://www.pictorama.de/ (made with typolight)

if you click virtuelle Rundgänge in the left menu some submenu elements are shown

this is exactly what I need
JTO
User
 
Posts: 27
Joined: Sun Jul 05, 2009 11:43 am

Re: How to create an expandable menu

Postby FloB » Sun Jul 05, 2009 1:32 pm

Use navigation stop level without Hard Limit. This should work.
FloB
User
 
Posts: 126
Joined: Sun Jun 21, 2009 9:49 pm

Re: How to create an expandable menu

Postby JTO » Sun Jul 05, 2009 2:21 pm

I tried your solution but all I get is another menu like the main menu

the items that I want to show in this menu are not those in the main menu
see the screenshot of the admin panel: the items in the green box are those that should be sown in this menu

Image

for these items I checked "hide from navigation menu" and created a custom navigation menu element, but I suppose it's not the way to go...
other items below the box are shown in the main menu

maybe I need to completely reorganize the tree? or what?
JTO
User
 
Posts: 27
Joined: Sun Jul 05, 2009 11:43 am

Re: How to create an expandable menu

Postby JTO » Sun Jul 05, 2009 4:44 pm

ok I've solved this

I've changed the items that should appear in this menu to be the ones pulled by the main menu and set the Stop level to 1

this actually generates the tree I needed when clicked
Code: Select all
<ul>
<li></li>
<li>
  <ul>
  <li></li>
  <li></li>
  <li></li>
  </ul>
</li>
<li></li>
</ul>


now my question is, if I want another menu block like this, how can I create it?
JTO
User
 
Posts: 27
Joined: Sun Jul 05, 2009 11:43 am

Re: How to create an expandable menu

Postby FloB » Sun Jul 05, 2009 5:18 pm

Rearrange your menu to have the ones you want to have grouped as subsites to one "root" (actually a regular site or a redirection site, or as well a page root). In the navigation module you can select a starting / reference point where the navigation "starts".
FloB
User
 
Posts: 126
Joined: Sun Jun 21, 2009 9:49 pm

Re: How to create an expandable menu

Postby JTO » Sun Jul 05, 2009 5:48 pm

cool, this is done via the reference page function
I supposed it represented some kind of linked content

this makes things a lot easier

thank you guys ;)
JTO
User
 
Posts: 27
Joined: Sun Jul 05, 2009 11:43 am

Re: How to create an expandable menu

Postby Vascom » Tue Jul 14, 2009 3:33 pm

Hi guys,

I want to do the same, but I've got a problem. My subitems are always visible and not expandable!
I use TYPOlight version 2.6.0. What am I doing wrong or do I forgot something?
User avatar
Vascom
User
 
Posts: 17
Joined: Mon Jun 22, 2009 9:43 am
Location: Leersum, The Netherlands

Re: How to create an expandable menu

Postby MacKP » Tue Jul 14, 2009 8:56 pm

Hi Vascom,
try to set the stoplevel =1

Hope there is something like that in youre Module... TL 2.6 is far away ;-)

regards
-{42}-
For real-time chat the (inofficial) Chatroom in IRC:
-> irc.freenode.net #typolight.de
User avatar
MacKP
User
 
Posts: 38
Joined: Fri Jun 19, 2009 7:35 pm
Location: Duisburg (Germany)

Re: How to create an expandable menu

Postby Vascom » Tue Jul 14, 2009 9:32 pm

Hi MacKP,

Thanks! I was trying to receive this goal with the subnavigation module :? I now setup a main navigation module with stoplevel = 1 and it's working! :D
User avatar
Vascom
User
 
Posts: 17
Joined: Mon Jun 22, 2009 9:43 am
Location: Leersum, The Netherlands

Next

Return to Templates and CSS

Who is online

Users browsing this forum: No registered users