show_menu2: valid XHTML and CSS selectable menus

[brofield]

Hi,

See http://code.jellycan.com/show_menu2/ for details and updates

show_menu2 is a code snippet that provides a complete replacement for show_menu.

Features
Speed
It should be faster than the existing function as it hits the database exactly once per page load. The builtin function hits the database multiple times per function call. This is at the expense of more memory as all page information is stored locally. Realistically, the memory load is not large.

Flexibility
It can generate menus in many different ways. Covering all of the existing menu's abilities (as far as I know) and adding a few more of it's own.

Valid XHTML
The HTML generated by this function is valid XHTML.

Easy CSS styling
It generates a menu with lots of classes on each element to allow easy styling of the menu via CSS. This should allow the generated menus to be used in pretty much any way, e.g. popups, dropdowns, etc. See websites about CSS menus.

Lists, Tables, Spans, or more
Like the existing function, you can use whatever HTML tag you want to delimit the menu and menu items. UL, OL, DIV, SPAN, TR, etc. Use your imagination.

Menus or Breadcrumbs
All types of menus can be generated as well as breadcrumbs.

Demo
A demo website showing many of the different types of menus that can be created using this function is at http://code.jellycan.com/sm2test/

Documentation
See the website mentioned above for documentation.

Disadvantages
No major disadvantages to using this menu function that I can see, although suggestions are welcome. Minor ones that I can think of are:

Call Signature
It doesn't use the same call signature as show_menu (although it can if you want, just uncomment the include legacy.php line in the include.php file).

Multiple Class Names
IE for Mac has a number of bugs relating to multiple class names on a tag. Major browsers that people actually use will handle it fine though.

[Stefan]

Sounds perfect! Good stuff!

[brofield]

Update to version 1.2 to fix a couple of minor bugs, upate the documentation and add a couple of extra features. Feature complete now I believe. See the original post for updated documentation and zip file.

[Hans]

Looks good.. but how to implement this?
To be honest, the whole snippet concept isn't clear to me. Maybe an explanation about this menu feature can also help in implementing other snippets as wll.

Thanks, Hans

[Stefan]

@brofield:
On your test installation, I don't find any difference between the first (full tree) and the trimmed menu. I expected the trimmed tree to look like the regular menu (for example in the stock round template).

[brofield]

• Download the "show_menu2.zip" file attached to the original message
• Log into the WB admin interface
• Select "Add-Ons", then "Modules"
• If you already have a version installed, select "show_menu2" from "Uninstall Module" list and click "Uninstall"
• Under "Install Module", click browse and select the zip file you downloaded, then click "Install"
• Start using the show_menu2() function in your template files

[brofield]

Yeah. I'm in the middle of testing a new version. The test site is off-limits for the moment as the results will not be what you expect.

[brofield]

Updated to version 1.4. Details in the main post. Updated zip file in the main post. test site available once again. I'm spent.

[PeterM]

This is really cool stuff, nice work 

[ruebenwurzel]

wooooooow     

[PeterM]

Updated to version 1.4. Details in the main post. Updated zip file in the main post. test site available once again. I'm spent.

1.5?

[brofield]

Updated to version 1.6. Details in the main post. Updated zip file in the main post. Test site available once again. Fixes a couple of minor bugs I found in a code review.

[virgil]

Hi everybody

yes, I know, sometimes I am really hard in understanding things  ... this IS one those miserable moments 

To deduce from reactions, show-menu2 must be really great... the problem is: I do not really get the difference and
the improvement in comparison to the original function, but I would like to understand because I always try to
inprove my installation, where useful.

Could somebody (in short sentences, witn no more than two syllable long words  ) explain it to me?

Thank you.

Cheers
Virgil

P.S.: Eventually German explanation is welcome 
        (but not a must)

[brofield]

In summary, if you don't know that you need it, then it doesn't matter one way or the other. On the other hand, there is no problem to use it instead of the builtin. The new one has the following advantages.

Speed
It should be faster as it hits the database only once per page load. The builtin function hits the database multiple times per function call. This is at the expense of more memory as all page information is stored locally. Realistically, the memory load isn't large.

Flexibility
It can generate menus in many different ways. Covering all of the existing menu's abilities (as far as I know) and adding a few more of it's own.

Valid XHTML
The existing menu function generates HTML that doesn't validate. Minor concern really, but many people like to have valid HTML.

Easy CSS styling
It generates a menu with lots of classes on each element to allow easy styling of the menu via CSS. This should allow the generated menus to be used in pretty much any way, e.g. popups, dropdowns, etc. See websites about CSS menus.

[brofield]

Updated to version 2.0. See the head post for details. This is the final update that I expect to do, aside from bug fixes.

Changes in this version are:
* optionally specify what HTML tags to use when generating the menu. Default is ul/li, but any other combination is possible, such as ol/li, tr/td, etc.
* optionally specify an ID for the top level menu tag
* demo site updated showing off these features

[Stefan]

Valid XHTML
The existing menu function generates HTML that doesn't validate. Minor concern really, but many people like to have valid HTML.

The core function show_menu should generate valid html too... Or do you have problems with it?

