在Wordpress管理中保存使用jQuery排序的post类型排序顺序

function add_custom_meta_box() {
    add_meta_box(
        'post_order',
        'Post Order',
        'render_custom_meta_box',
        'post',
        'normal',
        'default'
    );
}
add_action('add_meta_boxes', 'add_custom_meta_box');

function render_custom_meta_box($post) {
    $order = get_post_meta($post->ID, 'post_order', true);
    ?>
    <label for="post_order">Order:</label>
    <input type="text" id="post_order" name="post_order" value="<?php echo esc_attr($order); ?>">
    <?php
}

function save_custom_meta_box($post_id) {
    if (array_key_exists('post_order', $_POST)) {
        update_post_meta(
            $post_id,
            'post_order',
            sanitize_text_field($_POST['post_order'])
        );
    }
}
add_action('save_post', 'save_custom_meta_box');

function enqueue_custom_scripts() {
    wp_enqueue_script('jquery-ui-sortable');
    wp_enqueue_script('custom-script', get_template_directory_uri() . '/js/custom-script.js', array('jquery'), '1.0', true);
}
add_action('wp_enqueue_scripts', 'enqueue_custom_scripts');

jQuery(document).ready(function($) {
    $('#sortable').sortable({
        update: function(event, ui) {
            var order = '';
            $('#sortable li').each(function() {
                order += $(this).data('post-id') + ',';
            });
            $('#post_order').val(order);
        }
    });
});

<ul id="sortable">
    <?php
    $args = array(
        'post_type' => 'post',
        'orderby' => 'meta_value',
        'meta_key' => 'post_order',
        'order' => 'ASC',
        'posts_per_page' => -1
    );
    $query = new WP_Query($args);
    while ($query->have_posts()) {
        $query->the_post();
        ?>
        <li data-post-id="<?php the_ID(); ?>"><?php the_title(); ?></li>
        <?php
    }
    wp_reset_postdata();
    ?>
</ul>