I’ve been looking for a similar solution. Here’s some food for thought:
The menu-item-ID corresponds to $wpdb->postmeta.post_id in the WordPress database.
If you have a menu item which corresponds to a post_type="page" in $wpdb->posts, then you could look up the corresponding menu-item-ID for that page’s menu item by first finding the $wpdb->posts.ID for that page. Then you’d get the menu-item-ID for that page via the following query:
$wpdb->get_var( 'SELECT post_id FROM '.$wpdb->postmeta.' WHERE meta_key="_menu_item_object_id" AND meta_value="'.$post_id.'"' )
Here’s an example of the above in some code I’m currently working on:
global $wpdb;
$main_menu = array( 'Home', 'About', 'Blog', 'Resources', 'Contact' );
foreach( $main_menu as $post_title ){
$post_id = $wpdb->get_var( 'SELECT ID FROM '.$wpdb->posts.' WHERE post_title="'.$post_title.'" AND post_type="page" AND post_status="publish"' );
$$post_title = $wpdb->get_var( 'SELECT post_id FROM '.$wpdb->postmeta.' WHERE meta_key="_menu_item_object_id" AND meta_value="'.$post_id.'"' );
}
The above code results in $Home, $About, etc. being assigned the menu-item-IDs for those pages. Therefore, I’m able to address those menu items via CSS selectors like these:
li.menu-item-<?php echo $Home ?>{}
li.menu-item-<?php echo $About ?>{}
Notes:
- I’m currently using the above method with a theme which uses only one instance of
wp_nav_menu(). I’m guessing you would retrieve multiple menu-item-IDs if you had the same page in multiple occurrences of wp_nav_menu(). Therefore, you’d need to add some logic which would grab the proper menu-item-ID for the menu you want to address via jQuery, CSS, etc.
- You could improve upon my above code by dynamically generating
$main_menu.
