Part 3 – A complete guide for wordpress Plugin Development

plaese check out PART 1 & part 2  First

Building the Options Page (filename:

Plugin Name: ProWP3 Settings Example
Plugin URI: 
Description: This is a plugin demonstrating the WordPress Settings API
Version: 1.0
Author URI:
License: GPLv2
// create custom plugin settings menu
add_action( 'admin_menu', 'prowp_create_menu' );
function prowp_create_menu() {
    //create new top-level menu
    add_menu_page( 'Halloween Plugin Page', 'Halloween Plugin',
        'manage_options', 'prowp_main_menu',
        'prowp_settings_page' );
    //call register settings function
    add_action( 'admin_init', 'prowp_register_settings' );
function prowp_register_settings() {
    //register our settings
    register_setting( 'prowp-settings-group',
        'prowp_options', 'prowp_sanitize_options' );
function prowp_sanitize_options( $input ) {
    $input['option_name']  =
        sanitize_text_field( $input['option_name'] );
    $input['option_email'] =
        sanitize_email( $input['option_email'] );
    $input['option_url']   =
        esc_url( $input['option_url'] );
    return $input;
function prowp_settings_page() {
    <div class="wrap">
    <h2>Halloween Plugin Options</h2>
    <form method="post" action="options.php">
        <?php settings_fields( 'prowp-settings-group' ); ?>
        <?php $prowp_options = get_option( 'prowp_options' ); ?>
        <table class="form-table">
            <tr valign="top">
            <th scope="row">Name</th>
            <td><input type="text"
                value="<?php echo esc_attr(
                    $prowp_options['option_name'] ); ?>" /></td>
            <tr valign="top">
            <th scope="row">Email</th>
            <td><input type="text"
                value="<?php echo esc_attr(
                    $prowp_options['option_email'] ); ?>" /></td>
            <tr valign="top">
            <th scope="row">URL</th>
            <td><input type="text"
                value="<?php echo esc_url(
                $prowp_options['option_url'] ); ?>" /></td>
        <p class="submit">
            <input type="submit" class="button-primary"
                value="Save Changes" />

The second option page method is to add your plugin settings to an existing Settings page in WordPress, as shown in  You will also be using the WordPress Settings API functions to hook into these pages and add your plugin settings.

Custom settings section

Now look over at the code to create your custom settings section. In the following example, you are going to add a new settings section at the bottom of the Settings ➢ Reading Settings page. This section will contain options for your plugin.

//execute our settings section function
add_action( 'admin_init', 'prowp_settings_init' );
function prowp_settings_init() {
    //create the new setting section on the Settings > Reading page
    add_settings_section( 'prowp_setting_section',
        'Halloween Plugin Settings', 'prowp_setting_section', 'reading' );
    // register the two setting options
    add_settings_field( 'prowp_setting_enable_id', 'Enable Halloween Feature?',
        'prowp_setting_enabled', 'reading', 'prowp_setting_section' );
    add_settings_field( 'prowp_saved_setting_name_id', 'Your Name',
        'prowp_setting_name', 'reading', 'prowp_setting_section' );
    // register the setting to store our array of values
    register_setting( 'reading', 'prowp_setting_values',
        'prowp_sanitize_settings' );

About the author

Deven Rathore

I'm Deven Rathore, a multidisciplinary & self-taught designer with 3 years of experience. I'm passionate about technology, music, coffee, traveling and everything visually stimulating. Constantly learning and experiencing new things.

Get The best In Web dev

Get The best In Web dev

Join dunebook and recieve best in Angular, React, Vue, Python, Java & more. Directly to your inbox once a week FREE !

You have Successfully Subscribed!

Pin It on Pinterest