Buat halaman tetapan WooCommerce yang diperibadikan dengan bahagian khusus

Question

Saya cuba menambah tab tetapan tersuai pada skrin tetapan WooCommerce. Pada asasnya saya ingin mencapai fungsi yang serupa dengan tab Tetapan Produk melalui subseksyen/subtab:

Saya tidak menemui sebarang dokumentasi yang baik tentang cara melakukan ini, tetapi saya telah dapat menambah tab tersuai menggunakan coretan berikut:

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();

Berdasarkan perkara yang saya gali daripada pelbagai utas/tutorial, saya telah cuba menambah bahagian/subtab pada tab tetapan baharu seperti ini:

// 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;
    }
}

Saya telah dapat menambahkan subseksyen baharu pada tab Produk menggunakan kod yang serupa dengan di atas, tetapi ia tidak berfungsi dengan tab tersuai baharu saya. Di mana salah saya?

Answer 1

1) Untuk menambah tab tetapan dengan bahagian anda boleh menggunakan woocommerce_settings_tabs_array cangkuk penapis:

// 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) Untuk menambah bahagian baharu pada halaman yang anda boleh gunakan woocommerce_sections_{$current_tab} 复合挂钩，其中 {$current_tab}Perlu diganti dengan set slug kunci dalam fungsi pertama:

// 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)Untuk menambah tetapan serta memproses/menyimpan kami akan menggunakan fungsi tersuai dan kemudian memanggil fungsi itu:

// 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) Tambah tetapan melalui woocommerce_settings_{$current_tab} cangkuk kompaun:

// 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) Kendalikan/simpan tetapan melalui woocommerce_settings_save_{$current_tab} cangkuk kompaun:

// 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 );

---

Hasil:

---

Berdasarkan:

• Laksanakan halaman tetapan WooCommerce tersuai, termasuk bahagian halaman
• woocommerce/termasuk/admin/tetapan/