如何使用 WordPress Setting API
像素鱼丸
03-18
179

使用 WordPress 的 Setting API 是在插件或主题中创建和管理设置页面的标准方式。它提供了一种结构化、安全的方式来保存和获取用户配置的选项。


✅ 一、Setting API 简介

WordPress 的 Setting API 允许你:

  • 创建设置页面(Settings Page)
  • 注册设置字段(Settings Field)
  • 验证和保存设置数据
  • 使用表单提交来更新设置

✅ 二、基本步骤

1. 注册设置(register_setting)


function my_plugin_register_settings() {
    register_setting( 'my-plugin-settings-group', 'my_plugin_option_name' );
}
add_action( 'admin_init', 'my_plugin_register_settings' );
  • my-plugin-settings-group:设置组名称,用于分组
  • my_plugin_option_name:存储的选项名(通常与数据库中的 option_name 对应)

2. 添加设置页面(add_settings_section)


function my_plugin_add_settings_section() {
    add_settings_section(
        'my-plugin-main-section', // ID
        'My Plugin Settings',     // 标题
        'my_plugin_section_callback', // 回调函数(可选)
        'my-plugin'               // 页面 slug
    );
}
add_action( 'admin_init', 'my_plugin_add_settings_section' );

3. 添加设置字段(add_settings_field)


function my_plugin_add_settings_field() {
    add_settings_field(
        'my_plugin_field_id',       // ID
        'My Plugin Field',          // 标题
        'my_plugin_field_callback', // 回调函数
        'my-plugin',                // 页面 slug
        'my-plugin-main-section'    // section ID
    );
}
add_action( 'admin_init', 'my_plugin_add_settings_field' );

4. 回调函数(回调函数)

a. 设置字段显示内容


function my_plugin_field_callback() {
    $option = get_option('my_plugin_option_name');
    echo "<input type='text' name='my_plugin_option_name' value='" . esc_attr($option) . "' />";
}

b. 设置部分说明(可选)


function my_plugin_section_callback() {
    echo '<p>这是我的插件设置部分。</p>';
}

5. 创建设置页面(settings page)


function my_plugin_settings_page() {
    add_options_page(
        'My Plugin Settings',      // 页面标题
        'My Plugin',               // 菜单标题
        'manage_options',          // 权限
        'my-plugin',               // 页面 slug
        'my_plugin_render_settings_page'
    );
}
add_action('admin_menu', 'my_plugin_settings_page');
function my_plugin_render_settings_page() {
    ?>
    <div class="wrap">
        <h1>My Plugin Settings</h1>
        <form method="post" action="options.php">
            <?php
            settings_fields('my-plugin-settings-group'); // 输出隐藏的 nonce
            do_settings_sections('my-plugin');           // 输出所有设置段
            submit_button();
            ?>
        </form>
    </div>
    <?php
}

✅ 三、完整示例代码


// 注册设置
function my_plugin_register_settings() {
    register_setting( 'my-plugin-settings-group', 'my_plugin_option_name' );
}
add_action( 'admin_init', 'my_plugin_register_settings' );
// 添加设置段
function my_plugin_add_settings_section() {
    add_settings_section(
        'my-plugin-main-section',
        'My Plugin Settings',
        'my_plugin_section_callback',
        'my-plugin'
    );
}
add_action( 'admin_init', 'my_plugin_add_settings_section' );
// 添加设置字段
function my_plugin_add_settings_field() {
    add_settings_field(
        'my_plugin_field_id',
        'My Plugin Field',
        'my_plugin_field_callback',
        'my-plugin',
        'my-plugin-main-section'
    );
}
add_action( 'admin_init', 'my_plugin_add_settings_field' );
// 设置部分回调
function my_plugin_section_callback() {
    echo '<p>这是我的插件设置部分。</p>';
}
// 设置字段回调
function my_plugin_field_callback() {
    $option = get_option('my_plugin_option_name');
    echo "<input type='text' name='my_plugin_option_name' value='" . esc_attr($option) . "' />";
}
// 添加设置页面
function my_plugin_settings_page() {
    add_options_page(
        'My Plugin Settings',
        'My Plugin',
        'manage_options',
        'my-plugin',
        'my_plugin_render_settings_page'
    );
}
add_action('admin_menu', 'my_plugin_settings_page');
function my_plugin_render_settings_page() {
    ?>
    <div class="wrap">
        <h1>My Plugin Settings</h1>
        <form method="post" action="options.php">
            <?php
            settings_fields('my-plugin-settings-group');
            do_settings_sections('my-plugin');
            submit_button();
            ?>
        </form>
    </div>
    <?php
}

