How to Add Custom Setting Page to WordPress Theme or Plugin?

We are going to create a setting page for WordPress themes and plugins. The output should look like โ€“

 

[php]
// Setting page
function shamim_create_menu_page() {

add_menu_page(
__(‘SP Custom Setting’, ‘text-domain’), // The title to be displayed on the corresponding page for this menu
__(‘SP Custom Page’, ‘text-domain’), // The text to be displayed for this actual menu item
‘manage_options’, // Which type of users can see this menu
‘my-top-level-slug’, // The unique ID – that is, the slug – for this menu item
‘sandbox_menu_page_display’, // The name of the function to call when rendering the menu for this page
‘dashicons-cart’ // To display Menu icon
);
add_submenu_page(
‘my-top-level-slug’, // Register this submenu with the menu slug defined above
‘My Custom Page Options’, // The text to the display in the browser when this submenu menu item is active
‘My Custom Page Options’, // The text to show for this submenu item
‘manage_options’, // Which type of users can see this menu ( or administrator)
‘my-top-level-slug’, // The unique ID – the slug – for this submenu item
‘sandbox_menu_page_display’ // The function used to render the menu for this page to the screen
);

add_submenu_page(
‘my-top-level-slug’, // Register this submenu with the menu slug defined above
‘My Custom Submenu Page’, // The text to the display in the browser when this submenu menu item is active
‘My Custom Submenu Page’, // The text to show for this submenu item
‘manage_options’, // Which type of users can see this menu ( or administrator)
‘my-secondary-slug’, // The unique ID – the slug – for this submenu item
‘sandbox_options_display’ // The function used to render the menu for this page to the screen
);

} // end shamim_create_menu_page
add_action( ‘admin_menu’, ‘shamim_create_menu_page’ );

function sandbox_menu_page_display() {

// Create a header in the default WordPress ‘wrap’ container
$html = ‘

‘;
$html .= ‘

The Mian Page

‘;
$html .= ‘

‘;

// Send the markup to the browser
echo $html;

} // end sandbox_menu_page_display

function sandbox_options_display() {

// Create a header in the default WordPress ‘wrap’ container
$html = ‘

‘;
$html .= ‘

The Submenu Page to show options

‘;
$html .= ‘

‘;

// Send the markup to the browser
echo $html;

} // end sandbox_options_display
[/php]