Create a default parents for children pages that have the same parent in the menu

Here’s my problem:

I’m building a website and my goal is to create a nice menu that will interact with the pages. So far so good, except for one problem.

The structure of my menu is something like that:

1.main-page
2.about-page
2.programs-page
2.1. vancouver-campus
2.1.1. health-care
2.1.2. massage-care
2.2. toronto-campus
3. locations
3.1. vancouver-campus
3.2. toronto-campus
4. admission

and so on.

As you can see toronto-campus and vancouver-campus are children of respectively locations and programs-page. This is not the problem except for a fact. The interaction with the menu.

I create this script to add a current class to parents and the ancestors of an item, so, when I’m on a children page, the parent page will get the class and I can add an effect with CSS to them:

function menu_item_classes( $classes, $item, $args, $depth ) {

$classes[] = ‘dropdown’;

if (in_array(‘current-page-ancestor’, $classes) || in_array(‘current-menu-item’, $classes) ){
$classes[] = ‘current’;
}

return $classes;
}
add_filter( ‘nav_menu_css_class’, ‘menu_item_classes’, 10, 4 );

The problem is that, if I add those properties to the current element:

.main-menu > .current > a {
font-family: ‘Daxline Medium’;
border-bottom: 3px solid #e41e32;
border-radius: 0;
}
.menu-item.current > a {
font-family: ‘Daxline Medium’;
}
.main-menu > .current-page-ancestor > a {
font-family: ‘Daxline Medium’;
}
.main-menu > .current-menu-parent > a {
font-family: ‘Daxline Medium’;
border-bottom: 3px solid #e41e32;
border-radius: 0;
}
.main-menu > .current-menu-ancestor > a {
font-family: ‘Daxline Medium’;
border-bottom: 3px solid #e41e32;
border-radius: 0;
}

and if I’m on these very pages (ottawa-campus and toronto-campus), both of their parents (locations and programs-page) will get the effect.

Now, I can create two different pages with the same content as children to their parents, but I’m looking for something different, like a default value to the page (default parents ONLY for those pages). And I’m wondering if it is possible of course. Does anyone have this problem before?

Read more here:: Create a default parents for children pages that have the same parent in the menu

Leave a Reply

Your email address will not be published. Required fields are marked *