Let’s take a look how to add custom admin menu items in WordPress. Also, I‘m going to show you how to add custom admin menu items on WordPress admin bar. It’s not a difficult task and will take only couple of minutes to accomplish.
Video: How to Add Custom Admin Menu Items in WordPress?
Probably it’ll be a bit easier for you to follow the instructions after you have watched this video tutorial I made on the same topic.
How to add custom admin bar menu items?
First, I’ll show you how to add custom admin bar menu items. Just grab this code here below and add it inside your child theme’s functions.php or better yet, use Code Snippets plugin for it. Also, see the comments inside the code to see what is what.
// First level menu
add_action('admin_bar_menu', 'add_toolbar_items', 100);
function add_toolbar_items($admin_bar){
$admin_bar->add_menu( array(
'id' => 'my-item',
'title' => 'All tutorials', // Your menu title
'href' => 'https://know.local/', // URL
'meta' => array(
'target' => '_blank',
),
));
// Submenus
$admin_bar->add_menu( array(
'parent' => 'my-item',
'title' => 'Remove admin menus', // Your submenu title
'href' => 'https://wpsimplehacks.com/how-to-remove-wordpress-admin-menu-items/', // URL
'meta' => array(
'target' => '_blank',
),
));
$admin_bar->add_menu( array(
'parent' => 'my-item',
'title' => 'Custom Admin Dashboard',
'href' => 'https://wpsimplehacks.com/how-to-create-custom-wordpress-admin-dashboard/',
'meta' => array(
'target' => '_blank',
),
));
$admin_bar->add_menu( array(
'parent' => 'my-item',
'title' => 'Block Patterns',
'href' => 'https://wpsimplehacks.com/how-to-create-wordpress-block-patterns-and-reusable-blocks/',
'meta' => array(
'target' => '_blank',
),
));
}
}
If you want to remove submenu items then select this part and delete it
$admin_bar->add_menu( array(
'parent' => 'my-item',
'title' => 'Block Patterns',
'href' => 'https://wpsimplehacks.com/how-to-create-wordpress-block-patterns-and-reusable-blocks/',
'meta' => array(
'target' => '_blank',
),
));
Same thing if you want to add submenus – just grab this part here above and paste it below previous submenu item code.
How to Add Custom Admin Menu Items?
Now, lets see how to add custom admin menu items in WordPress.
Once more, grab a code snippet here below and us it whether inside your child theme’s functions.php file or inside Code Snippets code box.
add_action('admin_menu', 'admin_menu_add_external_links_as_submenu');
add_action( 'admin_head', 'admin_menu_add_external_links_as_submenu_jquery' );
function admin_menu_add_external_links_as_submenu() {
global $submenu;
$menu_slug = "externallink"; // used as "key" in menus
$menu_pos = 2; // whatever position you want your menu to appear
// create the top level menu
add_menu_page( 'external_link', 'How-to...', 'read', $menu_slug, '', '', $menu_pos);
// add the external links to the slug you used when adding the top level menu
$submenu[$menu_slug][] = array('<div id="newtab1">...create CPT</div>', 'manage_options', 'https://wpsimplehacks.com/how-to-create-custom-post-type-in-wordpress-without-a-plugin-within-couple-of-minutes/');
$submenu[$menu_slug][] = array('<div id="newtab2">...use Blocks</div>', 'manage_options', 'https://wpsimplehacks.com/how-to-use-blocksy-content-blocks-hooks-full-tutorial/');
$submenu[$menu_slug][] = array('<div id="newtab3">...get discounts</div>', 'manage_options', 'https://wpsimplehacks.com/start-here/');
function admin_menu_add_external_links_as_submenu_jquery()
{
?>
<script type="text/javascript">
jQuery(document).ready( function($) {
$('#newtab1').parent().attr('target','_blank');
$('#newtab2').parent().attr('target','_blank');
$('#newtab3').parent().attr('target','_blank');
});
</script>
<?php
}
}
If you need to add another submenu item then just paste this part below previous submenu item code
$submenu[$menu_slug][] = array('<div id="newtab3">...get discounts</div>', 'manage_options', 'https://wpsimplehacks.com/start-here/');
Now rename newtab3 to newtab4 and add this line accordingly. Pay attention that #newtab4 should have correct number, otherwise it will not upen the link in new brower tab.
$('#newtab4').parent().attr('target','_blank');
How to customize WordPress admin interface for your clients?
Here are all the tutorials I have made on how to customize WordPress admin interface for your clients.