Left side menu won’t stop highlighting sub menu.

Resolved

Requested: 5 years and 9 months ago

I use the Judgment Pro theme. It came with Advanced Sidebar Menu but I just upgraded to the Pro version.

My website (frangos-legal.com) has a webpage called “Estate Planning” as a practice area. I made another page called “Estate Plan Packages” and made it a sub menu item under the “estate planning” page.

The problem is, no matter what I do, the menu on the left always keeps the sub menu of “Estate Plan Packages” highlighted as if the page is selected. So for instance, if I go to a different practice area such as “Family Law”, the “Family Law” button on the left side menu highlights as the selected page but so does the estate planning and estate plan packages. So all three are highlighted as if they are all three active pages.

Hope that makes sense? No sure what to do, and am a very new WP user.

Thank you for your help.

OnPoint Plugins

5 years and 9 months ago

Hi Dave,

I took a look at your site and everything appears to be working now? If not, could you please send me some links to pages where I may see the issue?

Have a great day!

Mat Lipe
dcf

5 years and 9 months ago

I selected to not show the sub menu on the menu list. I can change it back real quick if you want to take a look.

Right now it just shows “Estate Planning” and no sub menu under that link.
dcf

5 years and 9 months ago

Try this link;

https://www.frangos-legal.com/practice-areas/family-unit-law/
OnPoint Plugins

5 years and 9 months ago

Hi Dave,

I see what you mean. The Grandchild pages have the same background as the current page.

If you add the following CSS to your site it will style the grandchild pages to look like they are not the active ones

.advanced-sidebar-menu ul ul.children li a { border-bottom: 1px solid #eee; border-left: 1px solid #eee; border-right: 1px solid #eee; background: white; color: #111; } .advanced-sidebar-menu ul ul.children { background: white; border-top: 1px solid #eee; }

Please give that a try.

Have a great day!

Mat Lipe
dcf

5 years and 9 months ago

That worked. Thank you. I still turned it off in the menu, don’t like the way it shows. Is there anyway to make it “grow” when moused over to show the child page? Otherwise it looks to “outliney” to me.

Thanks again!
OnPoint Plugins

5 years and 9 months ago

Hi Dave,

If you enable accordions on the menu and add the following custom JavaScript to your site, the grandchild items will open when you hover over their parent.

jQuery(function ($) { setTimeout(function () { for (var $widget_id in asm_pro.accordion._enabled_accordions) { var el = $(document.getElementById($widget_id)) if (asm_pro.accordion._enabled_accordions[$widget_id]['include_parent']) { parents = el.find('> ul > li .has_children').has('ul'); } else { parents = el.find('ul .has_children').has('ul'); } parents.each(function () { var _parent_menu = $(this); _parent_menu.on('hover', function (ev) { var icon = $(this).find('> span'); icon.data('state', 'expand'); asm_pro.accordion._expand_sub_menu($(this), icon ); }); _parent_menu.on('mouseleave', function() { var icon = $(this).find('> span'); icon.data('state', 'contract'); asm_pro.accordion._expand_sub_menu($(this), icon ); }); }); } }, 1000); });
dcf

5 years and 9 months ago

I added this code to “additional CSS” not sure if that is where you put additional java script? That may be beyond my capabilities.
OnPoint Plugins

5 years and 9 months ago

Hi Dave,

If you theme does not have an option to enter in custom JavaScript you may install a plugin which lets you do this.

Otherwise if you add the following code to your active theme’s functions.php file, it will work the same way.

<?php add_action( 'wp_head', 'hover_accordions' ); function hover_accordions(){ ?> .advanced-sidebar-menu .dashicons { visibility: hidden !important; } jQuery(function ($) { setTimeout(function () { for (var $widget_id in asm_pro.accordion._enabled_accordions) { var el = $(document.getElementById($widget_id)) if (asm_pro.accordion._enabled_accordions[$widget_id]['include_parent']) { parents = el.find('> ul > li .has_children').has('ul'); } else { parents = el.find('ul .has_children').has('ul'); } parents.each(function () { var _parent_menu = $(this); _parent_menu.on('hover', function (ev) { var icon = $(this).find('> span'); icon.data('state', 'expand'); asm_pro.accordion._expand_sub_menu($(this), icon ); }); _parent_menu.on('mouseleave', function() { var icon = $(this).find('> span'); icon.data('state', 'contract'); asm_pro.accordion._expand_sub_menu($(this), icon ); }); }); } }, 1000); }); <?php }

Have a great night!

Mat Lipe

New Response Cancel reply

You must be logged in to respond. Only PRO members are allowed to respond to support requests.