You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在WordPress表单下拉框中展示分类的父子层级关系?

WordPress分类选择字段实现父子层级缩进的标准方法

WordPress没有直接输出带层级缩进下拉的原生函数,但可以通过内置的分类查询工具配合简单的自定义逻辑实现,这是行业内的标准做法,以下是具体方案:

一、原生PHP开发表单的实现方式

1. 获取排序后的分类数据

使用get_terms()(支持自定义分类法)或wp_get_categories()(仅针对默认文章分类)获取按字母排序、包含父子关系的分类数据:

$categories = get_terms(array(
    'taxonomy' => 'category', // 替换为你的自定义分类法slug(如果需要)
    'hide_empty' => false,
    'orderby' => 'name',
    'order' => 'ASC',
    'hierarchical' => true
));

2. 递归生成带层级缩进的下拉选项

编写递归函数遍历分类,为子分类添加前缀(短横线或空格缩进):

function generate_category_options($categories, $parent_id = 0, $depth = 0) {
    $options = '';
    // 用短横线作为层级标识,也可以用  实现视觉缩进
    $prefix = str_repeat('- ', $depth);
    
    foreach ($categories as $category) {
        if ($category->parent == $parent_id) {
            $options .= sprintf(
                '<option value="%d">%s%s</option>',
                $category->term_id,
                $prefix,
                esc_html($category->name)
            );
            // 递归处理当前分类的子分类
            $options .= generate_category_options($categories, $category->term_id, $depth + 1);
        }
    }
    return $options;
}

3. 输出表单字段

将生成的选项插入到select标签中:

<select name="category-select" id="category-select">
    <option value="">请选择分类</option>
    <?php echo generate_category_options($categories); ?>
</select>

这段代码会按字母顺序展示分类,子分类自动添加对应层级的短横线前缀,比如cat-1的子分类cat-4会显示为- cat-4,二级子分类则显示为- - cat-x。

二、表单插件的标准实现

如果使用主流表单插件,可以直接借助插件的内置功能:

  • Gravity Forms:在分类选择字段的设置中,开启「显示层级」选项,插件会自动生成带缩进的下拉选项,无需额外代码。
  • Contact Form 7:默认短代码[select* category include_children:1 order_by:name]会包含子分类,但无缩进,可通过自定义CSS或修改插件输出逻辑添加层级样式。

注意事项

  • 若使用自定义分类法,需将taxonomy参数替换为你的分类法slug。
  • 可根据视觉需求调整缩进前缀,比如用&nbsp;&nbsp;替代短横线,实现纯缩进效果。
  • 始终用esc_html()转义分类名称,避免XSS安全风险。

内容的提问来源于stack exchange,提问作者Mance Rah

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.14 13:35:13