「せっかくアップロードした画像が表示されない…」というワードプレスあるある、経験したことはありませんか？
ブログやサイトの見栄えを左右する画像が表示されないトラブルは、初心者からベテランまで誰もが一度は経験する悩みです。
本記事では、ワードプレスで画像が表示されない原因を徹底解明し、具体的な解決法をステップバイステップで解説します。
私自身、100以上のワードプレスサイトを構築してきた経験から、最も効果的な対処法をお伝えします。
この記事を読めば、画像表示の問題を自力で解決できるようになり、魅力的なサイト作りを再開できるでしょう。
ワードプレスで画像が表示されない主な原因
ワードプレスで画像が表示されない問題は、いくつかの典型的なパターンに分類できます。
まずは原因を理解することで、効率的に問題解決に取り組みましょう。
1. パーミッション設定の問題
ワードプレスで画像が表示されない最も一般的な原因の一つが、ファイルのパーミッション設定です。
パーミッションとは、サーバー上のファイルやフォルダに対する権限設定のことで、適切に設定されていないと画像ファイルへのアクセスが制限され、表示されなくなります。
特に新しいサーバーに移行した際や、セキュリティプラグインを導入した後に発生しやすい問題です。
2. ファイルパスの問題
画像のファイルパスが正しく設定されていないと、ワードプレスは画像の場所を特定できず、表示できません。
絶対パスと相対パスの混在や、サイトURLの変更後に発生することが多いトラブルです。
特にサイトの引っ越しやドメイン変更後に画像が表示されなくなるケースが多く見られます。
3. キャッシュの問題
ブラウザキャッシュやプラグインのキャッシュが古い情報を保持していると、新しくアップロードした画像が正しく表示されないことがあります。
キャッシュプラグインを使用している場合は特に注意が必要です。
4. 画像ファイル自体の問題
画像ファイルが破損している、サポートされていない形式である、またはファイル名に特殊文字が含まれているなど、ファイル自体に問題がある場合もあります。
日本語ファイル名を使用している場合、サーバー環境によっては文字化けを起こし、画像が表示されないことがあります。
5. メディアライブラリの問題
ワードプレスのメディアライブラリ機能に問題が生じると、正しくアップロードされた画像でも表示されないことがあります。
データベースとの連携エラーや、メディア設定の不具合が原因となるケースです。
ワードプレスで画像が表示されない問題の解決法
それでは、ワードプレスで画像が表示されない問題を解決するための具体的な方法を見ていきましょう。
初心者でも実践できるよう、ステップバイステップで解説します。
解決法1: パーミッション設定を確認・修正する
画像ファイルのパーミッション設定が適切でない場合、以下の手順で修正します。
- FTPクライアント（FileZillaなど）を使ってサーバーに接続する
- wp-content/uploads フォルダに移動する
- 問題の画像ファイルを右クリックし、「ファイル権限」または「パーミッション」を選択
- 数値を「644」に設定（フォルダの場合は「755」）
- 「すべてのファイルに適用」にチェックを入れて確定
この設定により、Webサーバーが画像ファイルを読み取れるようになり、表示の問題が解決することが多いです。
実際に私のクライアントサイトでも、サーバー移行後に画像が表示されなくなった事例がありましたが、パーミッション設定の修正で即座に解決しました。
解決法2: ファイルパスを修正する
ファイルパスの問題を解決するには、以下の方法を試してください。
データベース内のURLを一括置換する方法
- バックアップを必ず取っておく
- 「Better Search Replace」などのプラグインをインストール・有効化
- 古いURLから新しいURLへの置換を実行
例えば、http://example.com から https://example.com に変更した場合、この変更をデータベース内でも反映させる必要があります。
functions.php に修正コードを追加する方法
テーマの functions.php ファイルに以下のコードを追加することで、画像パスを修正できます。
“`php function fix_image_paths($content) { return str_replace(‘src=”http://旧ドメイン’, ‘src=”https://新ドメイン’, $content); } add_filter(‘the_content’, ‘fix_image_paths’); “`
このコードは、コンテンツ内の古いドメインを新しいドメインに置き換える働きをします。
解決法3: キャッシュをクリアする
キャッシュが原因で画像が表示されない場合、以下の手順でクリアします。
ブラウザキャッシュのクリア
- Chrome: Ctrl+Shift+Delete（Windows）または Command+Shift+Delete（Mac）
- 「キャッシュされた画像とファイル」にチェックを入れる
- 「データを削除」をクリック
ワードプレスキャッシュプラグインのクリア
W3 Total Cache、WP Super Cache、WP Rocket などのキャッシュプラグインを使用している場合：
- 管理画面からプラグインの設定ページにアクセス
- 「キャッシュを削除」または「キャッシュをパージ」オプションを実行
キャッシュのクリアは、特に新しい画像をアップロードした後に古い画像が表示され続ける場合に効果的です。
私の経験では、クライアントから「更新したはずの画像が変わらない」という相談を受けた際、ほとんどの場合はキャッシュが原因でした。
解決法4: 画像ファイルを最適化して再アップロード
画像ファイル自体に問題がある場合、以下の対策を試してください。
ファイル名の最適化
- 日本語や特殊文字を含むファイル名を英数字に変更（例：「写真1.jpg」→「photo1.jpg」）
- スペースをハイフンに置き換える（例：「my photo.jpg」→「my-photo.jpg」）
- 最適化した画像を再アップロード
画像形式の確認と変換
ワードプレスが標準でサポートする画像形式（JPG、PNG、GIF、WebP）に変換します。
特に最近のサイトでは、WebP形式の採用が増えていますが、古いブラウザとの互換性に注意が必要です。
解決法5: メディアライブラリの修復
メディアライブラリに問題がある場合、以下の方法で修復できます。
「Add From Server」プラグインの利用
- 「Add From Server」プラグインをインストール・有効化
- サーバー上にある画像をメディアライブラリに再登録
データベーステーブルの修復
PHPMyAdminなどのデータベース管理ツールを使用して：
- wp_posts テーブルと wp_postmeta テーブルを選択
- 「修復」操作を実行
この方法は上級者向けですので、必ずデータベースのバックアップを取ってから実行してください。
プラグインによる画像表示問題の解決法
ワードプレスのプラグインを活用して、画像表示の問題を解決する方法もあります。
解決法6: 「Enable Media Replace」プラグインの活用
「Enable Media Replace」プラグインを使用すると、既存の画像を同じURLを維持したまま置き換えることができます。
- プラグインをインストール・有効化
- メディアライブラリから問題の画像を選択
- 「Replace Media」オプションをクリック
- 新しい画像ファイルをアップロード
このプラグインは、画像のURLを変更せずに内容だけを置き換えるため、リンク切れを防止できます。
解決法7: 「Regenerate Thumbnails」プラグインの使用
サムネイル画像が表示されない場合、このプラグインでサムネイルを再生成できます。
- プラグインをインストール・有効化
- 「ツール」→「Regenerate Thumbnails」にアクセス
- 「Regenerate All Thumbnails」をクリック
テーマを変更した後や、画像サイズの設定を変更した後に特に効果的です。
解決法8: 「WP-Optimize」で画像最適化
「WP-Optimize」プラグインを使用して、画像を最適化し表示の問題を解決できます。
- プラグインをインストール・有効化
- 「WP-Optimize」→「画像」タブにアクセス
- 「画像の圧縮」を実行
このプラグインは画像の最適化だけでなく、データベースの最適化も行えるため、サイト全体のパフォーマンス向上にも役立ちます。
サーバー側の設定による解決法
サーバー側の設定を変更することで、画像表示の問題を解決できる場合もあります。
解決法9: .htaccessファイルの修正
サーバーの.htaccessファイルに以下のコードを追加することで、画像へのアクセス権限を調整できます。
“` RewriteEngine On RewriteRule ^wp-content/uploads/(.*)$ [L] “`
このコードは、wp-content/uploadsディレクトリへのアクセスを許可し、画像ファイルが正しく表示されるようにします。
ただし、.htaccessファイルの編集は慎重に行う必要があります。誤った設定を行うとサイト全体にアクセスできなくなる可能性があるため、必ずバックアップを取っておきましょう。
解決法10: PHPのメモリ制限を増やす
大きなサイズの画像が表示されない場合、PHPのメモリ制限が原因かもしれません。
wp-config.phpファイルに以下のコードを追加して、メモリ制限を増やします。
“`php define(‘WP_MEMORY_LIMIT’, ‘256M’); “`
この設定により、ワードプレスが使用できるメモリ量が増え、大きな画像も処理できるようになります。
解決法11: CDNの設定を確認する
Cloudflareなどのコンテンツ配信ネットワーク（CDN）を使用している場合、CDNの設定が画像表示に影響していることがあります。
- CDNのダッシュボードにアクセス
- キャッシュ設定を確認
- 必要に応じてキャッシュをパージ（クリア）
CDNを使用している場合、画像が更新されてもCDN側のキャッシュが古い画像を保持している可能性があります。
テーマ関連の画像表示問題の解決法
ワードプレスのテーマに関連した画像表示の問題も少なくありません。
解決法12: テーマの互換性を確認
使用しているテーマがワードプレスの最新バージョンと互換性があるか確認します。
- テーマの開発者サイトやドキュメントを確認
- 必要に応じてテーマを更新
- 問題が解決しない場合は、一時的にデフォルトテーマ（Twenty Twenty-Threeなど）に切り替えて確認
デフォルトテーマで画像が正常に表示される場合、使用中のテーマに問題がある可能性が高いです。
解決法13: テーマのfunctions.phpを確認
テーマのfunctions.phpファイルに、画像サイズや表示方法に関する設定がないか確認します。
特に、add_image_size()関数の設定を確認し、必要に応じて修正します。
例えば、以下のようなコードがある場合、サムネイルのサイズ設定を変更できます。
“`php add_image_size(‘custom-thumbnail’, 300, 200, true); “`
この設定を変更した後は、「Regenerate Thumbnails」プラグインでサムネイルを再生成する必要があります。
高度なトラブルシューティング
上記の方法で解決しない場合は、より高度なトラブルシューティングが必要かもしれません。
解決法14: デバッグモードを有効にする
wp-config.phpファイルを編集して、デバッグモードを有効にします。
“`php define(‘WP_DEBUG’, true); define(‘WP_DEBUG_LOG’, true); define(‘WP_DEBUG_DISPLAY’, false); “`
この設定により、エラーログが生成され、画像表示の問題の原因を特定するのに役立ちます。
ログファイルは通常、wp-content/debug.logに保存されます。
解決法15: データベースの接頭辞を確認
複数のワードプレスインストールが同じデータベースを共有している場合、テーブル接頭辞の設定に問題がある可能性があります。
wp-config.phpファイルで、$table_prefix変数を確認します。
“`php $table_prefix = ‘wp_’; “`
各ワードプレスインストールには、一意の接頭辞が必要です。
予防策：画像表示問題を未然に防ぐ方法
画像表示の問題を未然に防ぐためのベストプラクティスをご紹介します。
1. 定期的なバックアップの実施
サイト全体とデータベースの定期的なバックアップを取ることで、問題が発生した際に復元できます。
「UpdraftPlus」や「BackWPup」などのプラグインを使用すると、自動バックアップが簡単に設定できます。
2. 画像のファイル名とサイズの最適化
アップロード前に以下の点に注意しましょう：
- ファイル名は英数字とハイフンのみを使用
- 画像サイズは必要以上に大きくしない（通常は1920px幅以下）
- ファイルサイズを圧縮（「Smush」や「EWWW Image Optimizer」などのプラグインが便利）
3. 定期的なメンテナンス
サイトの健全性を維持するために、以下のメンテナンスを定期的に行いましょう：
- ワードプレス本体、テーマ、プラグインの更新
- 不要なプラグインの削除
- データベースの最適化
- メディアライブラリの整理
まとめ：ワードプレスの画像表示問題を確実に解決するために
ワードプレスで画像が表示されない問題は、様々な原因が考えられますが、本記事で紹介した15の解決法を順に試すことで、ほとんどのケースで解決できるはずです。
問題解決の基本的なアプローチは以下の通りです：
- まずは簡単な解決法（キャッシュのクリアなど）から試す
- 問題が続く場合は、パーミッションやファイルパスなどの設定を確認
- それでも解決しない場合は、プラグインを活用した解決法を試す
- 最後に、サーバー設定やテーマ関連の高度な解決法に進む
また、問題を未然に防ぐための予防策も忘れずに実施しましょう。
ワードプレスサイトの運営において、画像は非常に重要な要素です。
適切に表示される画像は、読者の理解を助け、サイトの魅力を高めます。
本記事の解決法を参考に、画像表示の問題を解決し、魅力的なワードプレスサイトを運営してください。
「ワードプレスの森」では、他にもワードプレスのトラブルシューティングや活用法に関する記事を多数公開しています。
ぜひ他の記事もチェックして、WEB制作の第一歩を踏み出しましょう。
コメント