建站技巧

WordPress 在文章列表快速编辑中编辑自定义字段

 2个月前 (12-10)     248  
文章目录

在快速编辑中添加自定义字段,通常我们不需要在 WordPress 后台文章列表的“快速编辑”菜单中进行更改,但有的时候如果可以把常用的设置添加到“快速编辑”菜单里,可以节省您很多时间。如下方 gif 的操作,在列表快速编辑排序。

WordPress 在文章列表快速编辑中编辑自定义字段

1. 添加列

这里以 WebStack 导航主题的自定义文章类型“sites”(网址)为例,注意修改下面代码的sites字眼为自己的。

瞎折腾 WordPress 版 WebStack 导航主题使用说明,更新于20200115 之前一直把浏览器首页设为好123,自己加了好多收藏的网址,但是现在好123下面…… 5个月前 (08-30) 8,569 267

这里添加两个选项-排序和可见性选项。下面的代码是针对sites自定义类型的,记得修改。

/**
 * 文章列表添加自定义字段
 * https://www.iowen.cn/wordpress-quick-edit
 */

//如果是默认文章,请使用 manage_post_posts_columns 钩子,这里是自定义文章类型 sites
add_filter('manage_edit-sites_columns', 'io_ordinal_manage_posts_columns');
function io_ordinal_manage_posts_columns($columns){
    $columns['ordinal']    = '排序'; 
    $columns['visible']    = '可见性'; 
    return $columns;
}
add_action('manage_posts_custom_column','io_ordinal_manage_posts_custom_column',10,2);
function io_ordinal_manage_posts_custom_column($column_name,$id){ 
    switch( $column_name ) :
        case 'ordinal': {
            echo get_post_meta($id, '_sites_order', true);
            break;
        }
        case 'visible': {
            echo get_post_meta($id, '_visible', true)? "管理员" : "所有人";
            break;
        }
    endswitch;
}

添加了列之后,你也可以使用CSS来使其中的一些列变得更宽或更窄。如下示例

add_action( 'admin_head', 'io_custom_css' );
function io_custom_css(){
    echo '<style>
        #ordinal{/*名称与上方代码对应*/
            width:80px;
        } 
    </style>';
}

2. 添加快速编辑表单

使用quick_edit_custom_box钩子。

add_action('quick_edit_custom_box',  'io_add_quick_edit', 10, 2);
function io_add_quick_edit($column_name, $post_type) {
    if ($column_name == 'ordinal') {//值与前方代码对应
        //请注意:<fieldset>类可以是:
        //inline-edit-col-left,inline-edit-col-center,inline-edit-col-right
        //所有列均为float:left,
        //因此,如果要在左列,请使用clear:both元素
        echo '
        <fieldset class="inline-edit-col-left" style="clear: both;">
            <div class="inline-edit-col"> 
                <label class="alignleft">
                    <span class="title">排序</span>
                    <span class="input-text-wrap"><input type="number" name="ordinal" class="ptitle" value=""></span>
                </label> 
                <em class="alignleft inline-edit-or"> 越大越靠前</em>
            </div>
        </fieldset>';
    }
}

完成此步骤后,字段应出现在“快速编辑”中。不用担心这些字段的值是否为空,我们将在最后一步中填充它们。

3. 保存字段

/** 
 * 文章列表添加自定义字段 
 * https://www.iowen.cn/wordpress-quick-edit
 */
add_action('save_post', 'io_save_quick_edit_data');
function io_save_quick_edit_data($post_id) {
    //如果是自动保存日志,并非我们所提交数据,那就不处理
    if ( defined('DOING_AUTOSAVE') && DOING_AUTOSAVE )
        return $post_id;
    // 验证权限,'sites' 为文章类型,默认为 'post' ,这里为我自定义的文章类型'sites'
    if ( 'sites' == $_POST['post_type'] ) {
        if ( !current_user_can( 'edit_page', $post_id ) )
            return $post_id;
    } else {
        if ( !current_user_can( 'edit_post', $post_id ) )
        return $post_id;
    }  
    $post = get_post($post_id); 
    // 'ordinal' 与前方代码对应
    if (isset($_POST['ordinal']) && ($post->post_type != 'revision')) {
        $left_menu_id = esc_attr($_POST['ordinal']);
        if ($left_menu_id)
            update_post_meta( $post_id, '_sites_order', $left_menu_id);// ‘_sites_order’为自定义字段
    } 
}

