Feature: Make submenu selector configurable

[mrwweb]

Right now, the script will select any nested <ul> and treat it as a submenu. It would be good to allow passing a custom selector for cases where that might not be the desired behavior.

[janekkrause]

I'm not much a coder but I found this jQuery a possible solution. Basically its adding a class to every ul and li item in the click-menu div. You can then target a specific level class for instance in my case I targeted parent-2 because I didnt want it to effect nested elements. "menu.querySelectorAll('.parent-2').forEach( ( submenu ) => {"

`function addLevelClass($parent, level) { // add a parent class to the ul $parent.addClass('parent-'+level); // fetch all the li's that are direct children of the ul var $children = $parent.children('li'); // add a child class to the li $children.addClass('child-'+level); // loop trough each li $children.each(function() { // get the ul that is a direct child of the li var $sublist = jQuery(this).children('ul'); // if an ul was found if ($sublist.length > 0) { // add a class to the current li indicating there is a sub list jQuery(this).addClass('has-sublist'); // repeat the process for the sublist, but with the level one higher // = recursive function call addLevelClass($sublist, level+1); } }); }

// call the function to add level classes on the upper most ul addLevelClass(jQuery('.clicky-menu'), 1);`

[mrwweb]

@janekkrause @ajplopez @rougerose @zsuffad Thanks for the thumbs ups on this issue!

I'm happy to let you know that you can now set clicky-submenu-selector data attribute on the menu list to set a custom submenu selector.

For example, if you only want to select the first level of nested <ul> elements while building a megamenu, you would do:

<ul class="clicky-menu" data-clicky-submenu-selector=".clicky-menu > li > ul">
    <!-- menu items -->
</ul>

I hope this works great for you all! If it doesn't meet your needs, please open a new issue.