Are you a WordPress developer or WordPress plugin developer? If yes then keep your close attention in this tutorial as I am going to share how to create an admin options page in WordPress plugin. If you are creating an option creation, update, saving and redirection, then WordPress will handle all of these.
Let’s create a WordPress plugin with options page in the WordPress admin area. first, write the header of your plugin by using below code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | < ?php /** * Your Plugin Name * * @package PluginPackage * @author Your Name * @copyright 2016 Your Name or Company Name * @license GPL-2.0+ * * @wordpress-plugin * Plugin Name: Plugin Name * Plugin URI: https://example.com/plugin-name * Description: Description of the plugin. * Version: 1.0.0 * Author: Your Name * Author URI: https://example.com * Text Domain: plugin-name * License: GPL-2.0+ * License URI: http://www.gnu.org/licenses/gpl-2.0.txt */ |
Add below code to add admin menu bar in WordPress admin menu.
1 2 3 | < ?php add_menu_page('My Cool Plugin Settings', 'Cool Settings', 'administrator', __FILE__, 'my_cool_plugin_settings_page', get_stylesheet_directory_uri('stylesheet_directory')."/images/media-button-other.gif"); ?> |
After the adding the above code, add below code to create admin setting page.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 | < ?php class MySettingsPage { /** * Holds the values to be used in the fields callbacks */ private $options; /** * Start up */ public function __construct() { add_action( 'admin_menu', array( $this, 'add_plugin_page' ) ); add_action( 'admin_init', array( $this, 'page_init' ) ); } /** * Add options page */ public function add_plugin_page() { // This page will be under "Settings" add_options_page( 'Settings Admin', 'My Settings', 'manage_options', 'my-setting-admin', array( $this, 'create_admin_page' ) ); } /** * Options page callback */ public function create_admin_page() { // Set class property $this->options = get_option( 'my_option_name' ); ?> <div class="wrap"> <h1>My Settings</h1> <form method="post" action="options.php"> < ?php // This prints out all hidden setting fields settings_fields( 'my_option_group' ); do_settings_sections( 'my-setting-admin' ); submit_button(); ?> </form> </div> < ?php } /** * Register and add settings */ public function page_init() { register_setting( 'my_option_group', // Option group 'my_option_name', // Option name array( $this, 'sanitize' ) // Sanitize ); add_settings_section( 'setting_section_id', // ID 'My Custom Settings', // Title array( $this, 'print_section_info' ), // Callback 'my-setting-admin' // Page ); add_settings_field( 'id_number', // ID 'ID Number', // Title array( $this, 'id_number_callback' ), // Callback 'my-setting-admin', // Page 'setting_section_id' // Section ); add_settings_field( 'title', 'Title', array( $this, 'title_callback' ), 'my-setting-admin', 'setting_section_id' ); } /** * Sanitize each setting field as needed * * @param array $input Contains all settings fields as array keys */ public function sanitize( $input ) { $new_input = array(); if( isset( $input['id_number'] ) ) $new_input['id_number'] = absint( $input['id_number'] ); if( isset( $input['title'] ) ) $new_input['title'] = sanitize_text_field( $input['title'] ); return $new_input; } /** * Print the Section text */ public function print_section_info() { print 'Enter your settings below:'; } /** * Get the settings option array and print one of its values */ public function id_number_callback() { printf( '<input type="text" id="id_number" name="my_option_name[id_number]" value="%s" />', isset( $this->options['id_number'] ) ? esc_attr( $this->options['id_number']) : '' ); } /** * Get the settings option array and print one of its values */ public function title_callback() { printf( '<input type="text" id="title" name="my_option_name[title]" value="%s" />', isset( $this->options['title'] ) ? esc_attr( $this->options['title']) : '' ); } } if( is_admin() ) $my_settings_page = new MySettingsPage(); ?> |
The output will be like:
If you like FreeWebMentor and you would like to contribute, you can write an article and mail your article to [email protected] Your article will appear on the FreeWebMentor main page and help other developers.
Article Tags: custom wordpress plugin, wordpress tutorial, wordpress tutorial for beginner, wordpress tutorial for beginners, wordpress tutorials, wordpress tutorials for beginners, wordpress tutorils