show_menu2: valid XHTML and CSS selectable menus

[bupaje]

font-weight is inherited by the child menus. Try
.menu-expand > a { font-weight: bold; }
This will only modify the <a> links directly underneath a .menu-expand classed tag and no children.

For some reason I couldn't get that to work -not sure if there was a typo? Don't know enough about css but I did get this to sort of work like this though when I get down 3 levels deep I note that bold is back ...

Code:

.menu-child{
background-color: #F3F3F3;
border : 1px solid #EEEEEE;
                font-weight: normal;
}

.menu-current{
background-color: #DDDDDD;
border : 1px solid #16B144;
}


.menu-expand {
               font-weight: bold;
}

Thanks again for this excellent mod.

[Tim]

I managed to get it working Brofield, thanks again.

[phil]

your menu function looks quite impressive: I'm trying to have a menu like this, where all the

home | study | about
is there a way to get this?
I only get it to look like home | study | about |

obviously, the red vertical bar at the end is ugly. Does anybody have a solution for this?

Thanks a lot

[baelinc]

I am using this menu function, and i really like it. The only problem that i am having, is how to tell this code to be a horizontal menu instead of a vertical one. Here is the code that i am using, please edit it so that it shows as a horizontal menu....

Code:

<?php show_menu2(0, SM2_ROOT+1, SM2_START) ?>

Thanks,
Johnathan

[ruebenwurzel]

Hello,

how a menu is shown (horizontal, vertical) is css based. Look here.

http://css.maxdesign.com.au/listamatic/

Matthias

[bupaje]

Want to use this for a sitemap and having a little problem getting it to show [page_title] instead of [menu_title]

Here is what I tried

show_menu2(0, SM2_CURR+1, SM2_CURR+1,'[a][page_title][/a]');

but it shows the [menu_title]

http://stormvisions.com/pages/art-design.php

[brofield]

Documentation is at:
http://forum.websitebaker.org/index.php/topic,2584.0.html

Use [page] instead.

Cheers,
Brodie

[bupaje]

Thanks. Looks like I was looking at an older doc. I did change it to [page] but it still shows the menu title. 

I did have a suggestion for the future as well. Maybe you can add a feature to optional show the meta description/keywords as well. This can be useful in the sitemap for example where I can show the title and short description of each page. For example


Sitemap

Graphics
- Photoshop
  - Plugins - Add features to your program with these free plugins. [keywords: art, design]

[bupaje]

@brofield

I spotted this error in my scripts.log file. Not sure if it is important.

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

[brofield]

I have released a beta of v3.0 at http://code.jellycan.com/show_menu2/

This version has a call signature similar to the existing show_menu, however it is not a fully drop in replacement for it due to the problems I mentioned in my previous email. Let me know what problems you have with it.

[brofield]

Sorry, no easy solution that I can think of.

B

your menu function looks quite impressive: I'm trying to have a menu like this, where all the

home | study | about
is there a way to get this?
I only get it to look like home | study | about |

obviously, the red vertical bar at the end is ugly. Does anybody have a solution for this?

Thanks a lot

[brofield]

You are probably better to do this with the sitemap module. I will look to see what might be involved.

B

Thanks. Looks like I was looking at an older doc. I did change it to [page] but it still shows the menu title. 

I did have a suggestion for the future as well. Maybe you can add a feature to optional show the meta description/keywords as well. This can be useful in the sitemap for example where I can show the title and short description of each page. For example


Sitemap

Graphics
- Photoshop
  - Plugins - Add features to your program with these free plugins. [keywords: art, design]

[brofield]

I've released version 2.6.1 which should clear this problem up. See http://code.jellycan.com/show_menu2/

B

@brofield

I spotted this error in my scripts.log file. Not sure if it is important.

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

[brofield]

your menu function looks quite impressive: I'm trying to have a menu like this, where all the

home | study | about
is there a way to get this?
I only get it to look like home | study | about |

obviously, the red vertical bar at the end is ugly. Does anybody have a solution for this?

I take it back. Of course there is a way to do this. See the demo site at http://code.jellycan.com/sm2test/ and have a look at the "Root Only (TEXT)" sample. Essentially you set the normal item to " | link" and set the first item to "link".

Cheers,
Brodie

[kickarse]

Just curious if you thought about adding functionality such as this
(from your site )

Code:

<div class="menu">

