質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

89.55%

投稿画面のビジュアルが真っ白になり、記事内容,画像が全く表示されない。

解決済

回答 2

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 8,103

WizLife_Free

score 9

前提・実現したいこと

WordPress関連なので
https://ja.wordpress.org/
にてトピックを立てたのですが、上手く反映されなかったので場違いかもしれませんがここに頼らせてくださいm(_ _)m

タイトル通り、投稿編集画面にて記事の内容があるにも関わらず、ビジュアルタブが真っ白になり、カーソルが置けず記事の編集にとても困っています。

いつも通りビジュアルから編集できるように戻したいです。

この手のエラー解決策を片っ端から検索して調べましたが、これと言った情報が得られず、昨日丸一日直らなかったので質問させていただきましたm(_ _)m

症状

【状況1】
イメージ説明
文字は打ち込まれていますが、ビジュアルタブでは表示されない。(画像も同じく)

【状況2】
イメージ説明
テキストタブに戻し、ブラウザの更新ボタンを押すと文字が出現。

【状況3】
イメージ説明
切り替えを繰り返すととエディターが重なりバグる。

※サンプルとして新規投稿で用意しましたが、元々仕上がった記事全て同じ症状になります。

テキストタブの文字は更新すれば出現するのですが、ビジュアルに切り替え、再びテキストに戻すと【状況3】の状態になり編集不可状態になります。(ビジュアルタブに切り替えた際、ビジュアル画面には何も表示されない)

試したこと

  1. 基本OSはMacですが、WinのPCでも同じく、ビジュアルタブにカーソルが置けない状況です。
  2. 「Safari」「Chrome」「Firefox」「Opera」等のブラウザでも同じ症状です。
  3. 「PC」「iPhone」「iPadmini」の端末でダッシュボードにログインし、投稿画面を確認してもビジュアルにカーソルが置けない状況となっています。
  4. 他WordPressのサイトでは問題なくビジュアルタブが使えますが、このエラーが起きている問題のサイトだけ使えない状況です。
  5. 色々調べた結果、プラグインの「TinyMCE Advanced」が原因と言う答えが最も多く、私も使っていましたがプラグインの停止などは試しています。使用している全てのプラグインを一つずつ停止し、チェックも行っています。
  6. 「PS Disable Auto Formatting」というプラグインもよく候補に挙がっていましたが、このプラグインは入れていません。
  7. また「ブラウザのキャッシュ削除」「サーバ内のキャッシュ削除」「別のPCからのログイン」「回線の変更」等も行っています。
  8. 調べたキーワードとしては「WordPress」「ビジュアル」「真っ白」「表示されない」「投稿画面/編集画面」「カーソルを置けない」「サーバ」「ブラウザ」「キャッシュ」「削除」などで上位1ページ目に出た記事はほぼすべて確認しています。

補足情報

症状は一週間ほど前から過去3回発生しており、1回目は半日放置、2回目は1時間ほど放置で直っていたのですが、今回の3回目は丸一日、30時間ぐらい復旧しない状態が続いているのでさすがに原因を知りたい状況です。

関係あるか分からないのですが、過去に投稿した全ての記事の画像の一部、及びキャッチ画像の何枚かがクラッシュしており、表示されない状況にもなっています。これは恐らくですが、プラグイン「EWWW Image Optimizer」圧縮で複数の画像が生成されパスが合わなくなったものがそうなっているのかと予想しております。

記事内の表示されない画像は再びアップロードし挿入していけば表示されるので、手動で直していきたいのですが、いかんせんビジュアルタブが死んでいるため画像の大きさ、比率をテキストタブから合わせるのが非常に困難な状況で、いち早くビジュアルタブを復旧させたいのですが、どなたかこの手の原因に詳しい方いらっしゃいますでしょうか?

状況が分かり難い説明かもしれませんが、どうかよろしくお願いいたします。
長文失礼しましたm(_ _)m

主な参考サイト
http://www.arttoe.net/90
http://jisakupc-technical.info/web-survice/wordpress/3936/
http://isamuson.com/?p=1133

追記:2016/10/09 1:59

コメントありがとうございます。手順通り内容を報告します。

・デベロッパーツールエラー内容?
イメージ説明

・管理画面内デバッグモードでのエラー内容?
イメージ説明

・プラグインは全て最新。

・別テーマでも同じ症状。

般的な原因特定フロー6の「構成するシステムファイル群をFTPで最新のものに上書きする」についてはやり方が分からないのが現状です。

