2 times drop down menu in left side bar menu

Hi,
I believe that I have found a solution to change the sidebar header menu to have multiple dropdowns like the burger menu,

for example this is the first dropdown after a click:

this is the second level after click:

please note that both the “first level” and “second level” menu items are not links to pages, so a click will open the sub-menu:

Try adding this code to the end of your child theme functions.php file in Appearance ▸ Editor:

function change_sidebar_menu_to_burger_menu_dropdown() { ?>
  <script>
document.addEventListener("DOMContentLoaded", function() {
    var screenWidth = window.innerWidth;
    if (screenWidth >= 768) {
        if (document.documentElement.classList.contains("html_header_sidebar")) {
            const aviaMenu = document.getElementById("avia-menu");
            if (aviaMenu) {
                aviaMenu.id = "av-burger-menu-ul";
                aviaMenu.classList.remove("av-main-nav");
                aviaMenu.classList.remove("menu");
            }
            const menuItems = document.querySelectorAll("#av-burger-menu-ul .menu-item");

            menuItems.forEach(function(item) {
                item.classList.add("av-active-burger-items");
                item.classList.remove("menu-item");
            });
            const menuItemsWithChildren = document.querySelectorAll("#av-burger-menu-ul .menu-item-has-children");

            menuItemsWithChildren.forEach(function(item) {
                item.classList.add("av-width-submenu");
                //item.classList.remove("menu-item-has-children");

                const dropdownAva = item.querySelector(".menu-item-has-children.av-width-submenu .avia-menu-text");
                if (dropdownAva) {
                    const dropdownAvailable = document.createElement("span");
                    dropdownAvailable.classList.add("dropdown_available");
                    dropdownAva.insertAdjacentElement('afterend', dropdownAvailable);
                }
                const dropdownSpan = item.querySelector(".menu-item-has-children.av-width-submenu .dropdown_available");
                if (dropdownSpan) {
                    const submenuIndicator = document.createElement("span");
                    submenuIndicator.classList.add("av-submenu-indicator");
                    dropdownSpan.insertAdjacentElement('afterend', submenuIndicator);
                }
            });

            const style = document.createElement('style');
            style.innerHTML = `
                #top #av-burger-menu-ul {
                    width: 300px;
                    padding: 0px 30px;
                }
                .main_menu ul:first-child>li a {
                    height: 50px;
                    line-height: 50px;
                }
            `;
            document.head.appendChild(style);
        }
    }
});
</script>
  <?php
}
add_action( 'wp_footer', 'change_sidebar_menu_to_burger_menu_dropdown', 99 );

Please disable any previous snippets from this thread.

Best regards,
Mike

Hi,
Glad to hear that you have this sorted out, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

Best regards,
Mike