WordPressで画像を差し替えたあとに、「表示が大きく崩れた」「前の画像に戻せない」「変更したのに古い画像が表示される」と困ることがあります。
画像の変更は簡単そうに見えますが、準備不足は思わぬトラブルにつながります。この記事では、WordPressに詳しくない方でも進めやすい安全な手順をご紹介します。
1.差し替える場所を確認する
最初に、画像が使われているページと位置を確認します。作業前の画面をスクリーンショットで残しておくと、変更後との比較が簡単です。
同じ画像が複数ページで使われている場合もあります。画像ファイルそのものを置き換えると別のページまで変わる可能性があるため、対象ページの編集画面から新しい画像を選び直す方法が安全です。
2.バックアップと元画像を保管する
作業前に、サイトのバックアップを取得します。少なくとも、現在使われている元画像はパソコンにダウンロードして保管しましょう。
可能なら、ファイルとデータベースを含むバックアップを取りましょう。サーバーの自動バックアップも、復元方法と保存期間まで確認すると安心です。
3.新しい画像のサイズと比率を合わせる
差し替え前の画像について、横幅・縦幅・縦横比を確認します。たとえば横長の場所へ正方形の画像を入れると、上下が切れたり、周囲のレイアウトがずれたりすることがあります。
基本は元画像と同じ縦横比にします。大きすぎる画像は表示を遅くするため、掲載場所に合う大きさと形式に調整します。ファイル名は「IMG_001」より、「service-mobile-fix」のように内容が分かる半角英数字がおすすめです。
4.新しい画像をアップロードして差し替える
対象ページの編集画面を開き、画像ブロックなどから新しい画像をアップロードします。切り抜き位置や表示サイズも確認してください。
テーマ設定やページ作成プラグインで登録された画像は、通常の編集画面にないことがあります。場所が分からないときは、無理に設定を触らず作業を止めましょう。
5.代替テキストを設定する
代替テキストは、画像が表示されないときや画面読み上げ時に内容を伝える文章です。装飾画像を除き、何を表すか簡潔に入力します。
人物写真なら「パソコンでWebサイトを確認するスタッフ」のように書き、検索語を不自然に詰め込まないようにします。
6.公開後にパソコンとスマホで確認する
更新後はパソコンとスマートフォンで、画像の切れ、引き伸ばし、文字との重なり、表示速度を確認します。できればプレビューしてから公開しましょう。
古い画像が見える場合はキャッシュが原因かもしれません。別のブラウザやシークレットウィンドウで確認し、必要に応じてキャッシュを削除します。方法が分からないまま設定やプラグインを削除するのは避けましょう。
よくある失敗
画像差し替えで多いのは、元画像を消してしまう、縦横比の違う画像でレイアウトが崩れる、大容量画像でページが重くなる、代替テキストを入れ忘れる、といった失敗です。
また、ファイル名を同じにして上書きすると、キャッシュの影響で古い画像が表示され続けることがあります。新しいファイル名で登録すると、状況を整理しやすくなります。
自分で作業せず、相談したほうがよいケース
画像の場所が編集画面で見つからない、差し替えるとスマホ表示だけ崩れる、同じ画像が複数ページで使われている、バックアップや復元方法が分からない場合は、作業前に詳しい人へ相談するのがおすすめです。
特にテーマファイルやCSSの修正が必要なケースは、画像の変更だけで解決しないことがあります。
まとめ
WordPressの画像差し替えでは、「元に戻せる準備」「サイズと比率の確認」「公開後の表示確認」が大切です。少し慎重に進めるだけで、多くのトラブルを防げます。
画像を変えたいけれど操作場所が分からない、スマホで表示が崩れてしまったという場合は、「Webちょい修正」で画像差し替えや表示調整を承っています。購入前のお見積りで対象ページとご希望を確認しますので、小さな変更でもお気軽にご相談ください。