How to Customize the WordPress Admin Menu: Adding, Removing, and Modifying Menu Items

The WordPress admin panel’s menu system is the central hub for managing your website. Customizing this menu, both the side menu (on the left), the top menu (at the top of the admin panel), and the secondary menu (positioned under the top menu), can significantly improve your workflow. In this comprehensive tutorial, we’ll explore how to add new items, remove existing ones, modify menu items, and choose specific positions in the WordPress side, top, and secondary menus, allowing you to tailor your WordPress dashboard precisely to your needs.

Before proceeding with any customizations in WordPress, it’s essential to set up a child theme. A child theme acts as a safe and efficient way to make modifications without affecting the parent theme. If you haven’t set up a child theme yet, follow this tutorial on How to Create a Child Theme for Customization. It will guide you through the process and ensure that your customizations remain intact even after theme updates.

Understanding the WordPress Admin Menu

The WordPress admin menu comprises three essential components: the side menu (on the left), the top menu (at the top of the admin panel), and the secondary menu (positioned under the top menu). The side menu provides access to various functionalities, while the top menu contains shortcuts, and the secondary menu offers additional options.

Access Your Theme’s Functions.php File and add Code Snippet

To customize menus, edit your theme’s functions.php file. You can access this file using an FTP client or through the WordPress theme editor. Adding a custom menu item to the side menu involves using add_menu_page(). Here’s how you can add a new item.

Adding Custom Side Menu Item

function add_custom_side_menu_item() {
	add_menu_page(
		'Custom Side Menu',   // Page Title
		'Custom Side Menu',   // Menu Title
		'edit_posts',         // Capability (users who can edit posts can access this menu)
		'custom-side-menu',   // Menu Slug
		'custom_side_menu_page', // Callback function to display content
		'dashicons-admin-custom', // Icon URL or Dashicon class (View Dashicons: https://developer.wordpress.org/resource/dashicons/)
		20 // Menu position (adjust this number to change the menu item's position)
	);
}
add_action( 'admin_menu', 'add_custom_side_menu_item' );

function custom_side_menu_page() {
	// Content for the custom side menu item
	echo '<div class="wrap"><h2>Custom Side Menu Item</h2><p>This is a custom side menu item content.</p></div>';
}
Code language: PHP (php)

Explanation:

  • add_menu_page() function adds a new top-level menu item to the WordPress admin menu.
  • 'Custom Side Menu' is the title displayed in the admin menu.
  • 'edit_posts' capability ensures that users who can edit posts have access to this menu item.
  • 'custom-side-menu' is a unique slug for this menu item, used in the URL and to identify the menu.
  • custom_side_menu_page is the callback function that displays content when this menu item is clicked.
  • 'dashicons-admin-custom' sets the menu item icon to a custom Dashicon. You can change this to other Dashicon classes. (View Dashicons: WordPress Dashicons)
  • 20 is the menu position. You can adjust this number to change the menu item’s position among other menu items. 20 is used here as an example position. The default menu position in WordPress is -1 if no position is specified, placing items at the bottom of the menu.

Removing Items from the Side Menu

In WordPress, simplifying the admin menu can enhance user experience. By removing unnecessary items from the side menu, you can streamline the navigation, making it more intuitive for users to find essential features and options.

function remove_side_menu_item() {
	remove_menu_page( 'edit.php' ); // Example: Remove the Posts menu item
}
add_action( 'admin_menu', 'remove_side_menu_item' );
Code language: PHP (php)

Explanation:

  • 'edit.php' is the default menu slug for Posts. Removing it simplifies the admin menu by eliminating the Posts menu item.

Adding Custom Top Menu Item

Adding a custom menu item to the top menu can be done using the admin_bar_menu action. Here’s how you can add a new top menu item:

function add_custom_top_menu_item() {
	global $wp_admin_bar;
	$wp_admin_bar->add_menu(
		array(
			'id'    => 'custom-top-menu',
			'title' => 'Custom Top Menu',
			'href'  => admin_url( 'admin.php?page=custom-top-menu' ), // Create a separate page with this slug
			'meta'  => array(
				'class' => 'custom-top-menu-item',
			),
		)
	);
}
add_action( 'admin_bar_menu', 'add_custom_top_menu_item' );

function custom_top_menu_page() {
	// Content for the custom top menu item
	echo '<div class="wrap"><h2>Custom Top Menu Item</h2><p>This is a custom top menu item content.</p></div>';
}

function register_custom_top_menu_page() {
	add_menu_page(
		'Custom Top Menu Page', // Page Title
		'Custom Top Menu',      // Menu Title
		'edit_posts',           // Capability (set to 'edit_posts' for users who can edit posts)
		'custom-top-menu',      // Menu Slug
		'custom_top_menu_page'  // Callback function to display content
	);
}
add_action( 'admin_menu', 'register_custom_top_menu_page' );

Code language: PHP (php)

Explanation:

