WordPressの記事でX(旧Twitter)の埋め込みがうまくいかないときの対処法

ライフハック

結論を先に紹介。WordPressの記事でX(旧Twitter)の埋め込みがうまくいかないとき、筆者はPHPMyAdminからoEmbedのキャッシュをクリアすると解決した。ネットで紹介されているその他の対処法も紹介。

WordPressにて記事を執筆し公開してみると、X(旧Twitter)の埋め込みがうまく表示されず、ブログカードが表示されてしまったり、URLのみが表示されてしまったりする症状に遭遇することがある。

ネットで検索してみると、様々な要因でこのエラーが発生するらしく、いくつかの方法を試してみて、ようやく解決に至ることができた。

今回はその解決に至った手順と、ネットで紹介されているいくつかの対処法を備忘録的に撰述しておく。

あくまで筆者の環境下で解決した手順の紹介のため、すべての方がこの記事で紹介する方法で解決するわけではないことを注意いただきたい。

  • 解決時の筆者のWordPress環境下
    • WordPressバージョン: 6.9
    • サーバー:XServer
    • テーマ:
      • 『Cocoon』バージョン: 2.8.9.1
      • 『Cocoon Child』バージョン: 1.1.3

これで解決!PHPMyAdminからoEmbedのキャッシュをクリア

X(旧Twitter)の埋め込みがうまく表示されず、ブログカードが表示されてしまう現象について、筆者が最終的に至った解決方法は、XserverからPHPMyAdminを使用してoEmbedのキャッシュをクリアするというもの。

免責事項
本記事は、あくまで筆者自身の環境で発生した問題と、その際に行った対処を記録した「備忘録」です。同様の症状が発生しているすべての環境で、本記事の方法が有効であることを保証するものではありません。
また、以下で紹介する方法では、データベース(phpMyAdmin)を直接操作します。操作の誤りなどにより
、最悪の場合サイトが表示できなくなる・データが破損するといったリスクがあります。
本記事の内容を参考に同様の操作を行う場合は、必ず事前にバックアップを取得し、自己責任にて実施してください。

XserverからPHPMyAdminへアクセスする

まずPHPMyAdminにアクセスするために、Xseverからログインをする必要がある。

その際にログインIDとパスワードが必要になってくるため、その確認方法から紹介。

PHPMyAdminへアクセスするログインユーザー名とパスワードの調べた方

  • Xserverレンタルサーバーにログインする
  • メニューから[サーバー管理(サーバーパネル)]を開く
  • 操作するサーバーの[選択する](もしくは[別ウィンドウで開く])をクリック
  • 右上の[ファイルマネージャ]を開く
  • 自身のサイトのドメインフォルダを開く
  • [public_html]フォルダ内にある[wp-config.php]ファイルを選択して、上部の[編集]をクリック
  • 編集画面が開くので、以下の****部分をメモ
    • define(‘DB_USER’, ‘****’ )←ログインユーザー名になる
    • define(‘DB_PASSWORD’, ‘****’ )←ログインパスワードになる
  • メモしたら、必ず[キャンセル]ボタンで終了する

[ファイルマネージャ]は終了してOK。

PHPMyAdminへアクセスするログインIDとパスワードの調べた方
  • Xserverレンタルサーバーにログインする
  • メニューから[サーバー管理(サーバーパネル)]を開く
  • 操作するサーバーの[選択する](もしくは[別ウィンドウで開く])をクリック
  • 右上の[ファイルマネージャ]を開く
  • 自身のサイトのドメインフォルダを開く
  • [public_html]フォルダ内にある[wp-config.php]ファイルを選択して、上部の[編集]をクリック
  • 編集画面が開くので、以下の****部分をメモ

    define(‘DB_USER’, ‘****’ )←ログインユーザー名になる
    define(‘DB_PASSWORD’, ‘****’ )←ログインパスワードになる

  • メモしたら、必ず[キャンセル]ボタンで終了する

PHPMyAdminへアクセスする

  • Xserverのサーバー管理(サーバーパネル)画面を開く
  • [≡全メニュー表示]をクリック
  • [データベース]項目にある[PHPmyadmin]を開く
  • ログインするためのユーザー名とパスワードの入力画面が表示されるので、調べ方で調べたユーザー名とパスワードを入力
  • PHPMyAdmin画面が開く
PHPMyAdminへアクセスする
  • Xserverのサーバー管理(サーバーパネル)画面を開く
  • [≡全メニュー表示]をクリック
  • [データベース]項目にある[PHPmyadmin]を開く
  • ログインするためのユーザー名とパスワードの入力画面が表示されるので、調べ方で調べたユーザー名とパスワードを入力
  • PHPMyAdmin画面が開く

PHPMyAdminからoEmbedのキャッシュをクリアする

