How to make custom page for your plugin inside WordPress admin dashboard

Depending on what kind of plugin you are making, sometimes you want to make a settings page for your plugin so users can play around with the settings to control the way your plugin works.

So how to make custom settings page for your plugin inside WordPress dashboard?

To add a custom page, inside your plugin file, you need to register your custom page and add a menu (adding your page menu item to the current dashboard menu items) pointing to that page this way:

function wp_mycustomsettings(){
	add_menu_page('My Custom Settings Page', 'Custom Settings', 'manage_options', 'wp-my-custom-settings-page', 'wp_mycustomsettings_html', 'dashicons-superhero-alt', 98);
}
add_action('admin_menu', 'wp_mycustomsettings');

This block of code is registering a menu item called “Custom Settings” to your WordPress dashboard. When you click it, it will trigger a callback function mentioned in that code “wp_mycustomsettings_html”.

So next step is to create that function “wp_mycustomsettings_html” and code your html inside it.

For the sake of simplicity, let’s just write the function this way:

function wp_mycustomsettings_html(){
	include("includes/settingspageform.php");
}

This simple function will take out a content of that file “includes/settingspageform.php” and bring it to the settings page that we registered. So we have to work on the html part on that particular file.

Create a folder “includes” and add a file “settingspageform.php” in it. Edit it and code your HTML page there.

To make it super simple, add this code to your settingspageform.php:

<h1>My custom settings page</h1>
<p>Hello there! It's my custom page.</p>