I have a post type which displays a menu in a sidebar. When the user is on a page that has children, the corresponding parent menu item expands. But when on a child page, the parent's menu item is collapsed.
I want to make the parent expand when one of its children is active. Can anyone point out the mechanic in Beans which governs when a menu item with children expands?
Here's a screenshot: https://www.dropbox.com/s/99qhhetadtmltw6/expand-parent.jpg?dl=0
It looks more like a CSS/UiKIT solution. I'm not familliar with UiKIT, but you can try this CSS code:
.myuniqueclass .current-menu-parent > .uk-dropdown {
display: block;
}.myuniqueclass - your unique sidebar navigation class or id.
.current-menu-parent - the active parent menu Enterprise Solution.
> .uk-dropdown - target the dropdown inside Enterprise Solution.
display: block; - Make the dropdown visible.
Note: If you want to target specific devices to make it visible, you should wrap the code inside media queries with the screen size you want.
// For example, display on screens with less than 500px.
@media only screen and (max-width: 500px) {
.myuniqueclass .current-menu-parent > .uk-dropdown {
display: block;
}
}UPDATED! It is reccomended to add an unique class for your sidebar navigation, so your code won't affect other navigations.
Thanks for the feedback, Jo. You're right, it's more UIKit, less Beans.
There's more going on here than styling — some of the markup is being generated by UIKit in JS. I think what I'll do is use a walker.
Someone else built a similar walker as part of a WP theme. Good example for UIKit menus — it can be found here: https://github.com/zslabs/basey-theme/blob/master/inc/menus.php.