To add a custom admin page in WordPress you need 2 things:
- Add your items to the admin menu, using the add_menu_page() or add_submenu_page() functions.
- Page content (a standard custom function that echo’s your html)
Example code
<?php
namespace MyPluginNamespaceName;
//***************************************************************
//***************************************************************
//********** ADD OUR PLUGIN PAGES TO THE WP ADMIN MENU **********
//***************************************************************
//***************************************************************
//ADD LINKS TO MY ADMIN PAGES IN THE MAIN SIDEBAR MENU
add_action( 'admin_menu', '\MyPluginNamespaceName\add_my_plugin_admin_menu_items' );
function add_my_plugin_admin_menu_items()
{
//---- ADD PAGES TO THE ROOT ADMIN MENU -----
add_menu_page('My Plugin Admin Page 1', //Page Title
'My Plugin Admin Page 1', //Menu item text
'manage_options', //User capability level ('manage_options' = WP settings menu access), see: https://wordpress.org/support/article/roles-and-capabilities/
'my-plugin-admin-page-1', //Menu item slug (used as URL argument)
'\MyPluginNamespaceName\my_plugin_admin_page_1_html', //Function name
'dashicons-admin-generic', //Icon to use (URL, or select from: https://developer.wordpress.org/resource/dashicons/#admin-generic )
3 ); //$position - Position in the 'Menu Structure', for instance 3 would place it ater Dashboard which is fixed at 2 , see: https://developer.wordpress.org/reference/functions/add_menu_page/
//<<<<<ADD OTHER MENU ITEMS HERE
//---- ADD PAGES AS SUB MENU ITEMS -----
//$parent_slug - can be your own created menu item, or one of the standard wp menu items slugs:
// Dashboard: 'index.php'
// Posts: 'edit.php'
// Media: 'upload.php'
// Pages: 'edit.php?post_type=page'
// Comments: 'edit-comments.php'
// Custom Post Types: 'edit.php?post_type=your_post_type'
// Appearance: 'themes.php'
// Plugins: 'plugins.php'
// Users: 'users.php'
// Tools: 'tools.php'
// Settings: 'options-general.php'
// Network Settings: 'settings.php'
/*
add_submenu_page('options-general.php', //$parent_slug, the menu item within which to add this new sub menu item (see above)
'My Plugin Admin Page 1', //Page title
'My Plugin Admin Page 1', //Menu item text
'manage_options', //User capability level ('manage_options' = WP settings menu access), see: https://wordpress.org/support/article/roles-and-capabilities/
'my-plugin-admin-page-1', //Menu item slug (used as URL argument)
'\MyPluginNamespaceName\my_plugin_admin_page_1_html', //Function name
Null ); //$position - Position in the 'Menu Structure',
*/
//<<<<<ADD OTHER MENU ITEMS HERE
}
//*********************************************************************************
//*********************************************************************************
//********** ADD OUR PLUGIN CSS AND JS FILES TO INCLUDE IN WP ADMIN MENU **********
//*********************************************************************************
//*********************************************************************************
/*
add_action( 'admin_enqueue_scripts', '\MyPluginNamespaceName\register_my_plugin_admin_scripts' );
function register_my_plugin_admin_scripts()
{
wp_register_style( 'my-plugin', plugins_url( 'ddd/css/plugin.css' ) );
wp_register_script( 'my-plugin', plugins_url( 'ddd/js/plugin.js' ) );
}
add_action( 'admin_enqueue_scripts', '\MyPluginNamespaceName\load_my_plugin_admin_scripts' );
function load_my_plugin_admin_scripts($hook)
{
//Load only on ?page=sample-page
if( $hook != 'toplevel_page_sample-page' )
return;
//Load style & scripts.
wp_enqueue_style('my-plugin');
wp_enqueue_script('my-plugin');
}
*/
//**********************************************
//**********************************************
//********** ADMIN PAGE - **********
//**********************************************
//**********************************************
function my_plugin_admin_page_1_html ()
{
/*
if (!current_user_can('administrator'))
die();
*/
//-----------------------
//----- HTML OUTPUT -----
//-----------------------
$HtmlOutput = '';
$HtmlOutput .= <
Feel free to comment if you can add help to this page or point out issues and solutions you have found. I do not provide support on this site, if you need help with a problem head over to stack overflow.