How To Add Drop-down Menu Indicator In WordPress

Share Now

Share on facebook
Share on pinterest
Share on twitter
Share on linkedin
Share on email

Add this code in the functions.php file

//MENU DROPDOWN INDICATOR
// add arrows to menu parent 
function theme_name_add_menu_parent_class( $items ) {
 
 $parents = array();
 foreach ( $items as $item ) {
 if ( $item->menu_item_parent && $item->menu_item_parent > 0 ) {
 $parents[] = $item->menu_item_parent;
 }
 }
 
 foreach ( $items as $item ) {
 if ( in_array( $item->ID, $parents ) ) {
 $item->classes[] = 'has-children';
 }
 }
 
 return $items;
}
add_filter( 'wp_nav_menu_objects', 'theme_name_add_menu_parent_class' );

### Now add this on CSS code

/*
MENU DROPDOWN INDICATOR
*/
.menu li.has-children > a:after {
 color: #fff;
 content: '  ▼';
 font-size: 10px;
 vertical-align: 1px;
}
Nahid Mahamud

Nahid Mahamud

Web Developer | Graphic Designer | WordPress & Woo-commerce Expert