如何在Wagtail管理面板中自定义区块组的排序？

如果你已经完成区块分组但无法自定义排序，可根据你使用的编辑器环境，通过以下两种常见方式实现需求：

1. 注册分组时指定优先级（自定义区块场景） #

在注册区块组时，通过添加priority参数控制排序优先级——数值越小，组的展示位置越靠前。

示例代码（以WordPress Gutenberg为例）：

// 文本编辑器组（优先级1，确保排在最顶部）
wp.blocks.registerBlockCategory('text-editor', {
    title: '文本编辑器',
    icon: 'editor-textcolor',
    priority: 1
});

// 图片组（优先级2）
wp.blocks.registerBlockCategory('image-group', {
    title: '图片组',
    icon: 'format-image',
    priority: 2
});

// 轮播区块组（优先级3，与图片组相邻）
wp.blocks.registerBlockCategory('carousel-group', {
    title: '轮播区块',
    icon: 'slides',
    priority: 3
});

2. 用钩子重排已有分组（默认/第三方区块场景） #

如果是调整系统默认或第三方插件的区块组，可通过编辑器提供的钩子重新排序分组数组。

示例PHP代码（WordPress环境）：

function custom_block_category_order($categories) {
    // 定义你需要的排序顺序
    $desired_order = ['text-editor', 'image-group', 'carousel-group', 'common', 'embed'];
    
    $sorted_categories = [];
    // 先按自定义顺序添加目标组
    foreach ($desired_order as $slug) {
        foreach ($categories as $category) {
            if ($category->slug === $slug) {
                $sorted_categories[] = $category;
                break;
            }
        }
    }
    
    // 补充剩余未指定顺序的组
    foreach ($categories as $category) {
        if (!in_array($category->slug, $desired_order)) {
            $sorted_categories[] = $category;
        }
    }
    
    return $sorted_categories;
}
add_filter('block_categories_all', 'custom_block_category_order');

额外提示 #

• 如果你使用的是Elementor这类可视化编辑器，可先检查插件后台的「区块管理」或「面板设置」，部分插件支持直接拖拽排序区块组。
• 不同编辑器的API逻辑有差异，若上述方案不适用，可查阅编辑器官方文档的「区块分类」相关扩展接口。

内容的提问来源于stack exchange，提问作者Alessio Li Volsi