Web WordPress

WordPressでインポートした画像が記事で表示されない場合の対処法[Better Search Replace][WordPress]

更新日:

janeb13 / Pixabay

 

ども、こんにちわ!@yuki_PHZです!

WordPressで新しくドメインやサーバーを変更した時に、エクスポートとインポートで移管しますよね。

そのあと、記事を確認したらあら大変。

一部の画像が表示されなくなってしまった、なんてことになってそのままにしている人いるかもしれませんね。

ちょうど私も同じ症状になったので、自身で対策方法を調べてまとめてみました。

こちらの記事が画像が表示されなくなっていた記事です。

[PHP]Dreamweaverでローカル環境でPHPを動かしたい人のサイト定義[WordPress]

困っている人の役に立ちますように!

原因の特定をする

早速原因を調べます。

推測して、調べてみる

画像が表示されていないのであれば、可能性としては2つ。

画像ファイルが存在しないか、画像のパスが間違っているか。

メディア一覧を見てみると、どうやらエクスポートとインポートは成功しているみたいで、画像もメディアに存在していることが確認できました。

では、次に画像のパスはどうだろう。記事の編集画面でビジュアルではなくテキストの編集モードに切り替えます。

あ、見つけました。

記事の文面自体もそのままエクスポートしているようなので、新しいドメインに変更した場合には古いドメインのまま記述されてしまっています。

このブログのドメインは、http://wlzphz.comなので、http://peakheadz.comのままは間違いですね。

今回の症状では、ドメイン変更によるパスの違いで画像が表示されなくなっていることが判明しました。

対処法を考えてみる

原因がわかったところで、対処法は簡単です。

正しいパスに記述を直すこと。テキスト編集モードでどんどんペースト&ペーストしていけば直せます。

でも、それって面倒くさいですよね。

実際、他の記事にも同じ症状が出てしまっていたとしたら、それを見つける手間と訂正作業が必要になってしまいます。

それを手作業でするには、Webやそもそもパソコンに携わっている人間としてはちょっとお粗末過ぎるかなと思います。

より楽な方法を考えてみる

ということで、何か便利な方法がないかと思い調べて見たところありました。

Better Search Replaceというプラグインを発見。

機能は、極めて簡単。言葉を検索して、一気に置換できます。

まさに必要としている機能ですね。早速インストールして使っていきます。

プラグインで便利な機能を使う

プラグインを追加で検索して、今すぐインストールします。

有効化したら、ツールの欄に追加されるので、クリックです。

 

Better Search Replaceで検索置換する

使い方は、とても簡単です。

Seardh forの入力欄に変更したい文を入れます。

Replace withに変更後の文を入力します。

忘れずに、どのデータベースのテーブル内を検索するか指定します。

テーブルは、記事情報はwp_postsに入っています。

確認したい場合は、データベースから直接確認して見てください。

今回は、wp_potmetaも選択して置換したいと思います。

では、Dry Runにチェックしたまま実行して見ましょう。

Dry Runのままであれば、テーブルないに変更したい文があるかどうか確認することができます。

問題なければ、Dry Runのチェックを外して実行して置換しましょう。

画像上部に緑ラインで実行結果が表示されれば、成功です。

記事のテキスト編集モードで確認して見ましょう。

しっかりURLが変更されていることを確認できました。

新たな問題の原因を特定する

ここで新たな問題です。

記事を表示するまだ画像が表示されません。

画像もあるし、パスも正しい、もしかしたら画像の名前が違うかもしれません。確認して見ましょう。

記事中には、ファイル名の文頭にスクリーンショットの文字があったにも関わらず、サーバーにある画像のファイル名にはその文字が消えています。

試しに、記事のテキスト編集モードで画像のファイル名をサーバーにあるファイル名に合わせて見ます。

すると、無事画像を表示させることが出来ました。

ファイル名を変更していない画像ファイルは表示されていません。

あとはやることは、URLを一気に置換したように、画像のファイル名をまとめて置換するだけです。

Better Search Replaceでパス内の画像ファイル名を検索置換する

今回のケースでは、ファイル名の余分な記述を減らすだけで解決できます。

検索置換は便利な反面コツがいる

しかし、どのような文をどうすれば正しくできるかは、実際の文次第なので注意が必要です。

実際の検索置換作業の際は注意してください。

このように、/スクリーンショット-を検索して、変更後は/のみにしたいと思います。

あえて、/を残すのは、置換対象文字を特定するためと、あくまで置換で削除ではないので変更後の文を/のみにすることでスクリーンショットーを消しています。

画像表示されない問題が無事解決しました

確認のち、実行して見ました。

記事を見てみます。

無事、記事内の画像が全て表示させることができました。

お疲れ様でした。

 

まとめ

  1. 原因の特定
  2. 対処法を考えたら、楽にできるか調べる
  3. 置換できるプラグインをインストール
  4. 画像表示されるまでトライアル・アンド・エラー

画像表示の問題を解決したのは、こちらの記事です。

[PHP]Dreamweaverでローカル環境でPHPを動かしたい人のサイト定義[WordPress]

スポンサーリンク

-Web, WordPress
-, ,

Copyright© WebLogz , 2019 All Rights Reserved.