<ul class='menu-top'>
<li class='menu-sibling'><a href='http://code.jellycan.com' target='_top'>Home</a></li>
<li class='menu-sibling'><a href='http://code.jellycan.com/simpleopt/' target='_top'>SimpleOpt</a></li>
<li class='menu-sibling'><a href='http://code.jellycan.com/simpleini/' target='_top'>SimpleIni</a></li>
<li class='menu-sibling'><a href='http://code.jellycan.com/moji/' target='_top'>Moji</a></li>
<li class='menu-sibling'><a href='http://code.jellycan.com/langselect/' target='_top'>LangSelect</a></li>
<li class='menu-expand menu-current'><a href='http://code.jellycan.com/show_menu2/' target='_top'>show_menu2</a>
        <ul><li class='menu-child'><a href='http://code.jellycan.com/sm2test/' target='_top'>Test</a></li></ul>
</li>
<li class='menu-sibling'><a href='http://code.jellycan.com/macros/' target='_top'>Macros</a></li>
<li class='menu-sibling'><a href='http://code.jellycan.com/comments/' target='_top'>Comments</a></li>
</ul>
</div>

Thought about giving the a href a class of what the name of the link is like so

Code:

<li class='menu-sibling'><a href='http://code.jellycan.com/comments/' class='comments'>Comments</a></li>

Something that would be populated by $page_id or $title ?

This would help if you wanted to style the link with pictures as navigation instead of text. Giving complete control over the menu look.

[bupaje]

@brofield - no feedback on the beta until this weekend but I wanted to say the sitemap feature with the added description field is cool -just what I wanted. Also thanks for picking up that arraykeys bug and for all your other work. 

If you're still taking requests for future updates here's one I had a while back on my previous layout, but others have requested it. How about the ability to assign small 16x16 icons to the menu items. I did a messy hack on my old one where I simply did something like [page_name].jpg and save images named after each page but made for many duplicated images. I also did similar with page level ie [level].jpg (forget what the actually variables were called).

In my case all I originally wanted to have a different top level icon and color for each top level category

Graphics (paint_brush.gif)
News (newspaper.gif)

Then you could use a similar logo/color scheme on the page; this helps on a site with many types of content for the visitor to readily know what section they are in. In other words all art related pages are blue scheme, with paint brush logo (matching the menu icon) etc.

Anyway sorry for inflicting you with my rambling thought process. This should be part of the WB core as it is absolutely excellent.

[brofield]

@kickarse
You can already do something like this by using the [menu_title] as the class in the item format. You would want to keep all of your menu titles as single words I guess. In the next beta I will include a few extra items like page_id, parent_page_id, description, keywords. e.g.

Code:

"<a href='[url]' target='[target]' class='[menu_title]'>[menu_title]</a>"

@bupaje
I have no idea what you are wanting.

Regards,
B

[brofield]

Release of show_menu2, version 3.0 beta 2.

Changes in this version are:

