WordPressの表示崩れ|よくある5パターンと自分でできる直し方【現役エンジニア解説】
「昨日まで普通だったのに、急にレイアウトが崩れた」——WordPressでよくあるトラブルです。現役エンジニアとして修正依頼を多く見てきた経験から、発生頻度の高い5パターンと、自分で試せる対処をまとめました。①テーマ/プラグイン更新の直後に崩れた最も多い原因です。更新でCSSや仕様が変わり、既存のカスタマイズと衝突します。まず「どの更新の後か」を切り分け、疑わしいプラグインを一つずつ停止して原因を特定します。②スマホだけ崩れる(PCは正常)レスポンシブ指定の抜けが原因です。ブラウザの検証ツールではみ出す要素を特定し、widthをmax-width:100%に、固定pxを%やremに置き換えると直ることが多いです。③余白・文字サイズが意図と違うCSSの優先度(詳細度)の問題です。テーマ標準CSSが自分の指定を上書きしています。追加CSSで対象を具体的に指定しましょう。!importantの乱用は後の崩れの元になるため、セレクタを的確に書くのが安全です。④画像がはみ出す・粗いサイズ指定漏れと巨大画像が原因です。max-width:100%; height:auto; を基本に。表示と同時にページも重くなるので、リサイズやWebP化がおすすめです。⑤直したはずが反映されないキャッシュ(プラグイン・サーバー・ブラウザ)が古い表示を保持しています。キャッシュクリアとスーパーリロードで確認してから判断しましょう。■それでも直らない・触るのが不安なときは表示崩れは「原因の切り分け」が9割です。バックアップを取ってから作業するのが鉄則ですが、本番サイトで手が止まる場合はご相談ください。出品サー
0