Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
  • #1037419

    I would like for the active submenu to work the same as the main menu with the line under the link when I’ve selected that section (and the text in red if possible). I’ve tried every way possible in the forum. Not sure if the css is wrong because I’m working with the child theme, or because it is anchor text? I’m using the enfold theme

    Thanks for you help with this.


    Hey tonyaleigh,

    What CSS have u added? It should be working for all the menus – I just tested on my web site.
    Can u show us what u are using?

    Best regards,

    This reply has been marked as private.


    Thank you for sharing the code, I’m unable to verify if this works.

    Please refer to the documentation which will guide you how to highlight the menu items.

    Remove the previous code before adding new code to achieve the same result as it may cause a conflict.

    You also need to clear the cache to view the changes.

    Best regards,


    I deleted anything that would effect the submenu. Once the submenu is selected, I want the red line to be below the text and the text to be red. What you sent me back is an empty box. Not sure why.

    This reply has been marked as private.


    I would like to apologize for the late response. This css code should add an active menu indicator to the sub menu like in the main menu.

    #top .av-subnav-menu > li.current-menu-item a {
        border-bottom: 1px solid #911a20;

    Use this one if you want to place the indicator at the very bottom.

    #top .av-subnav-menu > li.current-menu-item {
        border-bottom: 1px solid #911a20;

    Best regards,


    It didn’t work. Yes it added the red line where I want it but doesn’t work when you click on any of the other anchor tag links.



    Thanks for the update. This script should help.

    add_action('wp_footer', 'avf_add_sub_menu_script');
    function avf_add_sub_menu_script(){
    <script type="text/javascript">
    (function($) {
        var menu = document.getElementById("menu-events-sub-menu");
        var current = menu.querySelector(".current-menu-item");
        var items = menu.getElementsByClassName("menu-item");
        for (var i = 0; i < items.length; i++) {
        items[i].addEventListener("click", function() {
            var current = document.getElementsByClassName("current-menu-item");
            current[0].className = current[0].className.replace(" current-menu-item", "");
            this.className += " current-menu-item";

    Just add it in the functions.php file and then remove the browser cache prior to testing the page.

    Best regards,


    I would like to have a main menu with two submenus as follows:

    – Leadership
    – News

    All of these would be on the SAME PAGE, but I can’t figure out how to set up the menu so that all three would go to the that single page and the submenus would point to the anchor tags on the page.

    Can you send me instructions?



    You have to use the absolute or the complete url instead of just adding the anchors. Example:

    Best regards,

Viewing 11 posts - 1 through 11 (of 11 total)
  • You must be logged in to reply to this topic.