如何在WordPress全站点编辑中为模板部件添加ID

WordPress的模板部件块默认不支持直接设置ID属性，结合你不使用包装器、避免JS的要求，有两种可靠实现方式：

方法一：直接修改模板部件HTML文件 #

打开你的模板部件文件 /parts/template.html，在最外层容器标签上手动添加id="my-ID"。

比如原模板部件最外层代码：

<div class="wp-block-template-part">
  <!-- 模板部件内容 -->
</div>

修改为：

<div id="my-ID" class="wp-block-template-part template">
  <!-- 模板部件内容 -->
</div>

如果保留块调用里的className设置，也可以只添加ID，类名由块属性自动注入。

方法二：通过PHP过滤器修改输出 #

在主题的functions.php文件中添加以下代码，利用render_block过滤器为指定slug的模板部件添加ID：

add_filter('render_block', function($block_content, $block) {
    // 仅匹配slug为"template"的模板部件块
    if ($block['blockName'] === 'core/template-part' && isset($block['attrs']['slug']) && $block['attrs']['slug'] === 'template') {
        // 替换容器起始标签，插入ID属性
        $block_content = preg_replace('/^<div class="/', '<div id="my-ID" class="', $block_content);
    }
    return $block_content;
}, 10, 2);

这种方式无需修改模板文件，通过代码精准控制指定部件的输出。

注意事项 #

• 方法一中，若模板部件最外层不是div标签，需对应修改标签类型（如section、header等）。
• 方法二中的正则表达式可根据实际输出调整，确保匹配准确。

内容的提问来源于stack exchange，提问作者zeug