You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

WooCommerce自定义设置标签页子分区添加失效解决方案

问题根因

自定义WooCommerce设置标签不显示子分区的核心原因是你只注册了顶级标签,没有绑定标签的渲染逻辑。
WooCommerce核心内置的设置标签(产品、常规、税费等)已经在核心代码中提前绑定了woocommerce_settings_tabs_{$tab_id}渲染动作,执行时会自动加载子分区导航、输出对应设置表单、处理表单提交。你新建的test标签属于自定义标签,核心不会自动给你绑定这个动作,所以你写的woocommerce_get_sections_test、woocommerce_get_settings_test过滤器根本没有触发入口,自然子分区和字段都不会显示。

修复方案

把原有代码替换为下面的完整实现,补全缺失的渲染、保存逻辑,同时修正几个容易踩的配置错误:

class WC_Settings_Tab_Demo {

    public static function init() {
        // 注册顶级设置标签
        add_filter( 'woocommerce_settings_tabs_array', __CLASS__ . '::add_settings_tab', 50 );
        // 绑定自定义标签渲染动作(核心缺失项)
        add_action( 'woocommerce_settings_tabs_test', __CLASS__ . '::render_settings' );
        // 绑定设置保存逻辑(核心缺失项)
        add_action( 'woocommerce_update_options_test', __CLASS__ . '::save_settings' );
        // 注册子分区
        add_filter( 'woocommerce_get_sections_test', __CLASS__ . '::register_sub_sections' );
        // 注册各子分区的设置字段
        add_filter( 'woocommerce_get_settings_test', __CLASS__ . '::load_section_fields', 10, 2 );
    }

    public static function add_settings_tab( $settings_tabs ) {
        $settings_tabs['test'] = __( 'Settings Demo Tab', 'woocommerce-settings-tab-demo' );
        return $settings_tabs;
    }

    public static function register_sub_sections( $sections ) {
        // 必须保留空key的默认分区,否则首次进入标签页无内容
        $sections[''] = __( 'General', 'woocommerce-settings-tab-demo' );
        $sections['custom_settings'] = __( 'Custom Settings', 'woocommerce-custom-settings-tab' );
        $sections['more_settings'] = __( 'More Settings', 'woocommerce-custom-settings-tab' );
        return $sections;
    }

    public static function load_section_fields( $settings, $current_section ) {
        switch ( $current_section ) {
            case 'custom_settings':
                $settings = [
                    [
                        'name' => __( 'Custom Settings', 'text-domain' ),
                        'type' => 'title',
                        'desc' => __( 'The following options are used to ...', 'text-domain' ),
                        'id'   => 'custom_settings_title'
                    ],
                    [
                        'name'    => __( 'Field 1', 'text-domain' ),
                        'id'      => 'field_one',
                        'type'    => 'text',
                        'default' => ''
                        // 禁止在此处手动调用get_option(),WooCommerce会自动读取数据库值覆盖默认值
                    ],
                    [
                        'type' => 'sectionend',
                        'id'   => 'custom_settings_end'
                    ]
                ];
                break;
            case 'more_settings':
                // 按需填写more_settings分区的字段配置
                $settings = [
                    [
                        'name' => __( 'More Settings', 'text-domain' ),
                        'type' => 'title',
                        'desc' => __( 'More configuration options', 'text-domain' ),
                        'id'   => 'more_settings_title'
                    ],
                    // 其他字段按相同格式追加即可
                    [
                        'type' => 'sectionend',
                        'id'   => 'more_settings_end'
                    ]
                ];
                break;
            default:
                // 默认分区字段配置
                $settings = [
                    [
                        'name' => __( 'Demo Tab General Config', 'text-domain' ),
                        'type' => 'title',
                        'desc' => __( 'General settings for demo tab', 'text-domain' ),
                        'id'   => 'test_general_title'
                    ],
                    // 按需追加默认分区字段
                    [
                        'type' => 'sectionend',
                        'id'   => 'test_general_end'
                    ]
                ];
                break;
        }
        return $settings;
    }

    public static function render_settings() {
        // 调用WooCommerce官方方法输出设置,自动渲染子分区导航+表单
        $current_section = isset( $_GET['section'] ) ? sanitize_text_field( $_GET['section'] ) : '';
        WC_Admin_Settings::output_fields( self::load_section_fields( [], $current_section ) );
    }

    public static function save_settings() {
        global $current_section;
        $settings = self::load_section_fields( [], $current_section );
        WC_Admin_Settings::save_fields( $settings );
    }
}
WC_Settings_Tab_Demo::init();
关键注意事项
  • 不要在字段配置的default参数中手动调用get_option(),WooCommerce输出字段、保存配置时会自动合并默认值与数据库存储值,手动调用会导致默认值逻辑异常
  • 子分区数组必须包含空key的默认项,否则首次进入标签页时没有匹配的分区配置,页面会显示空白
  • 所有自定义设置标签都必须手动绑定woocommerce_settings_tabs_{$tab_id}渲染动作和woocommerce_update_options_{$tab_id}保存动作,核心不会自动为非内置标签注册这两个逻辑
  • 子分区导航是WC_Admin_Settings::output_fields()方法自动输出的,不需要手动写HTML

内容的提问来源于stack exchange,提问作者AJT

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.27 22:12:22