如何在WordPress中添加自定义文章排序功能?

玖比肆 WordPress 133

请提供在WordPress中创建和管理自定义文章排序功能的方法。

回复

共1条回复 我来回复
  • 玖比肆的头像
    玖比肆 评论

    1. 创建自定义文章类型

    要添加自定义文章排序功能,请首先创建自定义文章类型。使用函数register_post_type() 或插件“CPT UI”可快速创建。

    例如,要创建名为“产品”的自定义文章类型,可以添加以下代码:

    ```
    function create_product_post_type() {
    register_post_type( 'product',
    array(
    'labels' => array(
    'name' => __( 'Products' ),
    'singular_name' => __( 'Product' )
    ),
    'public' => true,
    'has_archive' => true,
    'supports' => array( 'title', 'editor', 'thumbnail' ),
    )
    );
    }
    add_action( 'init', 'create_product_post_type' );
    ```

    2. 为自定义文章类型添加排序功能

    添加自定义文章排序功能的方式有很多种,以下是其中两种常见的方法:

    方法一:通过插件

    为自定义文章类型添加排序功能的简单方法是使用“Post Types Order”插件。安装并激活该插件后,您可以转到设置- > PT Order页面,然后将自定义文章排序为所需顺序。此插件的好处是您无需编写代码即可轻松添加自定义文章排序功能。

    方法二:通过自定义功能

    使用自定义功能添加自定义文章排序功能的方法如下:

    1) 添加以下代码以向自定义文章类型添加自定义字段:

    ```
    function wpb_admin_enqueue_scripts() {
    global $pagenow, $typenow;
    if ( ( $pagenow == 'post.php' || $pagenow == 'post-new.php' ) && $typenow == 'product' ) {
    wp_enqueue_script( 'jquery-ui-sortable' );
    wp_enqueue_script( 'meta-box-sortable', get_stylesheet_directory_uri() . '/js/meta-box-sortable.js' );
    }
    }
    add_action( 'admin_enqueue_scripts', 'wpb_admin_enqueue_scripts' );

    function add_sortable_meta_box() {
    add_meta_box( 'product_sortable', 'Product Order', 'product_sortable_callback', 'product', 'normal', 'core' );
    }
    add_action( 'add_meta_boxes', 'add_sortable_meta_box' );

    function product_sortable_callback( $post ) {
    $products = get_posts( array(
    'post_type' => 'product',
    'posts_per_page' => -1,
    'orderby' => 'menu_order',
    'order' => 'ASC',
    'suppress_filters' => true,
    ) );

    wp_nonce_field( 'product_sortable_nonce', 'product_sortable_nonce' );

    echo '

      ';
      foreach ( $products as $product ) {
      echo '

    • ' . $product->post_title . '
    • ';
      }
      echo '

    ';
    }

    function save_product_sort_order( $post_id ) {
    if ( !isset( $_POST['product_sortable_nonce'] ) || !wp_verify_nonce( $_POST['product_sortable_nonce'], 'product_sortable_nonce' ) ) {
    return;
    }

    if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) {
    return;
    }

    if ( !current_user_can( 'edit_post', $post_id ) ) {
    return;
    }

    $products = explode( ',', sanitize_text_field( $_POST['product_order'] ) );

    foreach ( $products as $order => $product_id ) {
    update_post_meta( $product_id, 'menu_order', $order );
    }
    }
    add_action( 'save_post_product', 'save_product_sort_order' );
    ```

    2) 添加一些样式和脚本以创建可拖动的排序列表。可以在functions.php文件中添加以下代码:

    ```
    function custom_admin_styles() {
    wp_enqueue_style( 'wpb-admin-css', get_stylesheet_directory_uri() . '/css/admin.css' );
    }
    add_action( 'admin_print_styles', 'custom_admin_styles' );

    function custom_admin_scripts( $hook ) {
    global $typenow;
    if ( $typenow == 'product' || $hook == 'post-new.php' || $hook == 'post.php' ) {
    wp_enqueue_script( 'jquery-ui-sortable' );
    wp_enqueue_script( 'product-sorting', get_stylesheet_directory_uri() . '/js/product-sorting.js', array( 'jquery-ui-sortable' ) );
    }
    }
    add_action( 'admin_enqueue_scripts', 'custom_admin_scripts', 100 );
    ```

    3) 创建两个文件:admin.css和product-sorting.js。以下是示例代码:

    admin.css:

    ```
    #product_sortable .inside { margin: 0; padding: 0; }
    #product_sortable #products-list { margin: 0; padding: 0; list-style: none; }
    #product_sortable #products-list li { margin: 0; padding: 5px; background-color: #f9f9f9; border: 1px solid #ddd; cursor: move; }
    ```

    product-sorting.js:

    ```
    jQuery(document).ready(function($) {
    $('#products-list').sortable({
    update: function( event, ui ) {
    var order = $('#products-list').sortable('toArray');
    $('#product_order').val(order);
    }
    });
    });
    ```

    这些文件要放在主题文件夹中的“css”和“js”文件夹中。

    3. 总结

    以上是在WordPress中添加自定义文章排序功能的两种常见方法。如果您不想使用插件,构建自定义字段和编写相关代码是必需的。就速度而言,使用插件要更快速便捷。无论哪种方式,均需要具有基本的WordPress编程技能。

    2023年 5月 14日 上午7:40 0条评论
微信客服
分享本页
返回顶部
玖比肆(9Bi4)专注于帮助企业实现数字化转型,提供全方位的网站建设、网络运营、网络推广、网络营销和SEO优化等一系列数字化营销服务。