WordPress单页面Meta Title修改问题：浏览器标签生效但链接预览不生效

你用document.title修改的只是浏览器渲染后的标题，爬虫、社交平台/聊天工具的链接预览不会执行JS，所以只会读取HTML源码里的<title>标签或Open Graph（OG）这类元标签，这就是预览标题没变化的原因。以下是针对单个PHP页面模板的解决方案：

方案1：直接在自定义模板中输出自定义标题和元标签 #

在你的单页面PHP模板文件里，找到get_header();这一行，在它之前添加以下代码，直接覆盖默认的title输出：

<?php
// 取消WordPress默认的title输出
remove_action('wp_head', '_wp_render_title_tag', 1);
?>
<head>
    <meta charset="<?php bloginfo('charset'); ?>" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <!-- 自定义页面标题 -->
    <title>Panhandle Getaways 30A</title>
    <!-- 添加Open Graph标签，适配社交平台预览 -->
    <meta property="og:title" content="Panhandle Getaways 30A" />
    <meta property="og:type" content="website" />
</head>
<?php get_header(); ?>

注意：如果你的header.php里已经包含<head>标签，可改为在get_header()之前移除默认title渲染，再在header.php中判断当前模板，输出自定义内容。

方案2：用WordPress钩子针对模板修改标题（更规范） #

在主题的functions.php里添加以下代码，通过钩子精准修改目标模板页面的标题和OG标签：

// 修改页面标题
add_filter('pre_get_document_title', 'custom_single_page_title');
function custom_single_page_title($title) {
    // 替换为你的自定义模板文件名，比如template-custom.php就写'template-custom'
    if (is_page_template('your-custom-template.php')) {
        return 'Panhandle Getaways 30A';
    }
    return $title;
}

// 添加Open Graph标签
add_action('wp_head', 'custom_single_page_og_tags');
function custom_single_page_og_tags() {
    if (is_page_template('your-custom-template.php')) {
        echo '<meta property="og:title" content="Panhandle Getaways 30A" />';
        echo '<meta property="og:type" content="website" />';
    }
}

这种方式保留了WordPress的钩子机制，仅针对目标页面生效，不会影响站点其他页面。

验证方法 #

修改后刷新页面，右键查看页面源码，确认<title>标签和<meta property="og:title">标签已改为你设置的内容，此时链接预览就会读取这些值。

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