プレーヤーがフロントエンドに表示されない

4 min read

管理画面では音声が正常に生成されているのに、サイトで投稿を表示するとオーディオプレーヤーが見当たらない。このページでは、よくある原因を順番に説明します。

クイックチェックリスト

詳しく調べる前に:

  1. Ctrl+Shift+R でページを再読み込みする(ハード再読み込みでキャッシュをバイパス)
  2. 管理画面の TTS 列に音声が存在するか確認する
  3. ログアウト状態でないか確認する(一部のテーマは管理者専用要素を非表示にする)

原因1: 投稿タイプが有効になっていない

症状: 管理画面には音声が存在するが、フロントエンドにプレーヤーが表示されない。特定の投稿タイプでは機能するが、他では機能しない。

修正方法:

  1. テキスト読み上げ → コンテンツ に移動する。
  2. 現在の投稿のタイプが有効になっているか確認する(投稿、固定ページ、商品など)。
  3. 保存する。
  4. フロントエンドの投稿を再読み込みする。

原因2: テーマの競合

症状: 別のテーマではプレーヤーが表示されるが、使用中のテーマでは表示されない。または表示されるが非表示や壊れた状態になっている。

よくある原因:

  • テーマが the_content フィルターを削除しており、TTSWP がプレーヤーを挿入できない
  • テーマが WordPress 標準のコンテンツフックをバイパスするカスタムテンプレートを使用している
  • テーマの CSS がプレーヤーを非表示にしている(どこかに display: none がある)

修正方法:

  1. 一時的に WordPress デフォルトテーマ(Twenty Twenty-Four)に切り替える。
  2. 投稿を再読み込みする。
  3. デフォルトテーマでプレーヤーが表示されれば、問題は使用中のテーマにある。

回避策:

  • 投稿内で [mementor-tts] ショートコードを使って配置を強制する
  • カスタムテーマテンプレート内で [tts_player id="123"] ショートコードを使用する
  • プレーヤーが非表示になっている場合は、カスタム CSS で表示させる

原因3: 配置設定が表示されないビューになっている

症状: 一部のページではプレーヤーが表示されるが、他のページでは表示されない。

例: 配置が 抜粋の前 に設定されている場合、プレーヤーはアーカイブページやブログ一覧ページにのみ表示され、個別投稿には表示されない。

修正方法:

  1. テキスト読み上げ → プレーヤー に移動する。
  2. 配置 ドロップダウンを確認する。
  3. 最も汎用的な配置として タイトルの後 または コンテンツの後 に切り替える。
  4. 保存する。

原因4: キャッシュが古いバージョンを配信している

症状: シークレットウィンドウではプレーヤーが表示されるが、通常のブラウザでは表示されない。

修正方法:

  1. ブラウザキャッシュをクリアする(Ctrl+Shift+Delete)。
  2. キャッシュプラグイン(WP Rocket、LiteSpeed など)を使用している場合は、そのキャッシュをクリアする。
  3. CDN(Cloudflare など)を使用している場合は、キャッシュをパージする。

キャッシュプラグイン を参照してください。

原因5: JavaScript がブロックされている

症状: プレーヤーの HTML はある(ソース表示で確認できる)が、壊れているか静的に見える。

理由: プレーヤーはコントロールに JavaScript を使用しています。JS がブロックされると、プレーヤーはスタイルなしの HTML として表示されます。

修正方法:

  • ブラウザのコンソールで JS エラーを確認する
  • サイト上の広告ブロッカーやコンテンツブロッカーを無効にする
  • 他のプラグインが mementor-tts-public.js をデキューしていないか確認する

原因6: Weglot または WPML のルーティング問題

症状: 元の言語ではプレーヤーが機能するが、翻訳ページでは機能しない(またはその逆)。

修正方法: Weglot または WPML の連携トグルがオンになっているか確認する。テキスト読み上げ → 概要 → クイック設定 に移動してください。WPML 連携Weglot 連携 を参照してください。

原因7: ページの AMP バージョン

症状: 通常バージョンではプレーヤーが表示されるが、AMP では表示されない。

理由: AMP は JavaScript に厳格なルールを設けています。TTSWP プレーヤーは AMP ページ内では動作しません。

回避策: 訪問者を非 AMP バージョンにリンクするか、AMP ページの音声には別のアプローチを使用してください。

まだ解決しない場合

上記のいずれも解決しない場合:

  1. テキスト読み上げ → PRO サポート または サポートページ を確認する
  2. 以下の情報を含めてください: テーマ名、WordPress バージョン、プラグインバージョン、ブラウザ、投稿と管理画面 TTS 列のスクリーンショット

関連ページ