add_custom_top_menu_item() Function:

  • add_action('admin_bar_menu', 'add_custom_top_menu_item') hooks the add_custom_top_menu_item() function to the admin_bar_menu action, allowing you to add a custom item to the WordPress top menu.
  • 'custom-top-menu' is the unique slug for this menu item, used in the URL to identify the menu.
  • 'class' => 'custom-top-menu-item' assigns a CSS class to the menu item, allowing custom styling if needed.
  • custom_top_menu_page() is the callback function that displays content when this menu item is clicked.

register_custom_top_menu_page() Function:

  • add_menu_page() creates a new menu item in the top menu with specified titles, capabilities, slugs, and callback functions for content.

Removing Items from the Top Menu

The top menu in WordPress contains crucial shortcuts and links. Customizing this section allows you to remove irrelevant items, decluttering the interface. This can be especially useful when you want to provide a simplified dashboard for clients or team members.

function remove_top_menu_item() {
	remove_menu_page( 'tools.php' ); // Example: Remove the Tools menu item
}
add_action( 'admin_menu', 'remove_top_menu_item' );
Code language: PHP (php)

Explanation:

  • 'tools.php' is the default menu slug for Tools. Removing it simplifies the top menu by eliminating the Tools menu item.

Adding Custom Top Secondary Menu Item

Adding a custom menu item to the secondary menu can be done using the admin_bar_menu action. Here’s how you can add a new secondary menu item:

function add_custom_secondary_menu_item() {
	global $wp_admin_bar;
	$wp_admin_bar->add_menu(
		array(
			'id'     => 'custom-secondary-menu',
			'title'  => 'Custom Secondary Menu',
			'href'   => admin_url( 'admin.php?page=custom-secondary-menu' ), // Create a separate page with this slug
			'parent' => 'top-secondary', // Position it in the top menu as a secondary item
			'meta'   => array(
				'class' => 'custom-secondary-menu-item',
			),
		)
	);
}
add_action( 'admin_bar_menu', 'add_custom_secondary_menu_item' );

function custom_secondary_menu_page() {
	// Content for the custom secondary menu item
	echo '<div class="wrap"><h2>Custom Secondary Menu Item</h2><p>This is a custom secondary menu item content.</p></div>';
}

function register_custom_secondary_menu_page() {
	add_submenu_page(
		'top-secondary',            // Parent Slug (use 'top-secondary' to attach it to the top menu)
		'Custom Secondary Menu Page', // Page Title
		'Custom Secondary Menu',      // Menu Title
		'edit_posts',                // Capability (set to 'edit_posts' for users who can edit posts)
		'custom-secondary-menu',      // Menu Slug
		'custom_secondary_menu_page'  // Callback function to display content
	);
}
add_action( 'admin_menu', 'register_custom_secondary_menu_page' );
Code language: PHP (php)

Explanation:

add_custom_secondary_menu_item() Function:

  • add_action('admin_menu', 'register_custom_menu_pages') hooks the register_custom_menu_pages() function to the admin_menu action, allowing you to register custom menu pages.
  • add_menu_page() and add_submenu_page() functions add new menu items with specified titles, capabilities, slugs, and callback functions for content.
  • 'edit_posts' capability ensures that users who can edit posts have access to these menu items.
  • 'custom-top-menu' and 'custom-secondary-menu' are unique slugs for these menu items, used in the URL to identify the menus.

register_custom_secondary_menu_page() Function:

  • add_submenu_page() creates a new submenu item under the specified parent slug with specified titles, capabilities, slugs, and callback functions for content.

Removing Items from the Top Secondary Menu

The top secondary menu, positioned under the main menu, offers additional functionalities. Tailoring this menu ensures that only relevant tools are easily accessible, promoting efficiency and ease of use. Removing unnecessary items from this section further refines the WordPress admin experience.

function remove_top_secondary_menu_item() {
	remove_submenu_page( 'top-secondary', 'edit-comments.php' ); // Example: Remove the Comments menu item from top secondary menu
}
add_action( 'admin_menu', 'remove_top_secondary_menu_item' );
Code language: PHP (php)

Modifying Existing Menu Items

Modifying existing menu items involves using hooks and filters. For example, changing the ‘Posts’ label to ‘Articles’:

function modify_menu_labels() {
	global $menu;
	$menu[5][0] = 'Articles'; // 5 is the index of the 'Posts' menu item
}
add_action( 'admin_menu', 'modify_menu_labels' );

Code language: PHP (php)

That’s it! You’ve successfully learned how to customize the WordPress admin menu, adding, removing, and modifying menu items in the side, top, and top secondary menus. With these skills, you can tailor your WordPress dashboard to suit your specific needs, enhancing your workflow and productivity.

By understanding the functions and actions involved, you can create a more user-friendly and efficient admin experience for yourself and your clients. Always remember to back up your files before making any changes and test your modifications thoroughly.

Leave your feedback and help us improve ๐Ÿถ

We hope you found this article helpful! If you have any questions, feedback, or spot any errors, please let us know in the comments. Your input is valuable and helps us improve. If you liked this article, please consider sharing it with others. And if you really enjoyed it, you can show your support by buying us a cup of coffee โ˜•๏ธ or donating via PayPal ๐Ÿ’ฐ.

More free knowledge, because why not?

Your thoughts matter, leave a reply ๐Ÿ’ฌ

Your email address will not be published. Required fields are marked *