完成此步骤后,单击“更新”按钮,应在自定义列中已经更新了“快速编辑”字段。

4. 加载默认数据

因为第2步添加的表单不能获取文章的默认值,为了编辑方便,所有需要将默认值赋予表单

/**
 * 文章列表添加自定义字段
 * https://www.iowen.cn/wordpress-quick-edit
 */
add_action('admin_footer', 'ashuwp_quick_edit_javascript');
function ashuwp_quick_edit_javascript() {
    $current_screen = get_current_screen(); 
    //条件判断,注意修改为对应值
    if (!is_object($current_screen) || ($current_screen->post_type != 'sites'))return;
    if($current_screen->id == 'edit-sites'){
    //修改下方 js 代码中的 ordinal 为前方代码对应的值
    echo"
    <script type='text/javascript'>
    jQuery(function($){
        var wp_inline_edit_function = inlineEditPost.edit;
        inlineEditPost.edit = function( post_id ) {
            wp_inline_edit_function.apply( this, arguments );
            var id = 0;
            if ( typeof( post_id ) == 'object' ) {
                id = parseInt( this.getId( post_id ) );
            }
            if ( id > 0 ) {
                var specific_post_edit_row = $( '#edit-' + id ),
                    specific_post_row = $( '#post-' + id ),
                    product_price = $( '.column-ordinal', specific_post_row ).text(); 

                $('input[name=\"ordinal\"]', specific_post_edit_row ).val( product_price ); 
            }
        }
    });
    </script>";
    } 
}

好了,现在可以快速编辑排序了,还可以为列表添加分类过滤器,选择分类单独调整分类下网址的排序。添加方法下面继续 :wink:

5. 添加分类过滤器

/**
 * 文章列表添加自定义字段
 * https://www.iowen.cn/wordpress-quick-edit
 */
//此部分功能是生成分类下拉菜单
add_action('restrict_manage_posts','io_post_type_filter',10,2);
function io_post_type_filter($post_type, $which){
    if('sites' !== $post_type){ //这里为自定义文章类型,需修改
      return; //检查是否是我们需要的文章类型
    }
    $taxonomy_slug     = 'favorites'; //这里为自定义分类法,需修改
    $taxonomy          = get_taxonomy($taxonomy_slug);
    $selected          = '';
    $request_attr      = 'favorites'; //这里为自定义分类法,需修改
    if ( isset($_REQUEST[$request_attr] ) ) {
      $selected = $_REQUEST[$request_attr];
    }
    wp_dropdown_categories(array(
      'show_option_all' =>  __("所有{$taxonomy->label}"),
      'taxonomy'        =>  $taxonomy_slug,
      'name'            =>  $request_attr,
      'orderby'         =>  'name',
      'selected'        =>  $selected,
      'hierarchical'    =>  true,
      'depth'           =>  5,
      'show_count'      =>  true,  
      'hide_empty'      =>  false,  
    ));
}
//此部分功能是列出指定分类下的所有文章
add_filter('parse_query','io_work_convert_restrict'); 
function io_work_convert_restrict($query) {  
    global $pagenow;  
    global $typenow;  
    if ($pagenow=='edit.php') {  
        $filters = get_object_taxonomies($typenow);  
        foreach ($filters as $tax_slug) {  
            $var = &$query->query_vars[$tax_slug];  
            if ( isset($var) && $var>0) {  
                $term = get_term_by('id',$var,$tax_slug);  
                $var = $term->slug;  
            }  
        }  
    }  
    return $query;  
}

完成,点赞,哦...还是点广告吧 :mrgreen:

分类列表

分类列表也是可以这样编辑的,使用manage_edit-分类法名_columnsmanage_分类法名_custom_column这两个钩子完成第1步,第2步和上方相同,第3步使用add_action('edit_分类法名','function',10,1);钩子,第4步js代码中的inlineEditPost改为inlineEditTax和一些标签的修改,就可以实现分类列表的快速编辑了。

WordPress 在文章列表快速编辑中编辑自定义字段
版权声明:一为 发表于 2个月前 (12-10),共 4685 字。
转载请注明:WordPress 在文章列表快速编辑中编辑自定义字段 | 一为忆

暂无评论

暂无评论...
2019/12/2 17:30
WebStack 导航主题升级 Font Awesome 5 图标库 详情