librelist archives

« back to archive

display_menu nesting

display_menu nesting

From:
Marc Wickenden
Date:
2013-11-13 @ 14:55
Forwarded to list as requested by Graham.

-------- Original Message --------
Subject: 	Re: [LRUG] [COURSE] Security Workshop in January
Date: 	Wed, 13 Nov 2013 13:05:05 +0000
From: 	Marc Wickenden <marc@4armed.com>
To: 	graham@effectif.com



On 13/11/2013 12:14, Graham Ashton wrote:
> Excellent! :-) It’s always good to hear when people are finding it useful. 
So far so good. A few little head scratchers but I'm sticking with it.
Thought I should take this off list, hope that's OK but I'd appreciate a
little help if you can spare two minutes.

Using display_menu I want to create a dropdown from a 2 level menu.txt.
Unfortunately it seems the unordered list for the second level of the
menu is created under a new <li> rather than the "top level" <li>. If
that makes sense?? This means it's not quite as simple using a CSS hover
to display the second level menu. I can just about make it work with
some hacky adjacent sibling selectors and minus positioning but it'd be
a lot easier if the <ul> was under the <li>.

Example:

menu.txt:

services
  services/something-amazing
  services/something-even-better

display_menu(@menu_items, :class => 'menu', :levels => 2) gives:

<ul class='menu'>
  <li>
    <a href='http://localhost:9393/services'>Services</a>
  </li>
  <li> <-- new <li> element created here
    <ul>
      <li>
        <a
href='http://localhost:9393/services/something-amazing'>Something
amazing</a>
      </li>
      <li>
        <a
href='http://localhost:9393/services/something-even-better'>Something
even better</a>
      </li>
    </ul>
  </li>
</ul>

Whereas what I'd like is:

<ul class='menu'>
  <li>
    <a href='http://localhost:9393/services'>Services</a>
    <ul>  <-- this is the bit which is different. <ul> nested in top
level <li>
      <li>
        <a
href='http://localhost:9393/services/something-amazing'>Something
amazing</a>
      </li>
      <li>
        <a
href='http://localhost:9393/services/something-even-better'>Something
even better</a>
      </li>
    </ul>
  </li>
</ul>

The idea being when you hover over Services you get the subnav
underneath it.

I'm either missing something obvious, there's an easy way to achieve
what I'm looking for without too much hassle or I'm going to need to
find another way. Any thoughts? I was going to code up the menu manually
and render each link after first checking it against request.path in
order to set the "current" class. Is that necessary?

>
> I’ve been working towards a new release recently; pending a bit more 
testing in real sites the current HEAD of master on GitHub will be 
released as 0.10.0.
Cool, look forward to that.

Marc


Re: [nesta] display_menu nesting

From:
Graham Ashton
Date:
2013-11-13 @ 15:18
I know there are a few people out there using display_menu - I’d be 
interested to know what you think to Marc’s suggested change to the HTML.

It looks like a good idea to me...

I’m considering changing it for 0.10.0.

On 13 Nov 2013, at 14:55, Marc Wickenden <marc@4armed.com> wrote:

> 
> Forwarded to list as requested by Graham.
> 
> -------- Original Message --------
> Subject: 	Re: [LRUG] [COURSE] Security Workshop in January
> Date: 	Wed, 13 Nov 2013 13:05:05 +0000
> From: 	Marc Wickenden <marc@4armed.com>
> To: 	graham@effectif.com
> 
> 
> 
> On 13/11/2013 12:14, Graham Ashton wrote:
>> Excellent! :-) It’s always good to hear when people are finding it useful. 
> So far so good. A few little head scratchers but I'm sticking with it.
> Thought I should take this off list, hope that's OK but I'd appreciate a
> little help if you can spare two minutes.
> 
> Using display_menu I want to create a dropdown from a 2 level menu.txt.
> Unfortunately it seems the unordered list for the second level of the
> menu is created under a new <li> rather than the "top level" <li>. If
> that makes sense?? This means it's not quite as simple using a CSS hover
> to display the second level menu. I can just about make it work with
> some hacky adjacent sibling selectors and minus positioning but it'd be
> a lot easier if the <ul> was under the <li>.
> 
> Example:
> 
> menu.txt:
> 
> services
>  services/something-amazing
>  services/something-even-better
> 
> display_menu(@menu_items, :class => 'menu', :levels => 2) gives:
> 
> <ul class='menu'>
>  <li>
>    <a href='http://localhost:9393/services'>Services</a>
>  </li>
>  <li> <-- new <li> element created here
>    <ul>
>      <li>
>        <a
> href='http://localhost:9393/services/something-amazing'>Something
> amazing</a>
>      </li>
>      <li>
>        <a
> href='http://localhost:9393/services/something-even-better'>Something
> even better</a>
>      </li>
>    </ul>
>  </li>
> </ul>
> 
> Whereas what I'd like is:
> 
> <ul class='menu'>
>  <li>
>    <a href='http://localhost:9393/services'>Services</a>
>    <ul>  <-- this is the bit which is different. <ul> nested in top
> level <li>
>      <li>
>        <a
> href='http://localhost:9393/services/something-amazing'>Something
> amazing</a>
>      </li>
>      <li>
>        <a
> href='http://localhost:9393/services/something-even-better'>Something
> even better</a>
>      </li>
>    </ul>
>  </li>
> </ul>
> 
> The idea being when you hover over Services you get the subnav
> underneath it.
> 
> I'm either missing something obvious, there's an easy way to achieve
> what I'm looking for without too much hassle or I'm going to need to
> find another way. Any thoughts? I was going to code up the menu manually
> and render each link after first checking it against request.path in
> order to set the "current" class. Is that necessary?
> 
>> 
>> I’ve been working towards a new release recently; pending a bit more 
testing in real sites the current HEAD of master on GitHub will be 
released as 0.10.0.
> Cool, look forward to that.
> 
> Marc
> 
> 
>