Create Nested Submenus in the WordPress Admin Dashboard

Enhance your plugin or theme's admin interface by organizing settings into nested submenus using the add_submenu_page function. Learn how to link a submenu to a custom parent menu slug, define user access permissions with capabilities, and render unique content via callback functions. This approach keeps the WordPress sidebar clean while providing easy access to multiple settings screens, making it an essential skill for developing complex WordPress administrative tools.

How to Add a Submenu in WordPress Dashboard

Advanced Guides Code Snippets Coding Blog Content Management PHP PHP Development PHP Snippets Theme Customization Theme Development Tutorials Woocommerce WordPress Functions WordPress How-To WordPress Snippets WordPress Tips WordPress Tutorials WP Hooks

How to Add a Submenu in WordPress Dashboard Tutorial/Guide

To add a submenu under a custom menu in the WordPress admin panel, you can use the built-in add_submenu_page() function. Here’s how:

  1. Open functions.php from your theme directory, or build a plugin.
  2. Paste the following code into the file:
// Top-level admin menu
function custom_menu_page() {
    add_menu_page(
        'Custom Menu',
        'Custom Menu',
        'manage_options',
        'custom-menu',
        'custom_menu_callback',
        'dashicons-admin-generic',
        25
    );
}
add_action('admin_menu', 'custom_menu_page');

// Submenu below custom menu
function custom_submenu_page() {
    add_submenu_page(
        'custom-menu',
        'Submenu',
        'Submenu',
        'manage_options',
        'custom-submenu',
        'custom_submenu_callback'
    );
}
add_action('admin_menu', 'custom_submenu_page');

// Main page callback
function custom_menu_callback() {
    echo '<div class="wrap">';
    echo '<h1>Custom Menu</h1>';
    echo '<p>Welcome to your custom admin menu page.</p>';
    echo '</div>';
}

// Submenu page callback
function custom_submenu_callback() {
    echo '<div class="wrap">';
    echo '<h1>Submenu</h1>';
    echo '<p>This is your submenu section.</p>';
    echo '</div>';
}

Once added, you’ll see the “Custom Menu” with its “Submenu” below it inside the admin dashboard. Customize content as needed.  

๐Ÿ’ก Have a Coding Problem?

Search our archives or reach out to our team for solutions and expert advice.