如何在WordPress自定义器中为主题小部件创建自定义分类

实现思路 #

要在自定义器中将小部件按页面分组，需完成两个核心操作：

1. 在自定义器中创建对应页面的面板（Panel）和区域（Section），作为分组容器。
2. 将已注册的侧边栏小部件控件，绑定到对应的自定义面板/区域中。

具体代码实现 #

1. 注册自定义面板与区域 #

在主题的functions.php中添加以下代码，创建分组所需的面板和对应区域：

function theme_custom_widget_panels( $wp_customize ) {
    // 首页小部件面板
    $wp_customize->add_panel( 'home_widgets_panel', array(
        'title'       => __( '首页小部件', 'text_domain' ),
        'description' => __( '管理首页专属的小部件区域', 'text_domain' ),
        'priority'    => 30, // 调整优先级控制面板显示顺序
    ) );

    // 对应首页的index_widget_one小部件区域
    $wp_customize->add_section( 'home_index_widget_section', array(
        'title'    => __( '首页文本调整区域', 'text_domain' ),
        'panel'    => 'home_widgets_panel',
        'priority' => 10,
    ) );

    // 文章页小部件面板
    $wp_customize->add_panel( 'single_widgets_panel', array(
        'title'       => __( '文章页小部件', 'text_domain' ),
        'description' => __( '管理文章页专属的小部件区域', 'text_domain' ),
        'priority'    => 31,
    ) );

    // 假设你有文章页侧边栏id为single_sidebar，创建对应区域
    $wp_customize->add_section( 'single_sidebar_section', array(
        'title'    => __( '文章页侧边栏', 'text_domain' ),
        'panel'    => 'single_widgets_panel',
        'priority' => 10,
    ) );

    // 全局小部件面板（比如页脚）
    $wp_customize->add_panel( 'global_widgets_panel', array(
        'title'       => __( '全局小部件', 'text_domain' ),
        'description' => __( '管理页脚等全局通用的小部件区域', 'text_domain' ),
        'priority'    => 32,
    ) );

    // 对应页脚的footerSite小部件区域
    $wp_customize->add_section( 'footer_widget_section', array(
        'title'    => __( '页脚内容区域', 'text_domain' ),
        'panel'    => 'global_widgets_panel',
        'priority' => 10,
    ) );
}
add_action( 'customize_register', 'theme_custom_widget_panels' );

2. 绑定小部件到对应区域 #

添加以下代码，将每个侧边栏小部件映射到我们创建的自定义区域：

function assign_widgets_to_custom_sections( $args, $control ) {
    // 仅处理小部件类型的控件
    if ( $control instanceof WP_Customize_Widgets_Control ) {
        $sidebar_id = $control->id_data['keys'][0];
        
        // 根据侧边栏ID分配到对应区域
        switch ( $sidebar_id ) {
            case 'index_widget_one':
                $args['section'] = 'home_index_widget_section';
                break;
            case 'footerSite':
                $args['section'] = 'footer_widget_section';
                break;
            case 'single_sidebar': // 替换为你的文章页侧边栏ID
                $args['section'] = 'single_sidebar_section';
                break;
            // 继续添加其他侧边栏的映射关系
            // case '你的侧边栏ID':
            //     $args['section'] = '对应区域的ID';
            //     break;
        }
    }
    return $args;
}
add_filter( 'customize_control_args', 'assign_widgets_to_custom_sections', 10, 2 );

3. （可选）隐藏默认「Widgets」区域 #

如果不想让用户看到自定义器中原有的「Widgets」标签，可以添加以下代码移除它：

function remove_default_widgets_section( $wp_customize ) {
    $wp_customize->remove_section( 'widgets' );
}
add_action( 'customize_register', 'remove_default_widgets_section', 20 );

注意事项 #

• 替换代码中的text_domain为你主题的文本域。
• 对于你创建的另外8个小部件，只需在switch语句中添加对应的case，将侧边栏ID映射到自定义区域ID即可。
• 后台「外观 > 小部件」面板不受影响，用户可根据习惯选择编辑方式。

内容的提问来源于stack exchange，提问作者php