How to create an options interface for a WordPress plugin

How to create an options interface for a WordPress plugin

When developing a WordPress plugin, a common need is to create a configurable options interface to allow user customization The behavior of the plugin. In this way, users can adjust the settings of the plug-in according to their own needs to make it more consistent with their usage habits. This article will describe how to create an options interface for a WordPress plugin and provide relevant code examples.

First, we need to create a menu page so that users can find our plugin options interface in the WordPress backend. Add the following code snippet to the main file of the plug-in:

function custom_plugin_menu() {
  add_menu_page(
    '插件选项界面', // 页面标题
    '插件选项', // 菜单标题
    'manage_options', // 用户权限，可选
    'custom-plugin-options', // 界面标识符
    'custom_plugin_options_page', // 回调函数
    'dashicons-admin-generic' // 菜单图标，可选
  );
}
add_action('admin_menu', 'custom_plugin_menu');

The above code uses the add_menu_page function to create a new menu page. Among them, the first parameter is the page title, the second parameter is the menu title, the third parameter is user permissions (optional, set here to manage_options to allow administrator access), and the fourth parameter is is the interface identifier, the fifth parameter is the callback function, and the last parameter is the menu icon (optional).

After creating the menu page, we can write the HTML code of the options interface in the callback function custom_plugin_options_page and process the form data submitted by the user. The following is a sample code:

function custom_plugin_options_page() {
  if (isset($_POST['custom_plugin_submit'])) {
    // 保存用户提交的表单数据
    update_option('custom_plugin_option', $_POST['custom_plugin_option']);
    echo '<div id="message" class="updated notice is-dismissible">
      <p>选项已保存</p>
      <button type="button" class="notice-dismiss">
        <span class="screen-reader-text">忽略此通知。</span>
      </button>
    </div>';
  }
  
  $custom_plugin_option = get_option('custom_plugin_option');
  
  echo '<div class="wrap">
    <h1>插件选项界面</h1>
    <form method="post" action="">
      <label for="custom_plugin_option">插件选项：</label>
      <input type="text" id="custom_plugin_option" name="custom_plugin_option" value="' . esc_attr($custom_plugin_option) . '" />
      <p class="submit">
        <input type="submit" name="custom_plugin_submit" class="button-primary" value="保存选项" />
      </p>
    </form>
  </div>';
}

The above code first checks whether there is a form submission (by checking whether $_POST['custom_plugin_submit'] exists), and if so, saves the form submitted by the user Data into the WordPress options table. Then, use the get_option function to get the saved option value and use it as the default value for the form.

Finally, we can use the following code to get the option value set by the user in the options interface:

$custom_plugin_option = get_option('custom_plugin_option');
echo '当前选项值为：' . $custom_plugin_option;

Through the above steps, we have successfully created a configurable options interface and will The user's selections are saved to WordPress. Of course, in actual development, we can add more options and handle them accordingly according to needs.

To summarize, creating an options interface for a WordPress plug-in is very simple. You only need to create a menu page, write the corresponding HTML code and a callback function to process the form data. Through this options interface, users can easily customize the behavior of the plug-in and improve the user experience. Hope the above content is helpful to you!

The above is the detailed content of How to create an options interface for a WordPress plugin. For more information, please follow other related articles on the PHP Chinese website!