Menu: Hover dropdowns + parent links + mobile friendly


the following pieces of code change the default behaviour of the Customizr theme menu :

1 displays the dropdown items on hover instead of click

2 enables the click on a parent menu item

It is composed of two parts that work together : a css snippet and a php snippet.


Where to copy/paste this code? For the CSS, the simpliest way is to use the Custom CSS section of the customizer option screen. For the PHP part, copy the code in your functions.php file. It is strongly recommended to create a child theme. Everything you need to know about child theme with Customizr here.


Demo: This mod doesn’t affect the menu color, it will change according to your selected Customizr skin.

Put this in your child theme’s CSS (custom CSS panel or style.css):

Add this in your child theme’s functions.php:

Note: functions.php and style.css are the only files in a child theme that SHOULD NOT BE modified copies of their parent theme counterparts. If unsure, please read about how to create a child theme.

50 thoughts on “Menu: Hover dropdowns + parent links + mobile friendly”

Comments are closed.