✅ 四、获取设置值


$my_option = get_option('my_plugin_option_name');
echo esc_html($my_option);

✅ 五、验证和过滤设置值(可选)

你可以通过 register_setting 的第三个参数添加一个验证回调函数:


register_setting(
    'my-plugin-settings-group',
    'my_plugin_option_name',
    'my_plugin_validate_callback'
);
function my_plugin_validate_callback($input) {
    return sanitize_text_field($input); // 或其他验证逻辑
}

✅ 六、注意事项

  • 所有设置都保存在 WordPress 的 wp_options 表中。
  • 使用 settings_fields()do_settings_sections() 来生成表单结构。
  • 设置页面建议使用 add_options_page() 创建,这样会出现在“设置”菜单下。

✅ 七、进阶功能

  • 多个设置组(groups)
  • 多个设置页面
  • 自定义字段类型(如 checkbox, select, textarea)
  • 使用 sanitize_callback 过滤输入

如果你需要更复杂的设置(比如多选项卡、多组设置),可以使用 add_settings_section()add_settings_field() 多次调用。


? 总结

步骤 函数 作用
注册设置 register_setting() 注册选项
添加设置段 add_settings_section() 添加设置区域
添加设置字段 add_settings_field() 添加具体设置项
渲染设置页面 add_options_page() 创建设置页面
获取设置值 get_option() 读取用户设置

如果你需要我帮你写一个完整的插件结构或者处理某个特定字段类型(比如 Checkbox、Select 等),也可以告诉我 ?

收藏
打赏
详解 WordPress 的评论设置
上一篇
Mirage 主题 v2.93.0 发布
下一篇

发表评论

注册不是必须的

像素鱼丸
158 文章
2 评论
4 喜欢
最新文章

什么是幽灵按钮

“幽灵按钮”(Ghost Button)是一种常见的网页与移动应用 UI 设计模式,指背景透明(或半透明)、仅通过边框(border)和文字(text)定义的按钮,视觉上“若隐若现”,仿佛“幽灵”一般——因此得名。 核心特征: 无填充色(transparent background) 背景完全透明(或与父容器同色),不遮挡背后内容。 清晰的边框(通常 1–2px 实线) 如 border: 2px […]

付费资源下载时间限制有什么用?

这个功能确实挺常见的,它背后的逻辑其实不是“防君子”,而是“防小人”和“控成本”。有没有必要做,主要取决于你平台上的资源类型和你的运营阶段。 我们可以从三个角度来看看这个“10天有效期”到底有什么用: 增加倒卖和二次传播的成本(防黄牛) 这是最核心的意义。如果你的资源是虚拟商品(比如教程、源码、素材包),用户付一次钱理论上可以无限复制。 如果没有有效期: 一个人买了,转手挂到闲鱼或者别的群里卖,你 […]

测试产品

退款和取消订单接口要不要合并

很多开发者在设计初期的常见思路。将“取消”和“退款”分开,从功能上看似乎很清晰,但在实际的复杂业务场景中,这种设计可能会带来一些问题。 更主流和推荐的设计是提供一个统一的“申请取消订单”接口,由后端服务根据订单的当前状态,自动路由到不同的处理逻辑。  为什么统一接口是更好的选择? 前端逻辑简化: 对于用户而言,他的诉求只有一个:“我不想要这个订单了”。无论订单是否支付,他在前端点击的都是“取消订单 […]
生成中...
扫描二维码
扫描二维码
确认购买

您确定要购买此资源吗?

微信扫码支付

请使用微信扫描二维码完成支付

订单号:

等待支付...