Thêm trường tùy chỉnh trong chỉnh sửa nhanh wordpress

Thay vào đó, chúng tôi phải thu thập các giá trị của mình bằng cách sử dụng JavaScript. Vì vậy, trước khi tiếp tục, chúng tôi sẽ đi vào mã PHP trước đó của mình và xóa giá trị lặp lại bằng cách thay thế dòng này…

…với cái này

Bước bốn. Truy xuất các giá trị đầu vào bằng cách sử dụng JS

Trước tiên, chúng tôi sẽ phải đưa vào tập lệnh JS của mình bằng cách thêm những dòng này vào tệp functions.php của bạn

// RETRIEVE FIELDS with JS
add_action( 'admin_enqueue_scripts', 'enqueue_admin_scripts_and_styles' ); 
function enqueue_admin_scripts_and_styles(){
    wp_enqueue_script('UNIQUE-SCRIPT-NAME', '/PATH-TO-YOUR-JS-FILE', array('jquery','inline-edit-post' ));
}

Vì vậy, nếu bạn tạo một tệp

add_action( 'save_post', 'update_source_custom_edit_box' );
function update_source_custom_edit_box() {
    if( isset( $_POST ) && isset( $_POST['source'] ) ) { 
        update_post_meta($_POST['post_ID'], 'source', $_POST['source']);
    }
    return;
}

// RETRIEVE FIELDS with JS
add_action( 'admin_enqueue_scripts', 'enqueue_admin_scripts_and_styles' ); 
function enqueue_admin_scripts_and_styles(){
    wp_enqueue_script('extend-quick-edit-script', get_template_directory_uri() . '/extend-quick-edit.js', array('jquery','inline-edit-post' ));
}

Trong

add_action( 'save_post', 'update_source_custom_edit_box' );
function update_source_custom_edit_box() {
    if( isset( $_POST ) && isset( $_POST['source'] ) ) { 
        update_post_meta($_POST['post_ID'], 'source', $_POST['source']);
    }
    return;
}

add_action( 'save_post', 'update_source_custom_edit_box' );
function update_source_custom_edit_box() {
    if( isset( $_POST ) && isset( $_POST['source'] ) ) { 
        update_post_meta($_POST['post_ID'], 'source', $_POST['source']);
    }
    return;
}

Trong

add_action( 'save_post', 'update_source_custom_edit_box' );
function update_source_custom_edit_box() {
    if( isset( $_POST ) && isset( $_POST['source'] ) ) { 
        update_post_meta($_POST['post_ID'], 'source', $_POST['source']);
    }
    return;
}

jQuery(document).ready(function($){

    var $inline_editor = inlineEditPost.edit;
    inlineEditPost.edit = function(id){

        $inline_editor.apply( this, arguments);

        var post_id = 0;
        if( typeof(id) == 'object'){
            post_id = parseInt(this.getId(id));
        }

        if(post_id != 0){
            $post_modified_col_value = $('#post-' + post_id).find('.source').text();	
            $('#edit-' + post_id + ' input[name=source]').val($post_modified_col_value);
        }
    }

});

Hãy phá vỡ một chút những gì chúng tôi đã làm ở đây

Lúc đầu, chúng tôi lấy đối tượng

add_action( 'save_post', 'update_source_custom_edit_box' );
function update_source_custom_edit_box() {
    if( isset( $_POST ) && isset( $_POST['source'] ) ) { 
        update_post_meta($_POST['post_ID'], 'source', $_POST['source']);
    }
    return;
}

add_action( 'save_post', 'update_source_custom_edit_box' );
function update_source_custom_edit_box() {
    if( isset( $_POST ) && isset( $_POST['source'] ) ) { 
        update_post_meta($_POST['post_ID'], 'source', $_POST['source']);
    }
    return;
}

add_action( 'save_post', 'update_source_custom_edit_box' );
function update_source_custom_edit_box() {
    if( isset( $_POST ) && isset( $_POST['source'] ) ) { 
        update_post_meta($_POST['post_ID'], 'source', $_POST['source']);
    }
    return;
}

Sau đó, chúng tôi sửa đổi chức năng của

add_action( 'save_post', 'update_source_custom_edit_box' );
function update_source_custom_edit_box() {
    if( isset( $_POST ) && isset( $_POST['source'] ) ) { 
        update_post_meta($_POST['post_ID'], 'source', $_POST['source']);
    }
    return;
}

Ghi chú. Trước khi tiếp tục, chúng tôi muốn nhắc bạn rằng nếu bạn nhìn vào trình kiểm tra phần tử, bạn sẽ nhận thấy rằng mỗi hàng trong bảng danh sách bài đăng có một id như “post-POSTID”. Ví dụ: “post-5” cho bài đăng có id 5. Ngoài ra, ô cột "Nguồn" tương ứng có lớp "nguồn". Hơn nữa, trong khu vực chỉnh sửa nhanh, đầu vào 'nguồn' có id như "chỉnh sửa-POSTID"

Vì vậy, trong các dòng tiếp theo của mã JS, điều cuối cùng chúng ta sẽ làm là thay thế giá trị của trường nhập 'Nguồn' của khu vực chỉnh sửa nhanh bằng giá trị của ô cột 'Nguồn'

Bây giờ tất cả sẽ hoạt động như mong đợi. Nếu bạn lưu giá trị và mở lại khu vực chỉnh sửa nhanh, đầu vào Nguồn cũng sẽ bị thay đổi

Với điều kiện là một trường tùy chỉnh đã được đăng ký cùng với cột tùy chỉnh của nó, quy trình làm việc của chúng tôi sẽ như thế này

Phần kết luận

Thêm trường tùy chỉnh vào mô-đun Chỉnh sửa nhanh của bảng Danh sách quản trị không dễ dàng. Tuy nhiên, nếu bạn đang thêm một trường được cập nhật thường xuyên thì rõ ràng nó có thể tiết kiệm rất nhiều thời gian về lâu dài. Như mọi khi, những gì có thể đạt được trong WordPress là vô hạn. Ngay lập tức, nó cho phép tùy chỉnh rộng rãi nhưng với một số mã hóa bổ sung, bạn không thể làm được gì nhiều