• added [description], [keywords], [page_id], [parent] (parent page id), [level] (page level) formatting options
• all flag like options combined into a flags parameter (affects only people using numbered classes and descriptions or keywords
• all formatting of the menu has been abstracted out into a formatting class which may be replaced by a caller with their own custom formatting class.

Details, demo and downloads at http://code.jellycan.com/show_menu2/

Regards,
Brodie

[brofield]

In my case all I originally wanted to have a different top level icon and color for each top level category

Graphics (paint_brush.gif)
News (newspaper.gif)

If you use the new 3.0 version then you could use the [level] or [page_id] formats set the class or link id. To do class based images though, you should be able to do it with the current version and CSS selectors. See http://css.maxdesign.com.au/listutorial/master.htm

Cheers,
Brodie

[virgil]

@brofield

Hi Brodie
I would like to use your show_menu2 snippet to create a Sitemap with
description + keywords like shown in your demo page. 

I guess that -to create a normal menu- you put a regular php-call of show_menu2
in the index(.)php file, which will create the menu call on every page of your site
... but...
I want a sitemap to be shown only on a single page  

- How can I do that?
- Wich release of the snippet do I at least nee?
 

Thx for answers...
Regards,
Virgil

[brofield]

I guess that -to create a normal menu- you put a regular php-call of show_menu2
in the index(.)php file, which will create the menu call on every page of your site
... but...
I want a sitemap to be shown only on a single page  

- How can I do that?

Instead of wysiwyg, choose Code for the page type. Then write the call to show_menu2 directly into the page. I have created a demo of this at http://code.jellycan.com/sm2test/pages/site-map.php

- Wich release of the snippet do I at least nee?

v3.0 to get keywords and descriptions. Ensure that you pass SM2_DESCKEY in the flags. For example the code I used in the sample page is...

Code:

show_menu2(0, SM2_ROOT, SM2_ALL, SM2_ALL|SM2_DESCKEY,
   '<span class="stuff">[a][page_title][/a] (menu: [a][menu_title][/a])'.
   '<br /><i>[description]</i><br />([keywords])</span>',
   "<ul class='sitemap'>",'</ul>','<li>','</li>',false,false);

Cheers,
Brodie

[brofield]

Release of show_menu2, version 3.0 beta 3.

Changes:

• added trial support for legacy functions show_menu() and page_menu()

Details, demo and downloads at http://code.jellycan.com/show_menu2/

Currently these functions are named sm2_show_menu and sm2_page_menu so that I can test them side by side. See the bottom of the test page for some demos. Basically, it isn't working. I don't quite understand the results that I am getting out of show_menu. It seems like it is not rendering the menus like it's call signature says it should. If someone can have a look and give me comments on if the results I see there are what you expect. Perhaps a few more examples to work with.

However, there is never going to be 100% backward compatibility with those functions without keeping the existing code. I don't see why we don't just do that. Just add show_menu2 to the main distrib and encourage template writers to use it. If you want to get rid of the original functions in the future then do so.

In any case, this is the last release / bugfix for a few weeks. Enjoy.

Regards,
Brodie

[virgil]

@brofield


Hi again

Instead of wysiwyg, choose Code for the page type.
Then write the call to show_menu2 directly into the page.

It's exactly what I did before posting my question (nice t see that I was on te right way)
but it doesn't work... 

I get:

Code:

Parse error: parse error, unexpected T_STRING
in /home/httpd/vhosts/mydomain.com/httpdocs/modules/code/view.php(30) : eval()'d
code on line 5

My entry in in the Code page was

Code:

<?php
 show_menu2(0, SM2_ROOT, SM2_ALL, SM2_ALL|SM2_DESCKEY, 
   '<span class="stuff">[a][page_title][/a] (menu: [a][menu_title][/a])'.
   '<br /><i>[description]</i><br />([keywords])</span>',
   "<ul class='sitemap'>",'</ul>','<li>','</li>',false,false);
?>

(BTW: After saving the page the   "<?php"   and the   "?>"   disappears; is this OK?)

What do I do wrong?

Thx for your reply
Regards,
Virgil

[brofield]

Just put the call to show_menu2. You can't use <?php ?> in a code page.

B

[virgil]

Hi Brodie

Thx for reply.

I've put ONLY this in a code page:

Code:

show_menu2(0, SM2_ROOT, SM2_ALL, SM2_ALL|SM2_DESCKEY,
   '<span class="stuff">[a][page_title][/a] (menu: [a][menu_title][/a])'.
   '<br /><i>[description]</i><br />([keywords])</span>',
   "<ul class='sitemap'>",'</ul>','<li>','</li>',false,false);

... we're on the good run  .... BUT  ...

I get the following now (EXACTLY what you see... Codes, but no content):
(BTW: the links [page_title] and [menu_title] are working correctly)

Code:

<
class='menu-top
'>< class='
menu-sibling'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
menu-sibling'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
menu-expand menu-sibling'>[page_title] (menu: [menu_title])
[description]
([keywords])<
class='
'>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
menu-expand'>[page_title] (menu: [menu_title])
[description]
([keywords])<
class='
'>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>>>>>< class='
menu-expand menu-sibling'>[page_title] (menu: [menu_title])
[description]
([keywords])<
class='
'>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>>>< class='
menu-sibling'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
menu-expand menu-sibling'>[page_title] (menu: [menu_title])
[description]
([keywords])<
class='
'>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>>>< class='
menu-expand menu-sibling'>[page_title] (menu: [menu_title])
[description]
([keywords])<
class='
'>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
menu-expand'>[page_title] (menu: [menu_title])
[description]
([keywords])<
class='
'>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>>>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>>>< class='
menu-expand menu-sibling'>[page_title] (menu: [menu_title])
[description]
([keywords])<
class='
'>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>>>< class='
menu-sibling'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
menu-expand menu-sibling'>[page_title] (menu: [menu_title])
[description]
([keywords])<
class='
'>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>>>< class='
menu-expand menu-sibling'>[page_title] (menu: [menu_title])
[description]
([keywords])<
class='
'>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>< class='
'>[page_title] (menu: [menu_title])
[description]
([keywords])>>>< class='
menu-current'>[page_title] (menu: [menu_title])
[description]
([keywords])>>

There must still be sme tiny mistake, but as I'm definitly not a coder... aehm... sorry... could you help once more? 
Sorry if I'm abusing you being so pacient.

Regards,
Virgil