WordPress页面如何设置与页面标题不同的自定义H1标签

核心前提：必须替换/移除主题默认绑定页面标题的H1输出逻辑，不能直接在正文里额外加H1，否则必然出现双H1问题。 #

方法1：子主题覆写模板（最稳定，无额外插件依赖） #

• 不要直接修改父主题文件，先创建对应主题的子主题，所有修改在子主题内完成，避免主题更新后配置丢失。
• 找到主题负责渲染单页面的模板文件，通常主题目录下的page.php、template-parts/content/page.php、content-page.php都是常见的存放位置。
• 在模板文件中找到默认输出页面H1的代码段，绝大多数主题的写法类似：

<h1 class="post-title entry-title"><?php the_title(); ?></h1>

• 将这段默认代码替换为支持自定义字段 fallback 的逻辑：有自定义H1时输出自定义内容，没有设置时仍输出原页面标题，不影响其他普通页面：

<?php
$page_id = get_the_ID();
$custom_h1 = get_post_meta($page_id, 'custom_page_h1', true);
$final_h1 = $custom_h1 ?: get_the_title($page_id);
?>
<h1 class="post-title entry-title"><?php echo esc_html($final_h1); ?></h1>

• 代码保存后，回到WordPress后台编辑需要自定义H1的页面，在编辑器右上角打开「选项→偏好设置」，勾选显示「自定义字段」面板，新增键名为custom_page_h1的字段，字段值填写你需要的自定义H1内容即可。

方法2：无代码可视化配置（适合非技术用户） #

• 若使用WordPress官方FSE全站编辑类区块主题（如Twenty Twenty系列默认主题）：进入「外观→编辑器→模板」，选择「页面」模板，删除模板中默认绑定页面标题的H1区块，替换为可手动编辑内容的标题区块并设置层级为H1，后续编辑单个页面时可直接修改该H1内容，系统不会重复输出原页面标题。
• 若使用Elementor、Beaver Builder等第三方页面构建器：编辑对应页面时，先在构建器设置中找到「隐藏页面标题」选项开启（或直接删除主题默认输出的标题组件），再拖入一个标题组件，设置标题层级为H1，输入自定义内容即可。

方法3：函数钩子过滤（适合不想改动模板文件的场景） #

将以下代码添加到子主题的functions.php文件中，通过WordPress原生的the_title过滤器替换主循环内的页面标题输出，代码自带判断逻辑，不会影响导航菜单、侧边栏小工具内的其他标题输出：

function custom_page_h1_replace($title, $post_id) {
    if (is_admin() || !is_page() || !in_the_loop() || !is_main_query()) {
        return $title;
    }
    $custom_h1 = get_post_meta($post_id, 'custom_page_h1', true);
    return $custom_h1 ?: $title;
}
add_filter('the_title', 'custom_page_h1_replace', 10, 2);

校验提示：所有配置完成后，打开对应页面的前端，右键查看网页源代码，全局搜索<h1标签，确认整页仅存在1个H1节点即可，部分SEO插件如果开启了自动插入H1的功能，记得同步关闭对应选项，避免重复。

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