开发WooCommerce插件时，我们需要添加一些自定义设置到WordPress后台，WooCommerce的设置页面是一个好地方，我们可以添加一个自定设置选项卡到WooCommerce的设置页面。

WooCommerce自定义设置选项卡示例代码

下面的示例代码中，我们添加了一个名为Riskified的选项卡到WooCommerce的设置页面，这个选项卡中有一个riskified_api_key的字段。

class Settings
{

    public function __construct()
    {
        add_filter('woocommerce_settings_tabs_array', [$this, 'add_settings_tab'], 50);

        add_action('woocommerce_settings_tabs_riskified', [$this, 'add_settings']);

        add_action('woocommerce_update_options_riskified', [$this, 'update_settings']);

    }


    function add_settings_tab($settings_tabs)
    {
        $settings_tabs[ 'riskified' ] = __('Riskified', 'woocommerce');

        return $settings_tabs;
    }


    function add_settings(): void
    {
        woocommerce_admin_fields($this->get_settings());
    }


    public function update_settings(): void
    {
        woocommerce_update_options($this->get_settings());
    }


    public function get_settings(): array
    {
        return [
            'section_title' => [
                'name' => __('Section Title', 'woocommerce-settings-tab-demo'),
                'type' => 'title',
                'desc' => '',
                'id'   => 'wc_settings_tab_riskified_section_title',
            ],
            [
                'name' => __('API Key', 'woocommerce'),
                'desc' => __('Riskified API Key', 'woocommerce'),
                'id'   => 'riskified_api_key',
                'type' => 'text',
                'css'  => 'min-width:350px;',
            ],
            'section_end'   => [
                'type' => 'sectionend',
                'id'   => 'wc_settings_tab_riskified_section_end',
            ],
        ];
    }

}

获取选项的值

直接使用WordPress的get_option函数来获取这些设置的值即可。如：

$api_key = get_option('riskified_api_key');

summarize

虽然我们也可以使用一些设置框架来添加自定义设置，但是使用本文中介绍的方式不必再引入一个设置框架，代码和界面会更加简洁，与WooCommerce的集成也更加良好。