免責事項
データベース(phpMyAdmin)の直接操作は、操作の誤りなどにより、最悪の場合サイトが表示できなくなる・データが破損するといったリスクがあります。
本記事の内容を参考に同様の操作を行う場合は、必ず事前にバックアップを取得し、自己責任にて実施してください。

  • 左サイドバーから[wp_postmeta]ファイルを選択し、上部にある[検索]をクリック
  • [meta_key]の[演算子]リストから「Like %…%」を選択
  • [meta_key]の[値]欄に「_oembed」を入力して[実行]をクリック
  • メイン画面に検索結果が表示される
  • メイン画面下部にある[□すべて表示]のチェックをつける
  • 「本当にすべての行を表示しますか?」の注意ダイアログが出るので[OK]をクリック
  • _oembed」が含まれるすべてのデータが表示されるので、下部の「すべてチェックする」にチェックをつけて[削除]ボタンをクリック
  • 次の画面で削除確認が表示されるので、[はい]で削除する
PHPMyAdminからoEmbedのキャッシュをクリアする
  • 左サイドバーから[wp_postmeta]ファイルを選択し、上部にある[検索]をクリック
  • [meta_key]の[演算子]リストから「Like %…%」を選択
  • [meta_key]の[値]欄に「_oembed」を入力して[実行]をクリック
  • メイン画面に検索結果が表示される
  • メイン画面下部にある[□すべて表示]のチェックをつける
  • 「本当にすべての行を表示しますか?」の注意ダイアログが出るので[OK]をクリック
  • _oembed」が含まれるすべてのデータが表示されるので、下部の「すべてチェックする」にチェックをつけて[削除]ボタンをクリック
  • 次の画面で削除確認が表示されるので、[はい]で削除する

上記の方法でPHPMyAdminからoEmbedのキャッシュをクリアすると、「X(旧Twitter)の埋め込みがうまく表示されずにブログカードが表示されてしまう現象」が解決し、きちんと埋め込みが表示されるようになっている。

X(旧Twitter)の埋め込みがうまくいかないときのその他の対処法

筆者の場合、「X(旧Twitter)の埋め込みがうまく表示されずにブログカードが表示されてしまう現象」はPHPMyAdminからoEmbedのキャッシュをクリアする方法で解決したが、他にネット上で紹介されている対処法をいくつか撰述しておく。

対処法その①:埋め込みURLの「status」に「es」を追加

一番有名な対処法は、X(旧Twitter)を埋め込む際のURLに「es」という文字を追加するもの。

文字を追加したことにより解決するその理屈はわからないが、一番有名な対処法だけあって一定の効果がある様子。

  • X(旧Twitter)にて埋め込みたいポストのリンクをコピー
  • WordPress投稿記事にて、X(旧Twitter)の埋め込みブロックを用意
  • URLを貼り付け、「status」の文字のあとに「es」を追加して「statuses」にする
埋め込みURLの該当部分に「es」を追加
  • X(旧Twitter)にて埋め込みたいポストのリンクをコピー
  • WordPress投稿記事にて、X(旧Twitter)の埋め込みブロックを用意
  • URLを貼り付け、「status」の文字のあとに「es」を追加して「statuses」にする

対処法その②:埋め込みURLの「x.com」を「twitter.com」に変更

その他の対処法の2つ目として、埋め込みURLの「x.com」の箇所を「twitter.com」に変更するというもの。

  • X(旧Twitter)にて埋め込みたいポストのリンクをコピー
  • WordPress投稿記事にて、X(旧Twitter)の埋め込みブロックを用意
  • URLを貼り付け、「x.com」の部分を「twitter.com」に変更する
埋め込みURLの該当部分に「es」を追加
  • X(旧Twitter)にて埋め込みたいポストのリンクをコピー
  • WordPress投稿記事にて、X(旧Twitter)の埋め込みブロックを用意
  • URLを貼り付け、「x.com」の部分を「twitter.com」に変更する

対処法その③:埋め込みURLの「?s=**(数字)」の部分を削除する

その他の対処法3つ目は、埋め込みURLの末尾部分にある「?s=**」の部分を削除して埋め込むという方法。**の箇所には数字が入っている。

  • X(旧Twitter)にて埋め込みたいポストのリンクをコピー
  • WordPress投稿記事にて、X(旧Twitter)の埋め込みブロックを用意
  • URLを貼り付け、末尾「?s=**(数字)」以降を削除する
埋め込みURLの該当部分に「es」を追加
  • X(旧Twitter)にて埋め込みたいポストのリンクをコピー
  • WordPress投稿記事にて、X(旧Twitter)の埋め込みブロックを用意
  • URLを貼り付け、末尾「?s=**(数字)」以降を削除する

WordPressでX(旧Twitter)の埋め込みがうまくいかないときの対処法Q&A

Q
WordPressでX(旧Twitter)の埋め込みがうまくいかない原因は?
A

特定の原因があるわけではなく、TwitterがXに変わったことによる仕様変更や、WordPressとの互換性など複数の原因が考えられる。
当記事で紹介しているPHPMyAdminからoEmbedのキャッシュをクリアする方法で解決する場合は、WordPress側の不具合の可能性が高い

Q
WordPressでX(旧Twitter)の埋め込みがうまくいかない場合の解決策にはどんな方法がある?
A

タイトルとURLをコピーしました