WordPress中为特定页面标题添加指定链接时保存异常，如何解决？

当然可以实现这个需求！你遇到的显示异常问题，大概率是因为WordPress的编辑器或默认标题输出逻辑会自动过滤HTML标签，导致你的链接代码被转义或丢失。下面给你几个靠谱的实现方法，按需选择：

方法1：直接修改主题模板（精准控制特定页面） #

这个方法适合有基础代码能力的用户，能精准控制按钮显示的位置和页面：

1. 找到你主题中负责输出页面标题的模板文件，通常是page.php、header.php，或者主题template-parts目录下的content-page.php这类文件；
2. 找到输出标题的代码，一般是the_title()函数——这个函数默认会转义HTML，所以我们要针对特定页面调整输出逻辑：

<?php
// 替换成你的目标页面ID、slug或标题
$target_page_slug = 'your-target-page-slug';
if ( is_page( $target_page_slug ) ) : ?>
    <h1 class="page-title">
        <?php the_title(); ?>
        <!-- 把你的按钮代码放在这里，位置可以自己调整 -->
        <a id="info-button" href="#" target="_blank"><i class="material-icons">info</i></a>
    </h1>
<?php else : ?>
    <h1 class="page-title"><?php the_title(); ?></h1>
<?php endif; ?>

3. 保存文件后刷新页面，目标页面的标题旁就会显示你要的按钮了。

方法2：用自定义字段实现（无需硬编码页面信息） #

如果不想在模板里固定页面信息，用自定义字段更灵活：

1. 编辑目标页面，在页面编辑器的「选项」里开启「自定义字段」（如果没显示，去右上角的「屏幕选项」里勾选）；
2. 添加一个新的自定义字段：
   • 键（名称）：info_button
   • 值：<a id="info-button" href="#" target="_blank"><i class="material-icons">info</i></a>
3. 修改主题的标题输出代码，改成：

<h1 class="page-title">
    <?php the_title(); ?>
    <?php
    // 获取自定义字段的值，存在则输出
    $info_button = get_post_meta( get_the_ID(), 'info_button', true );
    if ( $info_button ) {
        echo $info_button;
    }
    ?>
</h1>

这样只要给页面添加了这个自定义字段，标题旁就会显示按钮，非常灵活。

方法3：用短代码实现（适合编辑器操作） #

如果你想直接在页面标题里插入按钮，短代码是个好选择：

1. 打开主题的functions.php文件，添加这段短代码函数：

function info_button_shortcode() {
    return '<a id="info-button" href="#" target="_blank"><i class="material-icons">info</i></a>';
}
add_shortcode( 'info_button', 'info_button_shortcode' );

2. 修改主题里的标题输出代码，让它能解析短代码：

<h1 class="page-title">
    <?php echo do_shortcode( get_the_title() ); ?>
</h1>

3. 回到页面编辑器，在标题里输入类似：我的页面标题 [info_button]，保存后就能看到按钮显示在标题里了。

关键注意事项 #

• 不管用哪种方法，一定要用子主题修改代码，避免主题更新后你的自定义代码丢失；
• 确保你的网站已经加载了material-icons字体，否则图标会显示成文字；
• 不要直接在页面标题框里输入原始HTML，WordPress的安全机制会过滤掉这些标签，这就是你之前显示异常的核心原因。

内容的提问来源于stack exchange，提问作者Mr. Jo