Navigation li and child ul li dynamic output class help

Feed 2 posts, 2 voices

Avatar
1 posts

Hi

Im am new to this (frog cms). What I’m trying to do is to get the li to output the class slug.

example.

<ul>

<li class="home">Home</li>

<li class="home2">Home2</li>

<li class="home3">Home3

<ul>

<li class="home3a>Home3a</li>

</ul>

</li>

<li class="home4">Home4</li>

</ul>

I am currently using this code:

<ul id="nav"> <li><a<?php echo url_match('/') ? ' class="current"': ''; ?> href="<?php echo URL_PUBLIC; ?>">Home</a></li> <?php $menu = $this->find('/')->children(); foreach ($menu as $child) { echo '<li>'; if ($child->children()) { echo $child->link($child->title, (url_start_with($child->url) ? ' class="current"': null)); echo PHP_EOL . '<ul>'; foreach($child->children() as $kids) { echo '<li>' . $kids->link($kids->title, (url_start_with($kids->url) ? ' class="current"': null)) . '</li>' . PHP_EOL; } echo '</ul>' . PHP_EOL; } else { echo $child->link($child->title, (url_start_with($child->url) ? ' class="current"': null)); } echo '</li>' . PHP_EOL; } ?> </ul>

I also tried this piece of code. Founded on one of the discussion, but it’s only outputting the “class=“current”“ to the page that you are on.

please help.

<?php function displayChildren($page, $current, $startmenu = true, $limits = null) { if ($limits != null && array_key_exists($page->slug, $limits)) { $arr = array('order' => 'position ASC, published_on DESC', 'limit' => $limits[$page->slug]); } else $arr = array('order' => 'position ASC, published_on DESC'); if ($page && count($page->children()) > 0) { echo ($startmenu) ? '<ul>' : ''; foreach($page->children($arr) as $menu) : // next line: if $current url matches looped url, get current class echo '<li'.(($menu->url() == $current->url()) ? ' class="current"': null).'>'.$menu->link($menu->title); displayChildren($menu, $current, true, $limits); echo '</li>'; endforeach; echo ($startmenu) ? '</ul>' : ''; } } ?>

<div id="top"> <?php $page = $this->find('/'); echo '<ul id="nav">'; echo '<li>'.$page->link($page->title, (in_array($page->slug, explode('/', $this->url)) ? ' class="current"': null)).'</li>'; echo displayChildren($page, $this, false, array('careers' => '3', 'a-sub-page' => '1')); echo '</ul>'; ?> </div>

Thanks for the help

 
Avatar
1493 posts

In your “currently using” code, try replacing the first and third instances of

' class="current"':

with,

' class="'. $child->slug() .'"':

and replace the second instance with

' class="'. $kids->slug() .'"':

WARNING! Not tested — but it might work. ;)

 
Avatar
1 posts

Hey David thanks for the quick respond. Even though just changing the ' class="current"' in the first and third places didn’t work you gave me a good idea to test something using ' class="'. $kids->slug() .'"':, and now it’s working perfectly!

Here is what I changed and added.

I put ‘.(in_array($menu->slug, explode(’/’, $current->url)) ? ‘ class=“current”’: null).’ in the <li > and changed the ‘ class=“current”’ to ‘ class=”’. $kids->slug() .’”’:. It output perfectly!

Thanks again!

Here’s the final code for whoever wants to play around with it..

<?php
			$menu = $this->find('/')->children();
			foreach ($menu as $child) {
			    echo '<li>';
			if ($child->children()) {
			    echo $child->link($child->title, (url_start_with($child->url) ? ' class="current"': null));
			    echo PHP_EOL . '<ul>';
			        foreach($child->children() as $kids) {
			           echo '<li'.(in_array($menu->slug, explode('/', $current->url)) ? ' class="'. $kids->slug() .'"': null).'>' . $kids->link($kids->title, (url_start_with($kids->url) ? ' class="current"': null)) . '</li>'  . PHP_EOL;
			        }
			        echo '</ul>' . PHP_EOL;
			    } else {
			    echo $child->link($child->title, (url_start_with($child->url) ? ' class="current"': null));
			    }
			    echo '</li>' . PHP_EOL;
			}
			?>