Drop down menu in conent section

Hey Sebastian,
Thanks for your question, try adding this code to the end of your child theme functions.php file in Appearance ▸ Editor:

function print_menu_shortcode($atts, $content = null) {
extract(shortcode_atts(array( 'name' => null, 'class' => null ), $atts));
return wp_nav_menu( array( 'menu' => $name, 'menu_class' => 'menu-shortcode', 'echo' => false ) );
}
add_shortcode('menu', 'print_menu_shortcode');

This will let you show a menu in your page content as a shortcode, if your menu name is test then the shortcode to show it would be:
[menu name="test"]
Add the shortcode to a code block element:
Then add this css:

.entry-content-wrapper ul.menu-shortcode,
.entry-content-wrapper .menu-shortcode li {
	list-style: none outside;
}
.menu-shortcode .sub-menu {
	height:0;
    opacity: 0;
    visibility: hidden;
	transition: all 0.5s ease 0s;
}
.menu-shortcode .menu-item-has-children:hover > .sub-menu {
	height: 100%;
    opacity: 1;
    visibility: visible;
   transition: all 0.5s ease 0s;
}

I added transition to the css to ease in and out the sub-menus so it was not so fast.
Click the image to see the gif play

https://img.savvyify.com/images/2023/01/28/Enfold_Support_216.gif

Best regards,
Mike

Hi,
You would need to use javascript to toggle the menu on click and it would be complicated to know if the click was to open a sub-menu item or go to the sub-menu url.
You should look for a menu plugin that will create this kind of menu and give you a shortcode to add to your pages.
I’m not sure what you mean by a protected area, you would need to explain in more detail.

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