追記:2016/10/09 8:37

fuction、tinymceを入れ替えた結果のデベロッパーツールとデバッグモードの画像です。

テキストダブでのエラー表記。
イメージ説明

ビジュアルダブでのエラー表記。
イメージ説明

デバッグモード時のエラー表記。
イメージ説明
イメージ説明

追記:2016/10/09 11:10

/wp-includes/js/tinymce/plugins/wptextpattern/plugin.min.js
の存在を確認。
イメージ説明

追記:2016/10/09 13:06

全プラグイン停止時のデベロッパーツールエラー表示。
イメージ説明
イメージ説明

追記:2016/10/10 10:30

.htaccessの削除で解決しました。
ご迷惑おかけしました、ありがとうございました!

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • kei344

    2016/10/09 01:24 編集

    「症状」をコードブロックで囲われていますが、それはコード以外では読みにくくなるだけなので外してください。また、URLにはリンクを張ることができますので、編集よろしくお願いします。あと、タイトルについている「【ヲ】」は何でしょうか。 追記: 編集ありがとうございます。

    キャンセル

回答 2

checkベストアンサー

+4

デバッグモードにしてエラーが出ていないか確認されましたか?
また、JavaScriptのエラーはでていませんか?

【Chrome デベロッパーツールの使い方概要 | Web Tips】
http://weback.net/utility/1410/


一般的な原因特定フローは、下記の通りです。

  1. DB/ファイル全てのバックアップをする
  2. デバッグモードにする ⇒ http://mignonstyle.com/debug-mode/
  3. プラグイン/テーマ/本体全てをアップデートする
  4. デフォルトテーマで再現するか確認する
  5. プラグインを全て止めて再現するか確認する
  6. 構成するシステムファイル群をFTPで最新のものに上書きする

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2016/10/09 13:08

    プラグインを全て停止してもビジュアルは真っ白のままですね…
    その時のデベロッパーツールのエラー画像も掲載します。

    キャンセル

  • 2016/10/09 13:55

    バックアップをとった後、
    1. .htaccess の全削除
    2. 個別ではなく全体のWordPress構成ファイル群の上書き
    3. ファイルも含めて全削除してから構成ファイルをアップロード
    これを順番にやってみてどうにもならない場合は遠隔からでは対処が出来ません。

    また、同じ環境の別フォルダなどにWordPressを入れてみて再現するようなことがあった場合、セキュリティソフトの誤動作など別の原因があるかもしれません。

    すみませんが、これくらいしか考え付きません。

    キャンセル

  • 2016/10/09 17:03

    自分にはかなり大掛かりになりそうなので、慎重に行います(。-`ω´-)
    長い間ありがとうございました!
    後日上手くいけば報告させていただきます。

    キャンセル

+1

kei344さんに言われた手順を本日実行しようと試みた結果
・.htaccess
・wp-config.php
・plugins
・themes
・uploads
・sql
・wp-includes

と最も重要なファイルのバックアップを取り、いざフロー1の「.htaccess 」を削除でまさかの解決でした。

.htaccess は1年ほど前サーバ移転&URL変更時のリダイレクトに使ったきりだったので、現状サーバ内に.htaccessは存在しないですが、恐らく問題無いと思います。

追記:2016/10/10 10:39 
.htaccessを入れておかないと今度は記事のページが表示されなくなってしまいました。再度バックアップの.htaccessを入れると復旧。投稿画面のビジュアルタブも無事でした。

また今回は丸3日以上この状況が続いたのでまた放置時間で解決した可能性もあるので、本当にこれが原因かどうかわかりませんが、また同じ症状が出た場合は、WordPress構成ファイル群の入れ替えを検討します。

kei344さん本当に長い時間ありがとうございました!m(_ _)m

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2016/10/10 10:57

    .htaccess は削除した後、「パーマリンク設定」を何も変更せずに保存すると生成されると思います。ひとまず解決できたようでよかったです。

    キャンセル

  • 2016/10/10 11:05

    ありがとうございます。再度.htaccessを削除し、パーマリンク設定を保存で無事ページが表示されました!

    キャンセル

  • 2016/10/10 11:13

    また補足の抜け落ちていた画像クラッシュの原因予想が「EWWW Image Optimizer」と言うのも、.htaccess削除で全てリンクが繋がりました。
    予定していた作業が大幅にカットできたので本当に助かりました。ありがとうございます。

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 89.55%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる