WordPress自定义分类法edit_tags钩子元框位置上移问题咨询

问题原因 #

WordPress核心对分类法添加页和编辑页的表单钩子位置设计存在原生差异：

• {$taxonomy}_add_form_fields 钩子默认挂载在添加分类页的「标题/别名/描述」默认字段之后，默认优先级挂载即可得到预期位置
• {$taxonomy}_edit_form_fields 钩子默认挂载在编辑分类页的「标题/别名/描述」默认字段之前，优先级仅能控制同一钩子下多个函数的执行顺序，无法改变钩子本身的页面位置，因此直接挂载会出现元框上移的问题

解决方案 #

更换编辑页的挂载钩子，使用{$taxonomy}_edit_form替代原有钩子，同时调整优先级为20（高于默认值10，确保在默认字段渲染完成后执行），再适配不同页面的DOM渲染结构即可。

代码修改示例 #

1. 钩子挂载代码修改 #

// 添加分类页保持原逻辑不变
add_action( 'barcomp_room_add_form_fields', [ $barcomp_settings, 'show_room_taxonomy_meta_boxes' ] );
// 编辑分类页更换钩子，设置优先级为20
add_action( 'barcomp_room_edit_form', [ $barcomp_settings, 'show_room_taxonomy_meta_boxes' ], 20 );

2. 元框渲染方法适配 #

由于添加页和编辑页的表单DOM结构规范不同，需要在渲染方法中判断场景输出对应结构，避免样式错乱：

// 原show_room_taxonomy_meta_boxes方法修改为如下逻辑
public function show_room_taxonomy_meta_boxes( $term = null ) {
    // 传入$term参数为编辑页场景，否则为添加页场景
    $field_value = $term ? get_term_meta( $term->term_id, '你要存储的元字段键名', true ) : '';

    if ( $term ) {
        // 编辑页输出符合WordPress后台规范的表格结构
        echo '<table class="form-table"><tbody>';
        ?>
        <tr class="form-field">
            <th scope="row"><label for="custom_field_id">自定义字段名称</label></th>
            <td>
                <input type="text" name="custom_field_name" id="custom_field_id" value="<?php echo esc_attr( $field_value ); ?>" />
                <p class="description">这里写字段的说明提示文字</p>
            </td>
        </tr>
        <?php
        echo '</tbody></table>';
    } else {
        // 添加页输出符合规范的流式div结构
        ?>
        <div class="form-field">
            <label for="custom_field_id">自定义字段名称</label>
            <input type="text" name="custom_field_name" id="custom_field_id" value="<?php echo esc_attr( $field_value ); ?>" />
            <p class="description">这里写字段的说明提示文字</p>
        </div>
        <?php
    }
}

补充说明 #

分类法元数据的保存逻辑无需调整，仍可通过created_barcomp_room和edited_barcomp_room钩子挂载保存函数处理提交数据即可。

内容的提问来源于stack exchange，提问作者Colin T aka ManiacalV