播放器未在前台显示

4 min read

音频在管理后台生成正常,但在网站上查看文章时,没有显示音频播放器。本页面介绍常见原因及解决方法。

快速检查清单

开始排查前,请先:

  1. 按 Ctrl+Shift+R 强制刷新页面(绕过缓存)
  2. 确认文章在管理后台的 TTS 列中已有音频
  3. 确认您未处于登出状态(某些主题会隐藏仅限管理员可见的元素)

原因一:文章类型未启用

症状: 管理后台存在音频,但前台没有播放器。在某些文章类型上正常,在其他类型上不显示。

解决方法:

  1. 前往 文字转语音 - TTSWP → 内容
  2. 确认当前文章的类型已启用(文章、页面、产品等)。
  3. 保存。
  4. 刷新前台文章页面。

原因二:主题冲突

症状: 播放器在某些主题上显示正常,但在您的主题中不显示,或显示但不可见、功能异常。

常见原因:

  • 您的主题过滤掉了 the_content 钩子,而 TTSWP 通过该钩子注入播放器
  • 您的主题使用了自定义模板,绕过了 WordPress 的默认内容钩子
  • 主题的 CSS 隐藏了播放器(某处存在 display: none

解决方法:

  1. 临时切换为 WordPress 默认主题(Twenty Twenty-Four)。
  2. 刷新文章页面。
  3. 如果播放器在默认主题下正常显示,则问题出在您的主题上。

替代方案:

  • 在文章内使用 [mementor-tts] 短代码强制指定放置位置
  • 在自定义主题模板中使用 [tts_player id="123"] 短代码
  • 添加自定义 CSS 使被隐藏的播放器显示出来

原因三:放置位置设置为当前未显示的视图

症状: 播放器在某些页面显示,但在其他页面不显示。

示例: 如果放置位置设为 摘要前,播放器仅在存档页和博客列表页显示,不在单篇文章页显示。

解决方法:

  1. 前往 文字转语音 - TTSWP → 播放器
  2. 检查 放置位置 下拉菜单。
  3. 切换为 标题后内容后,这是最通用的放置方式。
  4. 保存。

原因四:缓存提供了旧版本页面

症状: 在全新的无痕窗口中播放器正常显示,但在常规浏览器中不显示。

解决方法:

  1. 清除浏览器缓存(Ctrl+Shift+Delete)。
  2. 如果您使用了缓存插件(WP Rocket、LiteSpeed 等),清除其缓存。
  3. 如果您使用了 CDN(Cloudflare 等),清除其缓存。

请参阅 缓存插件

原因五:JavaScript 被屏蔽

症状: 播放器 HTML 存在(查看源代码可见),但外观异常或无法交互。

原因: 播放器的控件依赖 JavaScript。如果 JS 被屏蔽,播放器将以未经样式处理的 HTML 形式显示。

解决方法:

  • 检查浏览器控制台是否有 JS 报错
  • 在您的网站上禁用广告拦截器或内容拦截器
  • 确认没有其他插件将 mementor-tts-public.js 移出队列

原因六:Weglot 或 WPML 路由问题

症状: 播放器在原始语言页面正常,但在翻译页面不显示(或相反)。

解决方法: 确保 Weglot 或 WPML 集成开关已开启。前往 文字转语音 - TTSWP → 概览 → 快速设置。请参阅 WPML 集成Weglot 集成

原因七:AMP 版本页面

症状: 播放器在普通版本中显示,但在 AMP 版本中不显示。

原因: AMP 对 JavaScript 有严格限制。TTSWP 播放器无法在 AMP 页面中运行。

替代方案: 将访客引导至非 AMP 版本,或针对 AMP 页面采用其他音频方案。

仍未解决?

如果以上方法均无效:

  1. 查看 文字转语音 - TTSWP → PRO 支持 或访问 支持页面
  2. 请提供:主题名称、WordPress 版本、插件版本、浏览器类型、文章截图及管理后台 TTS 列的截图

相关页面