如何为WordPress全站页面及文章<title>标签添加notranslate类
2026-5-28
阻止Google Translate翻译WordPress全站标签的解决方案 <a class="header-anchor" href="#阻止google-translate翻译wordpress全站标签的解决方案" aria-hidden="true">#</a></h1>
<p>嘿，不用纠结直接修改<code>header.php</code>里的<code>wp_head()</code>函数，WordPress提供了更安全、更易维护的钩子方案，完全不用碰主题核心文件（避免主题更新后丢失修改）。下面给你两种可靠的实现方式：</p>
<h2 id="方法一：适用于wordpress-4-4及以上版本（推荐）">方法一：适用于WordPress 4.4及以上版本（推荐） <a class="header-anchor" href="#方法一：适用于wordpress-4-4及以上版本（推荐）" aria-hidden="true">#</a></h2>
<p>从WordPress 4.4开始，官方推荐使用<code>document_title_parts</code>过滤器来处理页面标题，我们可以通过这个钩子给标题添加<code>notranslate</code>类：</p>
<pre class="hljs"><code class="language-php volc-pre-code">function add_notranslate_class_to_title($title_parts) {
// 拼接标题的各个组成部分（比如文章标题 + 站点标题）
$full_title = implode(' | ', $title_parts);
// 用带notranslate类的span包裹完整标题
return ['title' => '<span class="notranslate">' . $full_title . '</span>'];
}
add_filter('document_title_parts', 'add_notranslate_class_to_title');
</code></pre>
<h3 id="操作步骤：">操作步骤： <a class="header-anchor" href="#操作步骤：" aria-hidden="true">#</a></h3>
<ul>
<li>把这段代码添加到你的<strong>子主题functions.php</strong>文件中，或者使用自定义代码插件（比如Code Snippets）来添加。</li>
<li>保存后查看页面源代码，你会发现<code><title></code>标签的内容被<code><span class="notranslate"></code>包裹，Google翻译会自动跳过这个区域。</li>
</ul>
<h2 id="方法二：适用于wordpress-4-4以下版本">方法二：适用于WordPress 4.4以下版本 <a class="header-anchor" href="#方法二：适用于wordpress-4-4以下版本" aria-hidden="true">#</a></h2>
<p>如果你的WordPress版本比较旧，可以使用<code>wp_title</code>过滤器来实现：</p>
<pre class="hljs"><code class="language-php volc-pre-code">function add_notranslate_class_to_wp_title($title) {
return '<span class="notranslate">' . $title . '</span>';
}
add_filter('wp_title', 'add_notranslate_class_to_wp_title', 10, 1);
</code></pre>
<h3 id="关键注意事项：">关键注意事项： <a class="header-anchor" href="#关键注意事项：" aria-hidden="true">#</a></h3>
<ul>
<li>不要直接修改主题的<code>header.php</code>，因为主题更新后所有自定义修改都会丢失，子主题或代码插件是更稳妥的选择。</li>
<li>关于SEO影响：搜索引擎爬虫会正常解析标题文本，<code>notranslate</code>类只会被Google翻译机器人识别，不会对SEO造成负面影响。</li>
<li>测试验证：修改完成后，打开网站任意页面，右键查看源代码，确认<code><title></code>标签内的内容已被<code><span class="notranslate"></code>包裹即可。</li>
</ul>
<p>内容的提问来源于stack exchange，提问作者Andrew Truckle</p>
相关产品推荐
相关产品推荐
