wordpress

WordPress管理画面でCSSがおかしくなった時の対処法について

WordPress管理画面(ログイン含む)が下記のようにcssが効かなくなる,CSSがバグった!ようなときがあります。2018年度に合った実際の事例について分かりやすく解説します。

スポンサーリンク

管理画面がおかしい!?

ワードプレスのログイン管理画面がこのようにCSSが反映しておらず、HTMLのみで構成されたような状態になった。ログイン後も同じような状態であることから何らかの不具合の様子。

通常はこの状態がスタンダートになります。さっきまで使えていたのに急に先ほどの画面になってしまったら、このような対応をしたことが無い方は驚きますね。

改善策はあるのか?

このような管理画面がおかしくなる事以外も含めて以下のような改善策が基本的にあります。

トラブルシューティングの基本

  • すべてのプラグインを無効化し、同時にテーマをデフォルトのテーマに戻して再度試してみましょう。それで正常に動くなら一つずつ元に戻してみて、どれが問題を引き起こしているか絞り込むことができるはずです。
  • キャッシュが問題に関係している場合があります。ブラウザのキャッシュを削除して再度試してみてください。また、WordPress のキャッシュプラグインを使用している場合はそれを停止し、キャッシュファイルをクリアして試してみましょう。
  • ログインしている場合とログインしていない場合で現象に違いが出るでしょうか。また、使用するブラウザを変えてみてはどうでしょうか。ブラウザに保存されている Cookie が関係している場合もあるので、それをクリアして再度試してみてください。

これらのテストはたとえ問題解決に直接つながらなかったとしても重要な手がかりになります。

引用元:WordPress ORG

    まず個人で改善策を見つけるのであればこちらを行ってみましょう。もしこれでも改善されず誰かに聞いてみて改善される場合はこちらを参考にしてください。

    投稿に記載する内容

    どのような条件でどのような問題が見られますか? 以下のポイントを考慮して、正確かつ具体的に記述してください。

    • WordPress のバージョン
    • 使用しているプラグインとテーマの情報(名称、入手先 URL、バージョン)
    • PHP、MySQL のバージョン
    • サーバー環境(ホスティングサービス名、OS、ウェブサーバー等)
    • ブラウザとそのバージョン
    • エラーが表示された場合、「XX のようなエラー」ではなく、なるべくエラー文をコピーしてそのまま貼り付けてください

    その他の注意点

    1. WP_DEBUG 定数の使用について
      • wp-config.php 等の定義ファイルにおいて WP_DEBUG 定数を真と定義することにより、WordPress を「デバッグモード」で動作させることができます。デバッグモードでは通常なら無視できる比較的軽度のエラーまで出力されるようになるため、プラグインやテーマの開発はデバッグモードをオンにした状態で行うことが推奨されています。
      • なお、この機能はあくまで開発者やテスター向けのものですので、特に指示を受けない限り有効化するべきではありません。公開中のサイトをデバッグモードで運用することは危険ですので絶対に避けてください。

    引用元:WordPress ORG

    似たような事案や修正案

    他サイトでも似たような事案やそれについての修正案がありました。

    どれも共通点は心当たりがないが急に起こるのでその対策に少々手間取ってしまうようです。

    今回の解決策は?

    今回の事例では、cssなどを圧縮する【 load-styles.php 】に不具合が起きていることが原因でした。

    とくに大きなCSSでも取り扱っていない場合は圧縮をやめるようにすれば解決します。

    「wp-config.php」に➡「 define(‘CONCATENATE_SCRIPTS’, false); 」を追加すれば解決しました。

    CSSが原因で何か怪しいと思えば「load-style.php」を探ってみたり、改善案を仰いでみましょう。

    スポンサーリンク

    スポンサーリンク