Marty Walker Posted July 11, 2011 Share Posted July 11, 2011 Hi, I'm using the code below to generate a basic navigation: <?php foreach($pages->find("parent=/illustration, sort=sort") as $p) { echo "<li><a href='{$p->url}'>{$p->title}</a></li>"; } Works great but I'm trying to work out how to add a class="current" to the LI if that page matches that nav item - and at any level. I've had a go at trying to work out the code in the sitemap template but without any luck. <?php $nav = $pages->get("/illustration"); $children = $nav->children; foreach($children as $child) { $current = $child === $page->rootParent ? " class='current'" : ''; echo "<li$current><a href='{$child->url}'>{$child->title}</a></li>"; } Any thoughts? Regards Martin // adamkiss: added 'php' in your second code block to force code coloring // apeisa: added [solved] to subject Link to comment Share on other sites More sharing options...
slkwrm Posted July 11, 2011 Share Posted July 11, 2011 If understood right, you need to change $page->rootParent to $page and everything will work You get this: <?php foreach($children as $child) { $current = $child === $page ? " class='current'" : ''; echo "<li$current><a href='{$child->url}'>{$child->title}</a></li>"; } // adamkiss: added '<?php' in your block to force code coloring 1 Link to comment Share on other sites More sharing options...
Marty Walker Posted July 11, 2011 Author Share Posted July 11, 2011 Ahhhh. Thank you! Link to comment Share on other sites More sharing options...
Marty Walker Posted July 12, 2011 Author Share Posted July 12, 2011 I spoke too soon. That won't highlight if I go down another level. Link to comment Share on other sites More sharing options...
nikola Posted July 12, 2011 Share Posted July 12, 2011 I've made a three level menu using this code, it's simple but it works. It highlights every selected level. Change the variables to fit your own or use mine, whatever suits you. <?php echo "<ul>"; $rootPage = wire('pages')->get('/'); foreach($rootPage->children as $menu) { $rootclass = $menu === $page->rootParent ? " class='current'" : ''; echo "<li$rootclass><a href='{$menu->url}'>{$menu->title}</a>"; if($menu->numChildren > 0) { echo "<ul>"; foreach($menu->children as $child) { $class = $child === $page ? " class='current'" : ''; echo "<li$class><a href='{$child->url}'>{$child->title}</a>"; if($child->numChildren > 0) { echo "<ul>"; foreach($child->children as $grandchild) { $subclass = $grandchild === $page ? " class='current'" : ''; echo "<li$subclass><a href='{$grandchild->url}'>{$grandchild->title}</a></li>"; } echo "</ul>"; } echo "</li>"; } echo "</ul>"; } echo "</li>"; } echo "</ul>"; ?> 1 Link to comment Share on other sites More sharing options...
Adam Kiss Posted July 12, 2011 Share Posted July 12, 2011 Nice work! I have a little problem with hardcoded sublevels [$child, $grandchild]. Have a look at this forum post, where Antti and Alasdair talk about recursive menu functions, if you wish Link to comment Share on other sites More sharing options...
apeisa Posted July 12, 2011 Share Posted July 12, 2011 stillmovingdesign: If you want to check if any page is one of the pages in path, you can use this code: <?php if ($page->parents->has($p)) { // This means that page $p is one of the parents of current page ($page) } In your example something like this: <?php foreach($pages->find("parent=/illustration, sort=sort") as $p) { if ($page->parents->has($p)) { $class = 'current'; } else { $class = ''; } echo "<li class='$class'><a href='{$p->url}'>{$p->title}</a></li>"; } 1 Link to comment Share on other sites More sharing options...
Marty Walker Posted July 12, 2011 Author Share Posted July 12, 2011 Thanks for the replies. I think I should illustrate more clearly what I'm trying to do. Here's the development site: http://otoshpw.clientsite.net.au/ My pages are structured thusly: Home -Illustration --Advertising ---client_work_item ---client_work_item ---client_work_item ---client_work_item -Art --Limited Edition Prints etc, etc I'm not including Home in the navigation I'm generating. What I'd like to do, for example, is whenever I'm in a section/page like Advertising or any page under that, have class='current' apply to that LI. Regards Martin Link to comment Share on other sites More sharing options...
ryan Posted July 13, 2011 Share Posted July 13, 2011 If I understand correctly, I think this is what you are looking for: http://processwire.com/talk/index.php/topic,128.msg790.html#msg790 Based on what you've indicated, you'll want to change two things: 1. Currently it's applying the class "on_page" or "on_parent" to the <a> tag rather than the <li> tag. You mentioned you want it on the <li> tag, so you'd move the $class variable from the <a> tag to the <li> tag (which is just 3 characters before it). 2. Since you want the class name to be "current", you'd replace the "on_page" and "on_parent" class names hard coded in there to be "current". 1 Link to comment Share on other sites More sharing options...
apeisa Posted July 13, 2011 Share Posted July 13, 2011 Thanks for the replies. I think I should illustrate more clearly what I'm trying to do. Now that I looked your example I am pretty sure this is what you want (I also edited my previous example a little): <?php foreach($pages->find("parent=/illustration, sort=sort") as $p) { if ($page->parents->has($p)) { $class = 'current'; } else { $class = ''; } echo "<li class='$class'><a href='{$p->url}'>{$p->title}</a></li>"; } 1 Link to comment Share on other sites More sharing options...
Marty Walker Posted July 14, 2011 Author Share Posted July 14, 2011 Thanks for you help and time. It's nearly there except for when I'm on the main Advertising 'list' page. I'm a php ubernoob and I don't understand that code enough. In EE or textpattern this kind of navigation highlighting would take me 2 seconds (with sections and url_segments). I think I'll just hard code it and write a load of CSS. Thanks again. Link to comment Share on other sites More sharing options...
apeisa Posted July 14, 2011 Share Posted July 14, 2011 I forget to check if it is current page. Just add || $p === $page to your if clause and it should work as expected: <?php foreach($pages->find("parent=/illustration, sort=sort") as $p) { if ($page->parents->has($p) || $p === $page) { $class = 'current'; } else { $class = ''; } echo "<li class='$class'><a href='{$p->url}'>{$p->title}</a></li>"; } I know that coding navigation is not the easiest job in the world if you are not experienced coder. I think we should have some more code snippets shipped with demo site or some kind of code snippets area on website. Or FAQ or Wiki... 3 Link to comment Share on other sites More sharing options...
Marty Walker Posted July 14, 2011 Author Share Posted July 14, 2011 Sir, you are a gentleman. Thank you. I would not have worked that out. Regards Martin 1 Link to comment Share on other sites More sharing options...
apeisa Posted July 14, 2011 Share Posted July 14, 2011 Martin: thanks and glad that I could help. slkrwrm: I splitted your question to new topic: http://processwire.com/talk/index.php/topic,335.0.html 1 Link to comment Share on other sites More sharing options...
einsteinsboi Posted March 31, 2014 Share Posted March 31, 2014 This thread just helped me work out a pesky nav problem I was having on a site. Thank you all!! 2 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now