CMS Made Simple Forums

Content management as it is meant to be
https://forum.cmsmadesimple.org/

:SOLVED: Submenu has child as current when on a parent page

https://forum.cmsmadesimple.org/viewtopic.php?t=73280

Page 1 of 1

:SOLVED: Submenu has child as current when on a parent page

Posted: Fri Aug 07, 2015 11:07 am
by SinJ
Hi,

I'm running CMS Made Simple 1.12.
I'm using PHP 5.5.23 and MySQL 5.5.42.
This is all working with Apache running on Linux.

I have a problem with submenu currents as below:

My main navigation is this:
Link 1
Link 2
Link 3 (includes submenu)
Link 4
Link 5

Then I have submenu under Link 3 like this (all links shown):
Link 1
Link 2
Link 3 - Link 3.1 - Link 3.1.1 - Link 3.1.1.1
-------------------------- Link 3.1.1.2
-------------------------- Link 3.1.1.3
---------------- Link 3.1.2
---------------- Link 3.1.3
------- Link 3.2
------- Link 3.3
Link 4
Link 5

If you can see what I mean.


The page under Link 3 doesn't have content, it'a a link direct to page 3.1. When I'm at page 3.1. I should see the submenu links like this:

Link 3.1 - Link 3.1.1 - Link 3.1.1.1
------------------- Link 3.1.1.2
------------------- Link 3.1.1.3
-------- Link 3.1.2
-------- Link 3.1.3
- Link 3.2
- Link 3.3

As you can see, there should be only the page and it's parents as current where I am. If I would be at the page 3.1.1, menu should look like this:
Link 3.1 - Link 3.1.1 - Link 3.1.1.1
------------------- Link 3.1.1.2
------------------- Link 3.1.1.3
-------- Link 3.1.2
-------- Link 3.1.3
- Link 3.2
- Link 3.3



Right now when I'm at page 3.1 or at the page 3.1.1, the menu looks like this (looks similar on both pages):
Link 3.1 - Link 3.1.1 - Link 3.1.1.1
------------------- Link 3.1.1.2
------------------- Link 3.1.1.3
-------- Link 3.1.2
-------- Link 3.1.3
- Link 3.2
- Link 3.3

What might made the parent's child link to be also current?

The code (layout):

Code: Select all

<nav class="left">

{menu start_level="2" number_of_levels="3" template="Xxxxx-menu-left"}

</nav>
The code (Xxxxx-menu-left):

Code: Select all

{* CSS classes used in this template:
.current-left - The top level parent when a child is the active/current page
li.active0n h3 - n is the depth/level of the node. To style the active page for each level separately. The active page is not clickable.
.clearfix - Used for the unclickable h3 to use the entire width of the li, just like the anchors. See the Tools stylesheet in the default CMSMS installation.
li.sectionheader h3 - To style section header
li.separator - To style the ruler for the separator *} 

{assign var='number_of_levels' value=10000}
{if isset($menuparams.number_of_levels)}
  {assign var='number_of_levels' value=$menuparams.number_of_levels}
{/if}

{if $count > 0}
<ul>
{foreach from=$nodelist item=node}

{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 $node->parent == true or $node->current == true}
  {assign var='classes' value='current-left'}
  {if $node->parent == true}
    {assign var='classes' value='current-left menuparent'}
  {/if}
  {if $node->children_exist == true and $node->depth < $number_of_levels}
    {assign var='classes' value=$classes|cat:' parent'}
  {/if}
  <li class="{$classes}"><a class="{$classes}" href="{$node->url}"><span>{$node->menutext}</span></a> 

{elseif $node->children_exist == true and $node->depth < $number_of_levels and $node->type != 'sectionheader' and $node->type != 'separator'}
<li class="parent"><a class="parent" href="{$node->url}"><span>{$node->menutext}</span></a>

{elseif $node->current == true}
<li class="current-left"><h3><span>{$node->menutext}</span></h3>

{elseif $node->type == 'sectionheader'}
<li class="sectionheader"><span>{$node->menutext}</span>

{elseif $node->type == 'separator'}
<li class="separator" style="list-style-type: none;"> <hr />

{else}
<li><a href="{$node->url}"><span>{$node->menutext}</span></a>

{/if}

{/foreach}
{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}
Thank you so much!

Re: Submenu has child as current when on a parent page

Posted: Fri Aug 07, 2015 5:56 pm
by velden
A link to the page or the html code of the menu would be very helpful.

Re: Submenu has child as current when on a parent page

Posted: Mon Aug 10, 2015 8:24 am
by SinJ
Of course! ::)

Code of the menu left:

Code: Select all

