Tutorial and solution.
For a long time i have been trying to get the autonav to have nav selected (the current page) different colour - rather than just a gery outline.
Also it would be nice if when your on a sub page it highlited the relevent parent so you know what nav path you are in.
see demo -
http://www.test.ecomatt.com
There are a number of posts on this topic but non of them really worked. as the view.php script and any modifications that iv seen took into consideration that the Home page by default is the parent to all pages - thus always being highlighted if you wanted the nav path to be highlighted.
solution: edit the view.php and the template > header-nav.php to allow nav-selected and nav-path-selected but negate (ignore) the home page unless it is the current selected. This solved the issue of the home page always being highlighted when on any other page.
the code:
with thanks to my colleague Russ Curgenven for helping with this.
edit the view.php
here is the full php code
<?php
defined('C5_EXECUTE') or die(_("Access Denied."));
$aBlocks = $controller->generateNav();
$c = Page::getCurrentPage();
$containsPages = false;
$nh = Loader::helper('navigation');
//this will create an array of parent cIDs
$inspectC=$c;
$selectedPathCIDs=array( $inspectC->getCollectionID() );
$parentCIDnotZero=true;
while($parentCIDnotZero){
$cParentID=$inspectC->cParentID;
if(!intval($cParentID)){
$parentCIDnotZero=false;
}else{<?php
defined('C5_EXECUTE') or die(_("Access Denied."));
$aBlocks = $controller->generateNav();
$c = Page::getCurrentPage();
$containsPages = false;
$nh = Loader::helper('navigation');
//this will create an array of parent cIDs
$inspectC=$c;
$selectedPathCIDs=array( $inspectC->getCollectionID() );
$parentCIDnotZero=true;
while($parentCIDnotZero){
$cParentID=$inspectC->cParentID;
if(!intval($cParentID)){
$parentCIDnotZero=false;
}else{
$selectedPathCIDs[]=$cParentID;
$inspectC=Page::getById($cParentID);
}
}
foreach($aBlocks as $ni) {
$_c = $ni->getCollectionObject();
if (!$_c->getCollectionAttributeValue('exclude_nav')) {
if (!$containsPages) {
// this is the first time we've entered the loop so we print out the UL tag
echo("<ul class=\"nav\">");
}
$containsPages = true;
$thisLevel = $ni->getLevel();
if ($thisLevel > $lastLevel) {
echo("<ul>");
} else if ($thisLevel < $lastLevel) {
for ($j = $thisLevel; $j < $lastLevel; $j++) {
if ($lastLevel - $j > 1) {
echo("</li></ul>");
} else {
echo("</li></ul></li>");
}
}
} else if ($i > 0) {
echo("</li>");
}
$pageLink = false;
if ($_c->getCollectionAttributeValue('replace_link_with_first_in_nav')) {
$subPage = $_c->getFirstChild();
if ($subPage instanceof Page) {
$pageLink = $nh->getLinkToCollection($subPage);
}
}
if (!$pageLink) {
$pageLink = $ni->getURL();
}
// this is the new function that allows nav-selected as well as nav-path-selected
if ($ni->isActive($c) || ($c->getCollectionID() == $_c->getCollectionID())) {
echo('<li class="nav-selected nav-path-selected"><a class="nav-selected nav-path-selected" href="' . $pageLink . '">' . $ni->getName() . '</a>');
} elseif ( in_array($_c->getCollectionID(),$selectedPathCIDs) && $_c->getCollectionID() != 1 ) {
echo('<li class="nav-path-selected"><a class="nav-path-selected" href="' . $pageLink . '">' . $ni->getName() . '</a>');
} else {
echo('<li><a href="' . $pageLink . '">' . $ni->getName() . '</a>');
}
$lastLevel = $thisLevel;
$i++;
}
}
$thisLevel = 0;
if ($containsPages) {
for ($i = $thisLevel; $i <= $lastLevel; $i++) {
echo("</li></ul>");
}
}
?>
you will then need to edit the css of your theme to get your desired selected and nav path selected colour eg
.nav-path-selected{
color:#fa8f04 !important;
}
and somthing like
#page #central #sidebar ul.nav a.nav-selected {font-weight: bold; color: #fa2516 !important;}
if you want the active page to be a different colour to your nav path highlited pages.
now the header_menu.php
i have added a couples of things in this one to get it working such as adding the array of parent cIDs so just copy past the whole code.
<?php
defined('C5_EXECUTE') or die(_("Access Denied."));
$aBlocks = $controller->generateNav();
$c = Page::getCurrentPage();
echo("<ul class=\"nav-header\">");
$nh = Loader::helper('navigation');
//this will create an array of parent cIDs
$inspectC=$c;
$selectedPathCIDs=array( $inspectC->getCollectionID() );
$parentCIDnotZero=true;
while($parentCIDnotZero){
$cParentID=$inspectC->cParentID;
if(!intval($cParentID)){
$parentCIDnotZero=false;
}else{<?php
defined('C5_EXECUTE') or die(_("Access Denied."));
$aBlocks = $controller->generateNav();
$c = Page::getCurrentPage();
echo("<ul class=\"nav-header\">");
$nh = Loader::helper('navigation');
//this will create an array of parent cIDs
$inspectC=$c;
$selectedPathCIDs=array( $inspectC->getCollectionID() );
$parentCIDnotZero=true;
while($parentCIDnotZero){
$cParentID=$inspectC->cParentID;
if(!intval($cParentID)){
$parentCIDnotZero=false;
}else{
$selectedPathCIDs[]=$cParentID;
$inspectC=Page::getById($cParentID);
}
}
$isFirst = true;
foreach($aBlocks as $ni) {
$_c = $ni->getCollectionObject();
if (!$_c->getCollectionAttributeValue('exclude_nav')) {
if ($ni->isActive($c) || strpos($c->getCollectionPath(), $_c->getCollectionPath()) === 0) {
$navSelected='nav-selected';
} else {
$navSelected = '';
}
$pageLink = false;
if ($_c->getCollectionAttributeValue('replace_link_with_first_in_nav')) {
$subPage = $_c->getFirstChild();
if ($subPage instanceof Page) {
$pageLink = $nh->getLinkToCollection($subPage);
}
}
if (!$pageLink) {
$pageLink = $ni->getURL();
}
if ($isFirst) $isFirstClass = 'first';
else $isFirstClass = '';
echo '<li class="'.$navSelected.' '.$isFirstClass.'">';
//print "{".$selectedPathCIDs."}";
if ($ni->isActive($c) || ($c->getCollectionID() == $_c->getCollectionID())) {
echo('<li class="nav-selected nav-path-selected"><a class="nav-selected" href="' . $pageLink . '">' . $ni->getName() . '</a>');
}
elseif ( in_array($_c->getCollectionID(),$selectedPathCIDs) && $_c->getCollectionID() != 1 ) {
//print "2";
echo('<li class="nav-path-selected"><a class="nav-path-selected" href="' . $pageLink . '">' . $ni->getName() . '</a>');
}
else {
echo('<li class="nav-path-selected"><a href="' . $pageLink . '">' . $ni->getName() . '</a>');
}
//print $ni->getName();
echo('</li>');
$isFirst = false;
}
}
echo('</ul>');
echo('<div class="ccm-spacer"> </div>');
?>
and so this is your themes css to get the highlited coloring. best make it the same as the sidebar colour for consistancy.
#page #header ul.nav-header li.nav-selected a { color:#fa2516 !important;}
finally just to say this works and is the only solution so far iv seen that does, if you have easier and cleaner ways of achieving this then please post them here.
also why is this not an option in the auto nav by default? its something that nearly every client of mine has asked for.
i hope you find this helpfull.
let me know if you have any problems.
And if someone can post instruction on adding the css to the auto nav template folders so that users dont need to edit the main theme css that would be nice.
Regards
Matthew
PS make a copy of your autonav block and place in root/blocks/autonav so as not to edit the original block which is located root/concrete/blocks/autonav
