How to add a custom HTML class name to admin screen submenu items?
You can do a str_replace on the html which will happen before the page has loaded:
Just need to work out the selectors or then parse it with DOMDocument
function callback($buffer) { $buffer = str_replace('wp-first-item', 'wp-first-item my-custom-class', $buffer); return $buffer;}function buffer_start() { ob_start("callback"); }function buffer_end() { ob_end_flush(); }add_action('admin_head', 'buffer_start');add_action('admin_footer', 'buffer_end');
We can actually do it with a simple plugin like this one:
<?php/** Plugin Name: Custom Admin Submenu CSS Class **/add_action( 'admin_menu', function() use ( &$submenu ){ $class = 'my-class'; // Edit to your needs! if( ! isset( $submenu['edit.php'][5] ) ) return; if( ! empty( $submenu['edit.php'][5][4] ) ) // Append if css class exists $submenu['edit.php'][5][4] .= ' ' . $class; else $submenu['edit.php'][5][4] = $class;} );
We constructed it this way by spotting out this this part of the _wp_menu_output()
core function:
if ( ! empty( $sub_item[4] ) ) { $class[] = esc_attr( $sub_item[4] );}
Here's how the modified HTML looks like:
<ul class='wp-submenu wp-submenu-wrap'> <li class='wp-submenu-head' aria-hidden='true'>Posts</li> <li class="wp-first-item current my-class"> <a href='edit.php' class="wp-first-item current my-class">All Posts</a> </li> <li> <a href='post-new.php'>Add New</a> </li> <li> <a href='edit-tags.php?taxonomy=category'>Categories</a> </li> <li> <a href='edit-tags.php?taxonomy=post_tag'>Tags</a> </li></ul>
where the custom css class is added to both the <li>
tag and the <a>
tag.
In general I don't like modifying a global variable, but there doesn't seems to be a workaround to add the class to the submenu via add_submenu_page()
or other explicit filters.
If you want to modify the css classes for the first level items (menu), you can e.g. look into the add_menu_classes
filter.
If you feel strongly that the css classes for the submenus should be directly adjustable via a filter, then you can create a trac ticket, explain in detail why this is needed and e.g. suggest a new add_submenu_classes
filter.
I hope it helps!
This should do it:
function add_admin_class() { $find = '.wp-submenu li'; $add_class = 'my-custom-class'; echo '"<script type="text/javascript"> jQuery(function() { jQuery("' . $find . '").addClass("' . $add_class . '"); }); </script>"';}add_action('admin_footer', 'add_admin_class');