<nav class="left">
      <ul>
        <li><a href="link.html"><span>Active link text</span></a>
          <ul>
            <li><a href="link.html">Link text</a></li>
            <ul>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
            </ul>
            <li><a href="link.html">Link text</a></li>
          		  <ul>
            	  <li><a href="link.html">Link text</a></li>
           	 </ul>
          </ul>
          <ul>
            <li><a href="link.html">Link text</a></li>
            <ul>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
            </ul>
          </ul>
        </li>
      </ul>
      <ul>
        <li><a href="link.html">Link text</a>
          <ul>
            <li><a href="link.html">Link text</a></li>
            <ul>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
            </ul>
          </ul>
        </li>
      </ul>
      <ul>
        <li><a href="link.html>Link text</a>
          <ul>
            <li><a href="link.html">Link text</a></li>
            <ul>
              <li><a href="link.html">Link text</a></li>
            </ul>
          </ul>
          <ul>
            <li><a href="link.html">Link text</a></li>
            <ul>
              <li><a href="link.html">Link text</a></li>
            </ul>
          </ul>
          <ul>
            <li><a href="link.html">Link text</a></li>
            <ul>
              <li><a href="link.html">Link text</a></li>
            </ul>
          </ul>
          <ul>
            <li><a href="link.html">Link text</a></li>
            <ul>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
              <li><a href="link.html">Link text</a></li>
            </ul>
          </ul>
        </li>
      </ul>
      <ul>
        <li><a href="link.html">Link text</a>
          <ul>
            <li><a href="link.html">Link text</a></li>
            <ul>
              <li><a href="link.html">Link text</a></li>
            </ul>
          </ul>
          <ul>
            <li><a href="link.html">Link text</a></li>
            <ul>
              <li><a href="link.html">Link text</a></li>
            </ul>
          </ul>
        </li>
      </ul>
      <ul>
        <li><a href="link.html">Link text</a>
          <ul>
            <li><a href="link.html">Link text</a></li>
            <ul>
              <li><a href="link.html">Link text</a></li>
            </ul>
          </ul>
        </li>
      </ul>
      <ul>
        <li><a href="link.html">Link text</a>
          <ul>
            <li><a href="link.html">Link text</a></li>
            <ul>
              <li><a href="link.html">Link text</a></li>
            </ul>
          </ul>
        </li>
      </ul>
    </nav>
I think it has to do something with the main menu link (in the top) because it's only link to another page.

Re: Submenu has child as current when on a parent page

Posted: Mon Aug 10, 2015 10:32 am
by velden
I don't see any class attribute (except for the class="left").

So this can't be right. No way the browser could know what part is active/current (except if you're using JS for that and you didn't mention that and it is not likely).

Re: Submenu has child as current when on a parent page

Posted: Mon Aug 10, 2015 11:03 am
by SinJ
Thank you veiden for reply! So it is not enough to use class .current-left in the menu code? Where I should add this class element?

Re: Submenu has child as current when on a parent page

Posted: Mon Aug 10, 2015 12:45 pm
by velden
I don't know what you're doing exactly but the pasted html output is not output from Menu Manager.

Re: Submenu has child as current when on a parent page

Posted: Mon Aug 10, 2015 12:52 pm
by SinJ
Menu Manager code is as below. There I'm designed how the current link should look like with . current-left, .menuparent and .parent.

Code: Select all

{* CSS classes used in this template:
.current-left - The top level parent when a child is the active/current page
li.active0n h3 - n is the depth/level of the node. To style the active page for each level separately. The active page is not clickable.
.clearfix - Used for the unclickable h3 to use the entire width of the li, just like the anchors. See the Tools stylesheet in the default CMSMS installation.
li.sectionheader h3 - To style section header
li.separator - To style the ruler for the separator *} 

{assign var='number_of_levels' value=10000}
{if isset($menuparams.number_of_levels)}
  {assign var='number_of_levels' value=$menuparams.number_of_levels}
{/if}

{if $count > 0}
<ul>
{foreach from=$nodelist item=node}

{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 $node->parent == true or $node->current == true}
  {assign var='classes' value='current-left'}
  {if $node->parent == true}
    {assign var='classes' value='current-left menuparent'}
  {/if}
  {if $node->children_exist == true and $node->depth < $number_of_levels}
    {assign var='classes' value=$classes|cat:' parent'}
  {/if}
  <li class="{$classes}"><a class="{$classes}" href="{$node->url}"><span>{$node->menutext}</span></a> 

{elseif $node->children_exist == true and $node->depth < $number_of_levels and $node->type != 'sectionheader' and $node->type != 'separator'}
<li class="parent"><a class="parent" href="{$node->url}"><span>{$node->menutext}</span></a>

{elseif $node->current == true}
<li class="current-left"><h3><span>{$node->menutext}</span></h3>

{elseif $node->type == 'sectionheader'}
<li class="sectionheader"><span>{$node->menutext}</span>

{elseif $node->type == 'separator'}
<li class="separator" style="list-style-type: none;"> <hr />

{else}
<li><a href="{$node->url}"><span>{$node->menutext}</span></a>

{/if}

{/foreach}
{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}
The current link's design works fine, but the first page with the submenu (left) shows the first link and it's child as current. Even I am at the parent page.

Re: Submenu has child as current when on a parent page

Posted: Mon Aug 10, 2015 2:22 pm
by velden
SinJ wrote:The current link's design works fine, but the first page with the submenu (left) shows the first link and it's child as current. Even I am at the parent page.
I would like to see that. Not that you tell me so or paste html you would like to see, but the actual result.

Re: Submenu has child as current when on a parent page

Posted: Wed Aug 12, 2015 9:42 pm
by Dr.CSS
This is something we would need a link to the actual site to figure out what is happening and what it outputs, said so in a previous post...

Re: Submenu has child as current when on a parent page

Posted: Fri Aug 21, 2015 9:58 am
by SinJ
Thank you for your time and replies! Sorry for letting you only see the code. But unfortunately the information on the site is currently secret so I don't have the opportunity to publish or show the pages.

At this point I have to take off the current style, meaning a visitor can't see on the navigation where he is at the moment.

Re: Submenu has child as current when on a parent page

Posted: Fri Aug 21, 2015 10:23 am
by SinJ
Fortunately the problem was simple! I remove .parent class from CSS and now the navigation works fine!

Of course if I could have the opportunity to show you the site I would have got the answer right away. :)
All times are UTC
Page 1 of 1

Powered by phpBB® Forum Software © phpBB Limited