(91) 350-9520 support@omarine.org M-F: 7 AM - 7 PM; Weekends: 9 AM - 5 PM

Lập trình Web: PHP: WordPress: Xây dựng menu cài đặt và trang tùy chọn

Khi người sử dụng viết một bài sản phẩm, giá bán sản phẩm tính theo đơn vị tiền tệ được đặt trước. Chúng ta xây dựng menu cài đặt và trang tùy chọn cho phép người sử dụng chọn kiểu tiền tệ dùng để thanh toán


Mã chương trình đặt cùng plugin với post sản phẩm và dùng chung textdomain là “myproduct”.

function my_product_setting_init() {

    register_setting( 'my_product_setting', 'my_product_setting_options' );

    add_settings_section(
        'my_product_setting_section_1',
        __( 'General settings', 'myproduct' ),
        'my_product_setting_section_1_cb',
        'my_product_setting'
    );

    add_settings_field(
        'my_product_setting_field_currency',
        __( 'Currency', 'myproduct' ),
        'my_product_setting_field_currency_cb',
        'my_product_setting',
        'my_product_setting_section_1',
        [
            'label_for' => 'my_product_setting_field_currency',
            'class' => 'my_product_setting_row',
        ]
    );
}

add_action( 'admin_init', 'my_product_setting_init' );

Hàm my_product_setting_init() đăng ký trang tùy chọn “my_product_setting”. Trang này có một bộ phận “General settings”, trong đó có một trường là “Currency”. Mảng trong đối số của hàm add_settings_field() dùng để truyền tới hàm callback. Trong ví dụ, khóa “label_for” mang giá trị là id của trường.

Hàm callback của bộ phận “General settings” được định nghĩa như sau:

function my_product_setting_section_1_cb( $args ) {
    ?>
    <p id="<?php echo esc_attr( $args['id'] ); ?>"><?php esc_html_e( 'Currency option and the others', 'myproduct' ); ?></p>
    <?php
}

Tham số $args là một mảng có ba khóa là title, id và callback. Hàm callback này có nhiệm vụ kết xuất văn bản tại đỉnh của bộ phận (dưới tiêu đề và trên các trường).
Hàm callback của trường “Currency” có nhiệm vụ nạp vào trường các input cần thiết cho form nhập:

function my_product_setting_field_currency_cb( $args ) {

    $options = get_option( 'my_product_setting_options' );

    ?>
    <select id="<?php echo esc_attr( $args['label_for'] ); ?>"
    name="my_product_setting_options[<?php echo esc_attr( $args['label_for'] ); ?>]"
    >
    <option value="usd" <?php if ( isset( $options[ $args['label_for'] ] ) ) selected( $options[ $args['label_for'] ], 'usd' ); ?>>
    <?php esc_html_e( 'USD', 'myproduct' ); ?>
    </option>
    <option value="vnd" <?php if ( isset( $options[ $args['label_for'] ] ) ) selected( $options[ $args['label_for'] ], 'vnd' ); ?>>
    <?php esc_html_e( 'Vietnam dong', 'myproduct' ); ?>
    </option>
    </select>

    <p class="description">
    <?php echo esc_html__( 'You take the currency above for payment', 'myproduct' ) . '.'; ?>
    </p>

    <?php
}

Biến $options lấy giá trị đặt của trang tùy chọn. $options[ $args['label_for'] ] là mã mềm sử dụng tham số $args. Mã cứng $options[ 'my_product_setting_field_currency' ] không sử dụng tham số $args như chúng ta đã thực hiện khi viết post tùy biến.

Bây giờ chúng ta tạo một menu mức đỉnh:

function my_product_options_menu() {

    add_menu_page(
        __( 'My Products', 'myproduct' ),
        __('Product Options', 'myproduct' ),
        'manage_options',
        'my_product_setting',
        'my_product_options_menu_html',
        '',
        10
    );
}

add_action( 'admin_menu', 'my_product_options_menu' );

Title của trang là “My Products”, title của menu là “Product Options”. Năng lực yêu cầu cho menu này đối với người sử dụng là “manage_options”. Menu tham chiếu tới slug của trang tùy chọn “my_product_setting”, hàm callback có tên “my_product_options_menu_html”, sử dụng icon mặc định và có vị trí thứ 10.

Hàm callback được gọi để trình bày nội dung của trang:

function my_product_options_menu_html() {

    if ( ! current_user_can( 'manage_options' ) ) {
        return;
    }
    
    if ( isset( $_GET['settings-updated'] ) ) {
        add_settings_error( 'my_product_messages', 'my_product_message', __( 'Settings Saved', 'myproduct' ), 'updated' );
    } 
    settings_errors( 'my_product_messages' );
    ?>

    <div class="wrap">
    <h1><?php echo esc_html( get_admin_page_title() ); ?></h1>
    
    <form action="options.php" method="post">
    <?php
    settings_fields( 'my_product_setting' );
    do_settings_sections( 'my_product_setting' );
    submit_button( __('Save Settings', 'myproduct' ) );
    ?>
    </form>
    </div>
    <?php
}

Hàm sẽ trở về ngay nếu người sử dụng không có năng lực “manage_options”. Khi người sử dụng ấn “Lưu giữ những thay đổi”, WordPress thêm tham số “settings-updated” tới URL, rồi nó tồn tại trong $_GET. Nếu điều đó xảy ra chúng ta thêm thông điệp cài đặt kiểu “updated”.

Title được trình bày trên đỉnh của trang. Ở dưới là một form. Hàm settings_fields() kết xuất các trường an ninh(nonce, action, và option_page) cho trang tùy chọn “my_product_setting”. Tiếp theo, hàm do_settings_sections() kết xuất các bộ phận của trang. Cuối cùng, hàm submit_button() kết xuất nút “Save Settings”.

Advertisements

Gửi phản hồi

%d bloggers like this: