WordPressを別のサーバーやドメインへ移転した後、「文字の大きさが変わった」「画像が表示されない」「メニューが縦に並ぶ」といったレイアウト崩れが起きることがあります。多くの場合、デザインデータそのものが消えたのではなく、CSSや画像の読み込み先、キャッシュに問題があります。
まずは、移転前の状態に戻そうとして何度も編集するのではなく、URL、CSS、キャッシュ、画像の順に確認しましょう。原因を切り分けることで、必要以上にサイトを作り直さずに復旧できる可能性があります。
WordPress移転後にレイアウトが崩れる主な原因
CSSファイルを読み込めていない
文字サイズ、余白、色、横幅などを指定するCSSファイルが読み込まれないと、ページが装飾前のような表示になります。テーマやプラグインが作成したCSSの保存先が変わったり、移転後のURLと古いURLが混在したりすると発生します。
画像やフォントのURLが古いまま
画像のURLが移転前のドメインやサーバーを指していると、画像が表示されません。画像が表示されないだけでなく、画像を前提にしたレイアウトが崩れることもあります。Webフォントやアイコンの読み込み先も確認が必要です。
キャッシュが古い
ブラウザ、WordPressのキャッシュプラグイン、サーバー、CDNなどに移転前の情報が残っている場合があります。修正したはずなのに自分の画面だけ直らないときは、キャッシュが原因かもしれません。
最初に確認すること
作業前に、管理画面へログインできるか、トップページ以外も同じように崩れているかを確認します。特定のページだけの問題なら、そのページで使っているブロックやプラグインが原因の可能性があります。
また、スマートフォンとパソコンの両方で表示を確認してください。ブラウザのシークレットウィンドウや、別の端末で見ると、キャッシュの影響を受けずに確認できます。
原因別の直し方
1. URLを置き換える
移転後にドメインが変わった場合は、本文内のリンクだけでなく、画像、CSS、JavaScript、ウィジェットなどに古いURLが残っていないか確認します。管理画面の「設定」から、WordPressアドレスとサイトアドレスも確認しましょう。
データベースを直接変更する場合、単純な文字列置換ではシリアライズされたデータを壊すことがあります。バックアップを取ったうえで、WordPress移転に対応した検索・置換ツールを使うか、制作会社に依頼するほうが安全です。
2. CSSを再生成する
ページビルダーやテーマによっては、管理画面でCSSファイルを再生成する機能があります。該当する設定画面で「CSSの再生成」「ファイルの再生成」「アセットの再構築」などの項目を探してください。
再生成後は、ブラウザやキャッシュプラグインのキャッシュも削除します。CSSを変更していないのに表示だけが崩れている場合、この作業で改善することがあります。
3. キャッシュを削除する
キャッシュは一度にすべて確認することが大切です。ブラウザのキャッシュ、キャッシュ系プラグイン、レンタルサーバーの高速化機能、CDNを利用している場合はCDNのキャッシュを削除します。
削除後は、トップページだけでなく、下層ページ、問い合わせフォーム、スマートフォン表示も確認します。キャッシュ削除の方法はサービスによって異なるため、分からない場合はサーバー会社の案内を確認してください。
4. 画像URLとファイルの権限を確認する
画像が表示されない場合は、画像を右クリックして新しいタブで開き、URLが正しいか確認します。404エラーになる場合は、URLが古い、ファイルが移転されていない、ファイル名の大文字・小文字が違うといった原因が考えられます。
画像ファイルが存在するのに表示されないときは、アップロード先のフォルダーやサーバーのアクセス権限も確認します。日本語や記号を含むファイル名は、環境によって問題になることがあるため、半角英数字のファイル名にする方法もあります。
AIO移行で復旧した実例
株式会社みうらでは、WordPressの移転後にページ全体のレイアウトが崩れ、画像も一部表示されなくなったサイトについて、AIO移行による復旧を行った事例があります。移転後のURLと旧URLが混在していたほか、生成済みCSSとキャッシュの情報にもずれがありました。
まずバックアップを確保し、AIO移行のデータを基にサイトを安全な状態へ戻したうえで、URLの整合性を確認しました。その後、CSSを再生成し、各種キャッシュを削除。画像URLと主要ページを一つずつ確認することで、サイト全体の表示を復旧しました。
このように、移転後の不具合は一つの設定だけでなく、複数の要因が重なっていることがあります。焦ってテーマを変更したり、プラグインを大量に停止したりする前に、バックアップと原因の切り分けを行うことが重要です。
自社で直せないときの判断
管理画面に入れない、データベースの操作が必要、フォームや決済機能まで不安定になっている場合は、無理に作業を続けないほうが安全です。作業前のバックアップがない場合も、復旧作業によって状態を悪化させる可能性があります。
WordPressの基本的な移転や保守については、株式会社みうらのWordPress制作・運用案内もご覧ください。
岡山市周辺で、WordPress移転後のレイアウト崩れや表示不具合にお困りの場合は、株式会社みうらへご相談ください。現在の症状、移転前後の環境、バックアップの有無を確認し、必要な作業を整理してご案内します。