Custom PHP class to develop a settings panel for WordPress

Today I’m releasing a custom PHP class that I built for working with the WordPress settings API. It’s called wp-tidy-settings.

What is this?

WP-tidy-settings is a PHP class that helps developers build options panels for plugins and themes. You can download it here.

Why I built this.

I have developed a fair amount of WordPress plugins. Most of these plugins had an options panel and the code of each panel was different for every plugin. Tired of this I decided to build my own class that I could adapt to any situation and speed up development.

WP-tidy-settings has been inspired by the wordpress-settings-api-class and the EDD options system.

How does it work?

Head over to github and you can find an example plugin that shows usage of the class, with demo fields and 2 different settings groups.

Create settings groups

By creating settings groups you’ll be able to split settings in multiple sections easily accessible through a tabbed navigation like in the screenshot below.

settings tabs

In the example plugin, I’ve created 2 groups that are contained within an array into the getsettingsgroups function

function get_settings_groups() {

  $groups = array(
    array(
      'id'    => 'settings_test',
      'title' => 'Settings Test',
    ),
    array(
      'id'         => 'settings_test_2',
      'title'      => 'Another Tab',
      'hide_title' => true
    ),
  );

  return $groups;

}

The groups also have the ability to hide the section title. Simply add the hide_title parameter and set it to true.

Adding fields

In order to add fields, in the example I’ve added a function that contains an array with all the fields.

Each fields array has been assigned to a group by using the same ID key name that we’re using into the get_settings_groups function.

Showing the options panel.

Once you’ve created the groups and the fields, it’s time to show the options form into a page. Use the add_options_page function to create your custom page ( https://codex.wordpress.org/FunctionReference/addoptions_page ) and then show the form by using the show_settings_form function of the class.

function plugin_page() {

    echo '<div class="wrap">';
    $this->settings_api->show_settings_form();
    echo '</div>';

}

Actions and filters

A few actions and filters are available for developers for further customization. Dive into the code to find them. There are 2 filters for sanitization and 2 actions within the options panel.

Sanitization

The class does not take care of sanitization. Each field has a sanitize_callback parameter that you can use to define your custom rules.

Each options group is stored as an option into your site’s database. So for 2 options groups, you will have 2 options into the database.

If you’ve found any bugs or got any suggestion feel free to get in touch. Pull requests are welcome :)