Sectionheader in menumanager

nrkc · Post by **nrkc** » Sun May 14, 2006 7:01 am

Hey
I can't figure it out... I'm trying to make a menu in menumanager. I have a sectionheader in it and when i click on it I would like it to open the first page in the level below.

My site could be like this:
1. Nyheder
2. Caribien
2.1. Dagbog
2.2. Gæstebog
2.3. Billeder

I don't want a menu where there is a hover-effect, but when I click on "2. Caribien" it should link to "2.1. Dagbog" where another menu will show up with the submenu.

I've tried but I don't understand the menumanager template. Right now i looks like this:

{* CSS classes used in this template:
#active - The active/current page
#sectionheader - To style section header
hr.separator - To style the ruler for the separator *}
{if $count > 0}

{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="" times=$node->depth-$node->prevdepth}
{elseif $node->depth prevdepth}
{repeat string="" times=$node->prevdepth-$node->depth}

{elseif $node->index > 0}
{/if}

{if $node->current == true}
url}"{if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}
{elseif $node->type == 'sectionheader'}
{$node->menutext}
{elseif $node->type == 'separator'}

{else}
url}"{if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}{/if}
{/foreach}

{repeat string="" times=$node->depth-1}

{/if}

My site-template could look like this, with the menu and next the submenu:

{title}
{metadata}
{stylesheet}

{cms_module module='menumanager' template='capion.org' number_of_levels="1"}
{cms_module module='menumanager' template='capion.org' number_of_levels="1" start_level="2"}
{content}

Hoping that some one out there is smarter than me... ;)

Elijah Lofgren · Post by **Elijah Lofgren** » Sun May 14, 2006 2:45 pm

I don't want a menu where there is a hover-effect, but when I click on "2. Caribien" it should link to "2.1. Dagbog" where another menu will show up with the submenu.

I'm sorry, but I'm having trouble understanding exactly what you want. Maybe if you attach an image that illustrates what you want it might help.

Why and how do you want "2. Caribien" linked to "2.1. Dagbog"?

I can probably help you once I understand what you want.

Dr.CSS · Post by **Dr.CSS** » Sun May 14, 2006 11:19 pm

what i would like is some way to clik on the section header and have the pages under it show up under the secton header like this...
www.multiintech.com/old/  that would be nice

mark

Elijah Lofgren · Post by **Elijah Lofgren** » Mon May 15, 2006 2:10 am

mark wrote: what i would like is some way to clik on the section header and have the pages under it show up under the secton header like this...
www.multiintech.com/old/  that would be nice

mark

Mission Accomplished!

See: http://wiki.cmsmadesimple.org/index.php ... ion_expand

Enjoy.

Elijah Lofgren · Post by **Elijah Lofgren** » Mon May 15, 2006 2:59 am

nrkc wrote: I don't want a menu where there is a hover-effect, but when I click on "2. Caribien" it should link to "2.1. Dagbog" where another menu will show up with the submenu.

I think I figured out what you are wanting.

Create a new menu template named "headerlink" with this content:

Code: Select all

{* CSS classes used in this template:
#active - The active/current page
#sectionheader - To style section header
hr.separator - To style the ruler for the separator *}
{if $count > 0}
<div class="menu">
<ul id="menu">
{foreach from=$nodelist item=node}
{if $doheaderlink == "1"}
{assign var="doheaderlink" value="0"}
{assign var="stopshowing" value="1"}
<li id="sectionheader"><a href="{$node->url}">{$headertext}</a>
{/if}
{if $node->depth > $node->prevdepth}
{repeat string="<ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</li>
{elseif $node->index > 0}</li>
{/if}

{if $stopshowing != "1"}
{if $node->current == true}
<li id="active"><a href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}</a>
{elseif $node->type == 'sectionheader'}
{assign var="doheaderlink" value="1"}
{assign var="headertext" value=$node->menutext}
{elseif $node->type == 'separator'}
<li id="separator">
{else}
<li><a href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}</a>{/if}
{/if}

{/foreach}

