我正在尝试将自定义设置选项卡添加到 WooCommerce 设置屏幕。基本上我想通过子部分/子选项卡实现与“产品设置”选项卡类似的功能：
我还没有找到任何关于如何执行此操作的像样文档，但我已经能够使用以下代码段添加自定义选项卡：
class WC_Settings_Tab_Demo {
public static function init() {
add_filter( 'woocommerce_settings_tabs_array', __CLASS__ . '::add_settings_tab', 50 );
}
public static function add_settings_tab( $settings_tabs ) {
$settings_tabs['test'] = __( 'Settings Demo Tab', 'woocommerce-settings-tab-demo' );
return $settings_tabs;
}
}
WC_Settings_Tab_Demo::init();
根据我从各种线程/教程中挖掘出的内容，我一直在尝试将部分/子选项卡添加到新的设置选项卡中，如下所示：
// creating a new sub tab in API settings
add_filter( 'woocommerce_get_sections_test','add_subtab' );
function add_subtab( $sections ) {
$sections['custom_settings'] = __( 'Custom Settings', 'woocommerce-custom-settings-tab' );
$sections['more_settings'] = __( 'More Settings', 'woocommerce-custom-settings-tab' );
return $sections;
}
// adding settings (HTML Form)
add_filter( 'woocommerce_get_settings_test', 'add_subtab_settings', 10, 2 );
function add_subtab_settings( $settings, $current_section ) {
// $current_section = (isset($_GET['section']) && !empty($_GET['section']))? $_GET['section']:'';
if ( $current_section == 'custom_settings' ) {
$custom_settings = array();
$custom_settings[] = array( 'name' => __( 'Custom Settings', 'text-domain' ),
'type' => 'title',
'desc' => __( 'The following options are used to ...', 'text-domain' ),
'id' => 'custom_settings'
);
$custom_settings[] = array(
'name' => __( 'Field 1', 'text-domain' ),
'id' => 'field_one',
'type' => 'text',
'default' => get_option('field_one'),
);
$custom_settings[] = array( 'type' => 'sectionend', 'id' => 'test-options' );
return $custom_settings;
} else {
// If not, return the standard settings
return $settings;
}
}
我已经能够使用与上面类似的代码向“产品”选项卡添加新的小节，但它不适用于我的新自定义选项卡。我哪里出错了？
1) 要添加包含部分的设置选项卡，您可以首先使用
woocommerce_settings_tabs_array过滤器挂钩：// Add the tab to the tabs array function filter_woocommerce_settings_tabs_array( $settings_tabs ) { $settings_tabs['my-custom-tab'] = __( 'My custom tab', 'woocommerce' ); return $settings_tabs; } add_filter( 'woocommerce_settings_tabs_array', 'filter_woocommerce_settings_tabs_array', 99 );2) 要向页面添加新部分，您可以使用
woocommerce_sections_{$current_tab}复合挂钩，其中{$current_tab}需要替换为第一个函数中设置的键 slug：// Add new sections to the page function action_woocommerce_sections_my_custom_tab() { global $current_section; $tab_id = 'my-custom-tab'; // Must contain more than one section to display the links // Make first element's key empty ('') $sections = array( '' => __( 'Overview', 'woocommerce' ), 'my-section-1' => __( 'My section 1', 'woocommerce' ), 'my-section-2' => __( 'My section 2', 'woocommerce' ) ); echo ''; $array_keys = array_keys( $sections ); foreach ( $sections as $id => $label ) { echo '-
' . $label . ' ' . ( end( $array_keys ) == $id ? '' : '|' ) . '
';
}
echo '
'; } add_action( 'woocommerce_sections_my-custom-tab', 'action_woocommerce_sections_my_custom_tab', 10 );
3)为了添加设置以及处理/保存，我们将使用自定义函数，然后调用该函数：
// Settings function function get_custom_settings() { global $current_section; $settings = array(); if ( $current_section == 'my-section-1' ) { // My section 1 $settings = array( // Title array( 'title' => __( 'Your title 1', 'woocommerce' ), 'type' => 'title', 'id' => 'custom_settings_1' ), // Text array( 'title' => __( 'Your title 1.1', 'text-domain' ), 'type' => 'text', 'desc' => __( 'Your description 1.1', 'woocommerce' ), 'desc_tip' => true, 'id' => 'custom_settings_1_text', 'css' => 'min-width:300px;' ), // Select array( 'title' => __( 'Your title 1.2', 'woocommerce' ), 'desc' => __( 'Your description 1.2', 'woocommerce' ), 'id' => 'custom_settings_1_select', 'class' => 'wc-enhanced-select', 'css' => 'min-width:300px;', 'default' => 'aa', 'type' => 'select', 'options' => array( 'aa' => __( 'aa', 'woocommerce' ), 'bb' => __( 'bb', 'woocommerce' ), 'cc' => __( 'cc', 'woocommerce' ), 'dd' => __( 'dd', 'woocommerce' ), ), 'desc_tip' => true, ), // Section end array( 'type' => 'sectionend', 'id' => 'custom_settings_1' ), ); } elseif ( $current_section == 'my-section-2' ) { // My section 2 $settings = array( // Title array( 'title' => __( 'Your title 2', 'woocommerce' ), 'type' => 'title', 'id' => 'custom_settings_2' ), // Text array( 'title' => __( 'Your title 2.2', 'text-domain' ), 'type' => 'text', 'desc' => __( 'Your description 2.1', 'woocommerce' ), 'desc_tip' => true, 'id' => 'custom_settings_2_text', 'css' => 'min-width:300px;' ), // Section end array( 'type' => 'sectionend', 'id' => 'custom_settings_2' ), ); } else { // Overview $settings = array( // Title array( 'title' => __( 'Overview', 'woocommerce' ), 'type' => 'title', 'id' => 'custom_settings_overview' ), // Section end array( 'type' => 'sectionend', 'id' => 'custom_settings_overview' ), ); } return $settings; }3.1) 通过
woocommerce_settings_{$current_tab}复合挂钩添加设置：// Add settings function action_woocommerce_settings_my_custom_tab() { // Call settings function $settings = get_custom_settings(); WC_Admin_Settings::output_fields( $settings ); } add_action( 'woocommerce_settings_my-custom-tab', 'action_woocommerce_settings_my_custom_tab', 10 );3.2) 通过
woocommerce_settings_save_{$current_tab}复合挂钩处理/保存设置：// Process/save the settings function action_woocommerce_settings_save_my_custom_tab() { global $current_section; $tab_id = 'my-custom-tab'; // Call settings function $settings = get_custom_settings(); WC_Admin_Settings::save_fields( $settings ); if ( $current_section ) { do_action( 'woocommerce_update_options_' . $tab_id . '_' . $current_section ); } } add_action( 'woocommerce_settings_save_my-custom-tab', 'action_woocommerce_settings_save_my_custom_tab', 10 );结果：
基于：