How to Create a Settings Page in WordPress Easily
To create a settings page in WordPress, use the
add_menu_page function to add the page to the admin menu and the register_setting function to register your settings. Then, build a form inside the page callback to save and display options.Syntax
add_menu_page adds a new top-level menu page in the WordPress admin. It requires a page title, menu title, capability, menu slug, callback function, icon URL, and position.
register_setting registers a setting group and option name to save user input securely.
The callback function outputs the HTML form for the settings page.
php
<?php add_action('admin_menu', 'myplugin_add_settings_page'); add_action('admin_init', 'myplugin_register_settings'); function myplugin_add_settings_page() { add_menu_page( 'My Plugin Settings', // Page title 'My Plugin', // Menu title 'manage_options', // Capability 'myplugin-settings', // Menu slug 'myplugin_settings_page_html', // Callback 'dashicons-admin-generic', // Icon 80 // Position ); } function myplugin_register_settings() { register_setting('myplugin_options_group', 'myplugin_option_name'); } function myplugin_settings_page_html() { ?> <div class="wrap"> <h1>My Plugin Settings</h1> <form method="post" action="options.php"> <?php settings_fields('myplugin_options_group'); do_settings_sections('myplugin-settings'); $value = get_option('myplugin_option_name'); ?> <input type="text" name="myplugin_option_name" value="<?php echo esc_attr($value); ?>" /> <?php submit_button(); ?> </form> </div> <?php } ?>
Example
This example creates a simple settings page under the WordPress admin menu called "My Plugin". It registers one option and displays a text input field to save and update the option value.
php
<?php /* Plugin Name: My Plugin Settings Example */ add_action('admin_menu', 'myplugin_add_settings_page'); add_action('admin_init', 'myplugin_register_settings'); function myplugin_add_settings_page() { add_menu_page( 'My Plugin Settings', 'My Plugin', 'manage_options', 'myplugin-settings', 'myplugin_settings_page_html', 'dashicons-admin-generic', 80 ); } function myplugin_register_settings() { register_setting('myplugin_options_group', 'myplugin_option_name'); } function myplugin_settings_page_html() { ?> <div class="wrap"> <h1>My Plugin Settings</h1> <form method="post" action="options.php"> <?php settings_fields('myplugin_options_group'); do_settings_sections('myplugin-settings'); $value = get_option('myplugin_option_name'); ?> <label for="myplugin_option_name">Enter a value:</label> <input type="text" id="myplugin_option_name" name="myplugin_option_name" value="<?php echo esc_attr($value); ?>" /> <?php submit_button(); ?> </form> </div> <?php } ?>
Output
In WordPress admin, a new menu item "My Plugin" appears. Clicking it shows a settings page with a text input and a save button. Entered text is saved and loaded on page refresh.
Common Pitfalls
- Not hooking
add_menu_pageandregister_settingto the correct WordPress actions (admin_menuandadmin_initrespectively). - Forgetting to call
settings_fieldsinside the form, which is needed for security nonce fields. - Using incorrect capability strings, which can hide the menu from users.
- Not escaping output with
esc_attrwhen displaying saved options, risking security issues.
php
<?php // Wrong: Not hooking functions add_menu_page('Title', 'Menu', 'manage_options', 'slug', 'callback'); register_setting('group', 'option'); // Right: Hook properly add_action('admin_menu', function() { add_menu_page('Title', 'Menu', 'manage_options', 'slug', 'callback'); }); add_action('admin_init', function() { register_setting('group', 'option'); });
Quick Reference
- add_menu_page: Adds a new admin menu page.
- register_setting: Registers a setting for saving options.
- settings_fields: Prints security fields inside the form.
- get_option: Retrieves saved option value.
- submit_button: Prints a save button.
Key Takeaways
Use add_menu_page hooked to admin_menu to create the settings page menu.
Register your settings with register_setting hooked to admin_init for secure saving.
Always include settings_fields inside your form for security nonces.
Escape output with esc_attr when displaying saved options to prevent security issues.
Test your settings page by saving and retrieving options to confirm it works.