[brofield]

A friend had led me to think that it was generating invalid HTML. Something like:

<ul>
   <li>item</li>
   <li>item
       <li>
           <ul>
               <li current>item<li></li></li>
               <li>item</li>
           </ul>
       </li>
   </li>
   <li>item</li>
</ul>

It must have been a communication breakdown. I'll fix the comment in the main entry.

[ruebenwurzel]

@brofield

i like your new menu function i only had problems with hidden pages.

Had a main Page wich has visibility public and two subpages under this with visibility hidden. If i click on the public page link got the following error:

Code: [Select]

Warning: array_keys(): The first argument should be an array in .....\modules\show_menu2\include.php on line 247

And a question to the parameters. I Have two menus. One horizontal wich only plays the root level and a vertical submenu wich only should display the subnavigation.

Menustructure:
Page
  Subpage1
     Subpage 1.1
     Subpage 1.2

Function call:
<?php show_menu2(1, -1); ?>

Result:
when you on Main Page it shows in the submenu Subpage1 what is ok
when you on Subpage1 it shows in the submenu Subpage1, Subpage 1.1 and Subpage 1.2 what i dont like.

I'm looking for the parameter wich shows me on the Subpage1 in the submenu only the Subpage 1.1 and Subpage 1.2.

Could you pleas give me a hint how to get this?

Thanks

Matthias

[brofield]

Had a main Page wich has visibility public and two subpages under this with visibility hidden. If i click on the public page link got the following error:

Code: [Select]

Warning: array_keys(): The first argument should be an array in .....\modules\show_menu2\include.php on line 247


I don't see this error. The page http://riseup.co.nz/pages/parent.php has 3 children, 2 are hidden and 1 is private. It works fine for me there. I'm not sure how to help you without being able to reproduce the error.

I Have two menus. One horizontal wich only plays the root level and a vertical submenu wich only should display the subnavigation.

<snip>

when you on Main Page it shows in the submenu Subpage1 what is ok
when you on Subpage1 it shows in the submenu Subpage1, Subpage 1.1 and Subpage 1.2 what i dont like.

I'm looking for the parameter wich shows me on the Subpage1 in the submenu only the Subpage 1.1 and Subpage 1.2.

Could you pleas give me a hint how to get this?

Using page http://riseup.co.nz/pages/foo.php
See the example "Root Level Only" to display only the root level.
See the example "First Level" to display only the children.
I think this is what you are after, otherwise you might want "Current Children" or "Current Kids (1 level)".

Regards,
Brodie

[brofield]

Updated to version 2.1
* remove all warnings and notices when running PHP at error_reporting = E_ALL
* no other changes at all, no need to upgrade if the warnings don't affect you

[ruebenwurzel]

Hello,

Thanks for the fast response. Have testet "Current Children" and "Current Kids (1 level)" but got not the result i want. So my solution now is the following. Have three templates with three different parameter for the submenu:

• First Template: for pages with no subpages there is no call for submenu and the content uses the whole width.
• Second Template: for pages with subpages(first level) i use "<?php show_menu2(1, -1, -1); ?>" wich shows only the first level
• Third Template: for pages with subsubpages(second level) i use "<?php show_menu2(1, -2, -1); ?>" wich shows only the second level

Look here: http://www.seefest-freudenberg.de. Menu is only css based.

Thanks for the great work

Matthias

[brofield]

Upgraded to version 2.2
* fully compatible with version 2.1 call signature
* can specify multiple tags to be output for menu and items
* can generate breadcrumbs

[brofield]

Update to version 2.5

* fixes bug with generation of crumbs.
    see "Breadcrumbs" at http://riseup.co.nz/pages/foo/fig/snot.php

* added ability set max levels. i.e. max of 2 levels, but never more than the current level
    see "Max 2 Levels" for demo of new SM2_MAX feature
    http://riseup.co.nz/pages/foo.php  (only 1 level displayed as foo is current level)
    http://riseup.co.nz/pages/foo/fig/snot.php  (only 2 levels displayed, as max is 2)

* changed the function parameters to make it a bit easier to understand
    (existing pages will have to change to match it. changes are in $aStart, $aMaxLevel and $aTrimTree only)

[rabsaul]

Is there a way I can work with this code snippet to provide an "on state" for links I'm "hard-coding" into the template?

I have the regular full WB nav as a vertical bar on the right hand side of my pages. However, there are a handful of basic pages that I want permanent links to in a top horizontal nav bar which I have hard-coded in. The problem is that I don't know how to show an "on state" for dynamically-generated pages.

The site is here: http://www.ccpclex.org

If this snippet won't work for that, any other ideas would be most welcome.

Thanks!

[ruebenwurzel]

Hello,

this snippet seems what you need. Looked at the link you posted above. You have a horizontal menu wich should only show the root level. This you got in your template with <?php show_menu2(1, SM2_ROOT, SM2_START); ?>. And the menu on your right side wich shows all pages you got with <?php show_menu2(); ?>.

The Layout you define in the screen.css. Your existing one should work without changes. (not shure, done only a short look on it)

Matthias