Viewing 23 posts - 1 through 23 (of 23 total)
  • Author
    Posts
  • #323910

    I have a single front page with a nav menu pointing to different sections on the same page. Something is applying both a .current_page_item and a .current-menu-item class to the first and fifth menu items, respectively. Enfold has the same style for both classes, so it’s showing the current page style on two different menu items.

    When I scroll down the page, the .current_page_item stays on the first menu item, and so does the ‘current’ style, while the .current-menu-item moves to the next (sixth) menu item, along with the style again, but no further.

    Is there a way to have Enfold only apply one of the ‘current’ classes (.current-menu-item seems to be the only one that moves with scrolling, so that one), and maybe reset Enfold’s automatic application of .current-menu-item so that it’s applied to the correct menu item from the start?

    #324533

    Hey dmoz!

    You can add following code to Quick CSS in Enfold theme options under General Styling tab no to highlight home menu item

    li#menu-item-5.current_page_item a {
    color: #8C8C8C;
    }

    Best regards,
    Yigit

    #324602

    Thanks for the reply, but that wasn’t my question. The menu items are already styled (see my original post above).

    Anyone have an idea pertaining to the question?

    • This reply was modified 6 years, 1 month ago by  dmoz.
    #325712

    I tried the solution from this post: https://kriesi.at/support/topic/current-menu-item-problem/ and it fixed the duplicate current-page highlight, but now the highlight doesn’t show accurately with where I am on the page. It highlights the section once I’m at the bottom of it, and skips one of the sections altogether. Any ideas?

    #326966

    Hi!

    Sorry for the delay.

    I’m not sure why it’s not working as it should. Can you please switch the advance layout builder to debug mode? Refer to this link: http://kriesi.at/documentation/enfold/enable-advanced-layout-builder-debug/

    Copy the shortcode below then place it on pastebin.com. We would like to test it on our installation.

    Cheers!
    Ismael

    #327021

    Hey Ismael,

    Thanks for the reply. Here’s the pastebin with the shortcodes: http://pastebin.com/PCS2yVDW

    Interested to know what you discover. Thanks!

    #328737

    Hey!

    I tested the template on my install and copied your layout as close as possible. The current-menu-item is working as it should. Did you add any modifications on the child theme? Please post the login details here. We would like to check it. If possible, please update the theme to Enfold 3.0.

    Best regards,
    Ismael

    #329109
    This reply has been marked as private.
    #331129

    Hey!

    This code will help so that only one of the current menu item is highlighted:

    .header_color .av-subnav-menu a:hover, .header_color .main_menu ul:first-child > li a:hover, .header_color .main_menu ul:first-child > li.current-menu-item > a, .header_color .main_menu > li.current_page_item > a, .header_color .main_menu ul:first-child > li.active-parent-item > a {
    color: #ffffff !important;
    }
    
    .header_color .av-subnav-menu a:hover, .header_color .main_menu ul:first-child > li a:hover, .header_color .main_menu ul:first-child > li.current-menu-item > a, .header_color .main_menu ul:first-child > li.current_page_item > a, .header_color .main_menu ul:first-child > li.active-parent-item > a {
    color: #8C8C8C; 
    }

    For the highlighting which is a bit off, you can check this post: https://kriesi.at/support/topic/anchor-link-causing-navigation-bar-to-highlight-the-wrong-link/

    Regards,
    Andy

    • This reply was modified 6 years ago by  Andy.
    #331791

    Hi Andy,

    That CSS worked, thanks.

    The other post you sent to fix the inaccurate highlighting doesn’t actually come to a solution. Do you think there will be a fix for this soon?

    #333494

    Hi,

    Can you please create us an administrator account (tempadmin didn’t work)? post it here as a private reply.

    Regards,
    Josue

    #334000
    This reply has been marked as private.
    #335733

    Hey!

    I am afraid I am pretty sure that the wrong scrolling offset is caused by one of the modifications made. Unfortunately there are quite a few and I didnt want to mess around with the site but I guess anything that modifies either the height of a header element or changes the top padding of header or main container might cause this.

    If you can somehow filter if and which of the css modifications causes this I might be able to come up with a solution :)

    Cheers!
    Kriesi

    #335752

    Hey Kriesi,

    Thanks for looking into it!

    If I get rid of my custom spacing/padding/margins, how would I go about achieving the layout that I have and have everything work correctly?

    #335761

    Hi!

    Truth to be told, I would prefer it anyway to make the theme flexible enough so you can use all your custom css. But since I dont know which property is causing the problem I dont know where to start fixing :)

    So if you can find out which customization is causing the issue I can try to add some modifications to the theme that allows our customers to use a modification like that.

    In the end all I need you to do is remove the customizations step by step until we know which one is causing this. After we know that feel free to re apply all customizations and I will try to come up with a solution ;)

    Regards,
    Kriesi

    #335765

    I removed all custom css that was affecting the header, nav, content padding, etc, but the highlighting is still off. It starts okay at the first section, but gets successively worse with each one.

    Ideally, I wouldn’t need to add any custom css and would be able to modify the spacing on all elements (including the menu within the header). Enfold allows me to change the header height, but not where the menu sits within it (ie. it’s always right at the bottom no matter the header height).

    • This reply was modified 6 years ago by  dmoz.
    #335770

    Hi!

    Ok this is weird. is it also happening when you remove completely remove the custom css?

    Regards,
    Kriesi

    #335776

    I removed any custom css that affected the header, nav, or main content area with top or bottom padding or margin.

    The only custom css that is still in there is only affecting colors, etc. I tried removing all custom css as well, but the scrolling is still off. Check the page now (without any custom css) and you’ll see what I mean: http://ianrigby.com

    #336400

    Hi!

    Took some work but I think I found the issue after importing your whole demo to a local installation and doing some trial and error tests. Seems the latest update of the portfolio sorting script was not working as intended. We will fix that with the next update which should arrive during the next few days ;)

    Regards,
    Kriesi

    #336427

    Awesome, you guys are great! I really appreciate your time and support with this. Keep up the great work!

    I look forward to the update, and will report back either way if the issue is resolved or not.

    • This reply was modified 6 years ago by  dmoz.
    #336758

    k. Update will arrive later today or early tomorrow ;)

    #337556

    Are updates usually posted first on your website or on codecanyon? Or via the theme update on the options page? Haven’t seen anything yet.

    #337807

    Hi!

    Yes, you will be notified on the theme updates panel once a new patch is available. Usually takes a few hours, If possible, try logging in and out. You can also check Enfold’s change log or overview page on themeforest. Another user reported the same issue, it seems like the layer slider is causing the issue: https://kriesi.at/support/topic/main-menu-in-page-navigation-selected-item-not-working-properly/

    Regards,
    Ismael

Viewing 23 posts - 1 through 23 (of 23 total)

The topic ‘Single page nav menu multiple items highlighted .current-menu-item’ is closed to new replies.