{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
</div>
{/if}

Now changet the body section of your template so it looks like this (you will notice we are still using your capion.org menu template):

Code: Select all

</__body>
{cms_module module='menumanager' template='headerlink'}
{cms_module module='menumanager' template='capion.org' number_of_levels="1" start_level="2"}
{content}
<__body>

If you're at the Nyheder page you should see a menu with the following in it:
Nyheder
Caribien

Now when you click on the "Caribien" section header it should open the "Dagbog" page and show a menu with the following in it:
Nyheder
Caribien

Dagbog
Gæstebog
Billeder

I think that's what you wanted.

Dr.CSS · Post by **Dr.CSS** » Mon May 15, 2006 9:50 pm

Elijah Lofgren wrote:
mark wrote: what i would like is some way to clik on the section header and have the pages under it show up under the secton header like this...
www.multiintech.com/old/  that would be nice

mark
Mission Accomplished!
See: http://wiki.cmsmadesimple.org/index.php ... ion_expand

Enjoy.

almost... still missing something http://www.multiintech.com/index.php?page=imapbullet
i've tried a few diff. things, the div in the menu was giving me problems, looks like this without any changes http://www.multiintech.com/index.php?page=expandbullet these are active but not in the menu...

mark

Elijah Lofgren · Post by **Elijah Lofgren** » Mon May 15, 2006 10:35 pm

mark wrote: almost... still missing something http://www.multiintech.com/index.php?page=imapbullet
i've tried a few diff. things, the div in the menu was giving me problems, looks like this without any changes http://www.multiintech.com/index.php?page=expandbullet these are active but not in the menu...

You mean that you want to make it so that if you are viewing a page that you don't have to click the section header to see links to it and it's children? (If so, I might be able to change the code to do this. I may have time to look at it tonight. We'll see)

Dr.CSS · Post by **Dr.CSS** » Mon May 15, 2006 11:14 pm

clik section header, 'children' drop down and push the section header below it down, if you goto www.multiintech.com/old/  and clik 'Page Styles' you'll see what i mean....

mark

Elijah Lofgren · Post by **Elijah Lofgren** » Tue May 16, 2006 1:33 am

mark wrote: clik section header, 'children' drop down and push the section header below it down, if you goto www.multiintech.com/old/  and clik 'Page Styles' you'll see what i mean....

I've fixed the code to work with multiple section headers (I had only tested with one).

I've posted the updated code here:
http://wiki.cmsmadesimple.org/index.php ... ion_expand

I was unable to check with your CSS code on my test site because it seems it's page id specific and my pages have different ids then yours. But my unstyled list works right now with two section headers.

Dr.CSS · Post by **Dr.CSS** » Tue May 16, 2006 5:36 am

ok... do you think you could make one to spit out something like this....

section header
Home
P
S
P
M
R
T
C
M

section header
Home
P
S
P
M
R
T
C
M

section header
Home
P
S
P
M
R
T
C
M

i know i hate tables but it is a list/table of data... the JS that drives that other /old/ one is called out in tables if i could get my menu spit out this way.... OH YA

so you up for it? i would but i don't know how these 'loop'...

mark

nrkc · Post by **nrkc** » Tue May 16, 2006 8:48 pm

Thank you Elijah, that was exactly what I wanted it to do.

I just can't understand why I have to use to different templates now... I tried using your template for the submenu but it did not print out anything. Not that I can't use two different templates but I was just wondering...

But anyways; thanks a lot for the help!

nrkc · Post by **nrkc** » Tue May 16, 2006 9:34 pm

Hmm, didn't work quite how I expected...

First I thought i worked but then I added some extra pages to see how the template would handle it. So my menu structure is now like this:

1. Home
2. Caribien
2.1. Dagbog
2.2. Gæstebog
2.3. Billeder
3. Lorem
4. ny header
4.1. side 1
4.2. anden side

First it stopped right after "2.3. Billeder" and the sourcecode looked like this:

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<__html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<title>Billeder</title>
<meta name="Generator" content="CMS Made Simple - Copyright (C) 2004-6 Ted Kulp. All rights reserved." />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 
<link rel="stylesheet" type="text/css" media="screen" href="http://capion.org/stylesheet.php?templateid=5&mediatype=screen" />

</head>
</__body>
<div class="menu">
<ul id="menu">

<li><a href="http://capion.org/index.php?side=home">Home</a>

</li>

<li><a href="http://capion.org/index.php?side=dagbog">Caribien</a>

<ul>

</li>

</li>

</li></ul>
</li>

</li>

<ul>

</li>

</li></ul></li>
<li id="empty"></li></ul>
</div>
 
<div class="menu">
<ul id="submenu">
<li><a href="http://capion.org/index.php?side=dagbog">Dagbog</a></li>
<li><a href="http://capion.org/index.php?side=gastebog">Gæstebog</a></li>
<li id="active"><a href="http://capion.org/index.php?side=billeder">Billeder</a>
</li>
</ul>
</div>
<img width="198" height="52" align="middle" alt="" src="uploads/images/logo1.gif" />
<__body>
</__html>
<!-- Generated in 0.275172 seconds by CMS Made Simple 0.12.1 (cached) using 10 SQL queries -->
<!-- CMS Made Simple - Released under the GPL - http://cmsmadesimple.org -->

I solved the problem by removing

Code: Select all

{assign var="stopshowing" value="1"}

from your template.

Now it looks like this - have a look www.capion.org

So my site template is:

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<__html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<title>{title}</title>
{metadata}
{stylesheet}
</head>
</__body>
{cms_module module='menumanager' template='menu'}
{cms_module module='menumanager' template='submenu' start_level='2'}
{content}
<__body>
</__html>

(Renamed your menu)

And my menu template 'menu' is:

Code: Select all

{* CSS classes used in this template:
#active - The active/current page
#sectionheader - To style section header
hr.separator - To style the ruler for the separator *}

{if $count > 0}
<div class="menu">
<ul id="menu">

{foreach from=$nodelist item=node}

{if $doheaderlink == "1"}
{assign var="doheaderlink" value="0"}
<li><a href="{$node->url}">{$headertext}</a>
{/if}

{if $node->depth > $node->prevdepth}
{repeat string="<ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</li>
{elseif $node->index > 0}</li>
{/if}

{if $stopshowing != "1"}
{if $node->current == true}
<li id="active"><a href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}</a>
{elseif $node->type == 'sectionheader'}
{assign var="doheaderlink" value="1"}
{assign var="headertext" value=$node->menutext}
{elseif $node->type == 'separator'}
<li id="separator">
{else}
<li><a href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}</a>{/if}
{/if}

{/foreach}

{repeat string="</li></ul>" times=$node->depth-1}</li>
<li id="empty"></li></ul>
</div>
{/if}

If I add number_of_levels='1' to the first menu it looks right but the menu stops after "3. lorem".

Hoping that you know what the problem is because I sure don't...

Thanks, Richard

Dr.CSS · Post by **Dr.CSS** » Tue May 16, 2006 10:13 pm

do you know this shows up on your site...

number_of_levels="1"

and is in your view source as ...

side 1

anden side

number_of_levels="1"

makes me think it's not inside your { } like this is...
{cms_module module='menumanager' template='menu'}
{cms_module module='menumanager' template='submenu' start_level='2'}

mark

nrkc · Post by **nrkc** » Tue May 16, 2006 10:29 pm

Oh, yes I know - I just needed som text on the site and number_of_levels="1" was just what was in my clipboard on that time...

Changed now!

Elijah Lofgren · Post by **Elijah Lofgren** » Wed May 17, 2006 3:36 am

nrkc wrote: I just can't understand why I have to use to different templates now... I tried using your template for the submenu but it did not print out anything. Not that I can't use two different templates but I was just wondering...

I couldn't figure out before how to do it with just one template, but I just did!

nrkc wrote: Hmm, didn't work quite how I expected...
...
First it stopped right after "2.3. Billeder" and the sourcecode looked like this:
...
If I add number_of_levels='1' to the first menu it looks right but the menu stops after "3. lorem".

Hoping that you know what the problem is because I sure don't...

The problem was that I didn't test using multiple section headings, this new code should fix that though.

Create a new menu template named "headerlink" and put the following code in it:

Code: Select all

{* CSS classes used in this template:
#active - The active/current page
.sectionheader - To style section header
hr.separator - To style the ruler for the separator *}
{if $count > 0}
<div class="menu">
<ul id="menu">
{foreach from=$nodelist item=node}
{if $doheaderlink == "1"}
{assign var="doheaderlink" value="0"}
<li class="sectionheader"><a href="{$node->url}">{$headertext}</a>
{/if}
{if $node->depth == 1 or $showchildren == 1}
{if $node->depth > $node->prevdepth}
{repeat string="<ul>" times=$node->depth-$node->prevdepth}
{assign var="listopen" value="1"}
{elseif $node->depth < $node->prevdepth}
{if $listopen == "1"}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
{assign var="listopen" value="0"}
{/if}
</li>
{elseif $node->index > 0}</li>
{/if}

{if $node->current == true}
<li id="active"><a href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}</a>
{elseif $node->type == 'sectionheader'}
{assign var="doheaderlink" value="1"}
{if $node->parent == true}
{assign var="showchildren" value="1"}
{else}
{assign var="showchildren" value="0"}
{/if}
{assign var="headertext" value=$node->menutext}
{elseif $node->type == 'separator'}
<li id="separator">
{else}
<li><a href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}</a>{/if}
{/if}

{/foreach}
{if $listopen == "1"}
{repeat string="</li></ul>" times=$node->depth-1}
{/if}
</li>
<li id="empty"></li>
</ul>
</div>
{/if}

You'll notice the code got a bit longer

Now change the body section of your template so it looks like this (we're only using one menu template now):

Code: Select all

</__body>
{cms_module module='menumanager' template='headerlink'}
{content}
<__body>

That should work for you (according to my testing that is)

CMS Made Simple Forums

Sectionheader in menumanager

Sectionheader in menumanager

Re: Sectionheader in menumanager

Re: Sectionheader in menumanager

Re: Sectionheader in menumanager

Re: Sectionheader in menumanager

Re: Sectionheader in menumanager

Re: Sectionheader in menumanager

Re: Sectionheader in menumanager

Re: Sectionheader in menumanager

Re: Sectionheader in menumanager

Re: Sectionheader in menumanager

Re: Sectionheader in menumanager

Re: Sectionheader in menumanager

Re: Sectionheader in menumanager

Re: Sectionheader in menumanager