画像が表示しない原因は？

サイトの移転後に画像が表示しなくなった主な原因は以下の2点です。

●サイトのアドレス違い
●画像名が文字化け

サイトのアドレスが違い

「サイトのアドレスが違い」としては、元は「https://～」だったのが、サイト移転後に「http://～」になっているケース。

画像のアドレスを「http://～」を「https://～」を変更することで画像が表示するようになります。

画像名が文字化け

画像名が何かの原因で文字化けしていると、表示すべき画像を指定できないので画像が表示できません。

画像の文字化けを修正する方法

画像の文字化けを確認

記事に張りつけた画像のURLを見てください。
画像のURLは以下になっているはず。

<img src=”URL” alt=”” width=”” height=”” />

上記のタグのURLが画像を保管している場所です。

私の場合、

https://domain/wp-contet/uploads/○○.jpg

WordPressサイトの場合、通常、「wp-contet」フォルダ内の「uploads」フォルダに画像が置かれています。

そこで、「uploads」フォルダを確認。
画像名が文字化けしていれば、画像が表示しない原因は「文字化け」になります。

今回はロリポップ からエックスサーバー にサイトを移転して、文字化けがおこりました。
具体的に見ていきます。

エックスサーバーの画像ファイル名

以下はエックスサーバー のファイル管理（「uploads」フォルダ）の画像です。
画像名が「文字コードエラー」となっています。⇒文字化け

念の為、FTPサーバー（WinSCP）も確認してみましょう。
右の赤枠内がエックスサーバーの「uploads」フォルダの内容ですが、見事に文字化けしています。

FTPサーバーの画像

では、サイト移転元のロリポップ のロリポップ!FTP（「uploads」フォルダ）はどうだったのか？見てみましょう。

サイト移転元のロリポップの画像名は文字化けしていません。
しかし、サイト移転後のエックスサーバーでは画像が文字化けしています。

何故、このようなことが起こるのか？
これに関しては不明です。

しかし、文字化けをを治す方法はあります。

画像の文字化けを直す方法

方法は簡単です。
サイト移転元の「uploads」フォルダ内の画像ファイルをローカルにダウンロード。
その後、エックスサーバーの「uploads」フォルダにアップロードするだけ。
これで正常に表示されました。

画像のダウンロード

画像のダウンロードはFTPソフトを使います。
画面の右がサーバー側、左がローカル（PC）です。
※以下の「wp-contet」フォルダ内に「uploads」フォルダがあります。

私のおすすめは、WinSCP。
使って数年たちますが、今のところ、不具合はありません。

ローカルに任意のフォルダを作り、移転元のサーバーの画像ファイルをダウンロード。

画像ファイルのダウンロードに要する時間は、画像ファイルの大きさと数によります。
極端に多くない限り、そんなに時間はかからないでしょう。

画像のアップロード

画像のアップロードもFTPソフトを使います。
但し、アップロードする時に画像名が文字化けしていないことを確認して下さい。

そして、アップロードする前に、文字化けした画像ファイルは削除しておきます。
「uploads」フォルダには画像ファイル以外にもファイルがあります。
間違って、画像ファイル以外のファイルを削除しないようご注意下さい。

画像のアップロードが完了したら、実際にサイトの画像が表示されているかを確認しましょう。

正常に表示されていればこれで完了です。

サイト移転の方法

サイト移転は、「移転」「移行」「引っ越し」等の言葉が使われることがあるが、いずれも同じ。

サイト（ドメイン）のファイルを置いているレンタルサーバーを変更することだ。

サイト移転の方法は大きく2つ。

●レンタルサーバーの「WordPress簡単移行」ツールを使う。
●自力でサイト移転を行う。

レンタルサーバーの「WordPress簡単移行」ツールを使う

サイトの移行には、レンタルサーバーの「WordPress簡単移行」ツールを使うのが最も簡単だ。
※「WordPress簡単移行」ツールの名称はレンタルサーバーによって異なる。

しかし、エラーが表示し、サイトの移行が出来ない場合がある。
⇒失敗事例

「WordPress簡単移行」ツールでサイトの移行に失敗し、原因も対処方法も分からない時は自力でサイト移転を行うしかない。

自力でサイト移転を行う

自力でサイト移転を行う場合、2つの方法がある。

①WordPressのプラグインを使う。
②FTPサーバーとphpMyAdminを使う。

私は、「WordPress簡単移行」ツールでサイトの移行に失敗する場合、もっぱら、②のFTPサーバーとphpMyAdminを使ってサイト移転を行っている。

動作確認時のエラーと対処方法

動作確認時のエラーはいくつかある。

●デザインが反映されていない。
●403エラー
●500エラー
●この接続ではプライバシーが保護されません
●ホームページがアップロードされていません。
●その他

デザインが反映されていない。

たまに、動作確認URLにアクセスするとデザイン（css）が反映されていないことがある。

この場合は、hostsファイルを修正すると、正常に表示することが多い。
hostsファイルの修正と動作核に方法は⇒ hostsファイルを編集して確認する方法【エックスサーバー】

403Forbiddenエラー

ロリポップの場合、FTPアクセス制限の設定がされている。
そこで、.htaccessの下記のコードを削除したら、この表示が消えた。

# BEGIN Lolipop [ http://lolipop.jp/manual/blog/wordpress-htaccess/ ]

ErrorDocument 403 /lolipop_service_documents/wp-login-deny.html
Order deny,allow
Deny from all
Allow from ●●●.●●●.●.●●●

# END Lolipop

500Internal Server Error

考えられるのは、プラグインの干渉だ。
そこで、.htaccessに記述されているプラグイン関係の記述を全て削除したら、エラー表示が消えた。

この接続ではプライバシーが保護されません

このエラーメッセージはネームサーバーを変更後に通常表示されるものだ。
要はサイトがhttpsではなくhttpで通信されている場合。

サイトを移転した場合、サイトのSSL化は、ネームサーバーの変更が浸透してからなので、時間がかかる。

動作確認時にこのエラーメッセージが表示されることはあまりない。
.htaccessの下記のコードを削除したら、この表示が消えた。

RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]

ホームページがアップロードされていません。

これはレンタルサーバーにドメイン設定をしたばかりの時に表示されるメッセージの1つ。
※画像はエックスサーバー

ドメイン設定時に自動的に生成されたindex.htmlが原因だ。

WordPressをインストールとトップページはindex.php。
しかし、WordPressファイルを旧サーバーから移行先サーバー（エックスサーバー）にアップする時に生成されたファイルを削除しなかった為にindex.htmlとindex.phpが混在することになった。

index.html＞index.phpからなのか、index.htmlがindex.phpの上に記述されていた為なのかは不明だが、index.htmlが表示された。

index.htmlを削除すると表示した。
WordPressファイルをアップロードする時は、移転先に元々あるファイルは削除してから行うのが良い。

その他

その他のエラーの原因として考えられるのは、wp-config.phpのデータベースの修正間違い。
wp-config.phpの修正については⇒wp-config.phpを修正

動作確認URLでサイト（のトップページ）が正常に表示されれば、ネームサーバーの変更を行う。

FTPを使ってサイト移転（引越し）を行う方法

「FTPサーバーを使ってサイト移転（引越し）」と、これまで記述してきたが、使うのはFTPサーバーだけではない。

FTPサーバー以外に、データベースのエクスポートとインポートにphpMyAdminも必要だ。

サイト移転（引越し）には大まかには、以下の作業が必要。

●WordpressファイルをFTPを使って移転
●データベースをphpMyAdminを使って移転
●wp-config.phpを修正
●動作確認URLでサイト表示を確認
●ネームサーバーを変更
●SSL化

WordPressファイルをFTPを使って移転

さらに細かい手順は以下になる。

①エックスサーバーでドメイン設定
②ロリポップにあるWordpressファイルをローカルフォルダにダウンロード
③ダウンロードしたWordpressファイルをエックスサーバーにアップロード

データベースをphpMyAdminを使って移転

④ロリポップのphpMyAdminにある移転予定のドメインに紐づけされたデータベースをエクスポート
⑤エックサーバーでデータベースを作成し、エクスポートしたデータをインポート

wp-config.phpを修正

データベースの情報が記載されたwp-config.phpを修正。

動作確認URLでサイト表示を確認

「動作確認」はネームサーバーの変更前に行う。
※確認できるのはトップページのみ

「動作確認」でサイトが正常に表示されない時は、何か問題がある。

ネームサーバーを変更

ネームサーバーを変更して浸透するまで数時間から72時間かかる。
※ConoHaWINGでは「24時間から72時間」と表記

SSL化

サイトのSSL化はネームサーバーを変更してからでないと行えない。
その間、サイトにアクセスすると「プライバシーエラー」が表示される。

WordPressファイルをFTPを使って移転

エックスサーバーでドメイン設定

まず、エックスサーバーで移行予定のドメインを追加する。

ドメイン設定追加

ドメインの追加は「ドメイン設定」→「ドメイン設定追加」から行う。

無料独自SSLの設定に失敗

「無料独自SSLの設定に失敗しました」と表記されているが、これはネームサーバーを変更していない為。
この段階では、まだネームサーバーは変更しないのでそのままで良い。

ドメイン追加完了

右下の「追加する」をクリックして、ドメインの追加完了。

ロリポップにあるWordpressファイルをローカルフォルダにダウンロード

FTPサーバーを使うにはFTPソフトの設定が必要だ。
※私の場合、FTPソフトはWinSCP。

WordPressファイルのダウンロード自体は難しくない。
ローカル（PC）にフォルダを使って、以降予定のドメインのWordpressファイルをダウンロード。

大体30分くらいかかる。
※もっとかかる場合もあり。

ダウンロードしたWordpressファイルをエックスサーバーにアップロード

今度はダウンロードしたWordpressファイルをそっくりそのまま、エックスサーバーにアップロードする。

こちらも、大体30分くらい。
※もっとかかる場合もあり。

データベースの移行

データベースのエクスポート

旧レンタルサーバーのphpMyAdminにログインしてデーベースをエクスポート。⇒失敗しないデータベースのエクスポート方法【サイト移行】

データベースのインポート

移転先のレンタルサーバーののphpMyAdminにログインしてデーベースをインポート。⇒失敗しないデータベースのインポート方法【サイト移行】

WordPressファイルの移行及びデータベースのインポート後の作業

WordPressファイルの移行及びデータベースのインポート後に行う作業は以下の4点。

●wp-config.phpの修正⇒wp-config.phpを修正
●動作確認⇒動作確認時のエラーの原因と対処方法【サイト移転（引越し）】
●ネームサーバー変更
●SSL化

ネームサーバー変更

ネームサーバー変更の変更は、お名前.comやエックスドメイン等のドメイン管理業者の管理画面から行う。

SSL化

エックスサーバーの倍、「ドメイン」⇒「SSL設定」をクリック。
「ドメイン選択画面」でSSLを設定するドメインを「選択する」。
「確認画面へ進む」をクリックすると以下の画面に。

SSL設定が反映されるまで最大1時間程度かかる。
「反映待ち」の文字が消えたら、SSL用アドレスをクリックして表示を確認。
※1時間経っても変わらない場合はページを再読み込みする。
サイトが正常に反映されていれば、サイト移転は終了となる。

データベースのインポート

エックスサーバー にサイトを移転する場合、ドメインを追加設定する。ドメインの追加設定については別記事をご参照ください。

データベースの追加

エックスサーバー の「サーバー管理」⇒「データベース」⇒「MySQL設定」⇒「MySQL追加」。

「MySQLデータベース名」の「▲▲_●」の「●」の中に任意のデータベース名を入力。
管理し易いように、ドメイン名等を付けると分かりやすい。
但し、データベース名で使えるのは半角英数字のみ。
従って、「△△.com」は使えないので、「△△」を使うと良い。

ユーザー名を入力したら、「確認画面に進む」をクリック。
内容を確認したら、「追加する」をクリック。
尚、データ名は「▲▲_●」。

次にユーザー追加を行う。

ユーザー追加

ユーザーID及びパスワードはphpMyAdminにログインする時必要だ。
内容は任意だが、上記で設定したデータベース名をユーザー名（ID）にすると分かりやすい。

ユーザーIDとパスワードを入力したら「確認画面へ進む」
内容を確認し、「追加する」をクリック。

データベースとユーザーを紐づけ

最後に上記で設定したデータベースとユーザー名を紐づけする必要がある。
「MySQL設定」に戻り、「MySQL一覧」をクリック。
上記で設定した、データベース名を探す。
ところが、「アクセス権所有ユーザ」は、「ユーザーはいません」とある。

「アクセス権所有ユーザ」の右隣りに「アクセス権未所有ユーザ」の項目があり、プルダウンでユーザーを選択できる。

この中から、先ほど設定したユーザーIDを探し、選択したら「追加」をクリック。

すると、「MySQLデータベースへのアクセス権の追加を完了しました。」と言うメッセージが出るので「戻る」をクリック。

確認するとユーザー名が設定され、これでデータベースとユーザー名の紐づけが出来た。

以下の情報はwp-config.phpを編集する時に必要なので保管のこと。
●データベース名
●ユーザー名
●パスワード
●MySQLのホスト名：ユーザー名の右横の（）内

phpMyAdminにログイン

「データベース」⇒「phpMyAdmin」をクリック。
上記で設定したユーザ名とパスワードを入力し「ログイン」。

上部の「インポート」タブをクリック。
「ファイルを選択」をクリックし、エクスポートしたファイルを選択。
「実行」をクリック。

これでインポートが完了。
データベースのファイル容量が大きいとエラーが出るが、問題なくエキスポートができていれば、ここでも問題は起こらない。

データベースのインポート後の作業

wp-config.phpを修正

WordPressサイト移転時にデータベースをインポートしただけでは、WordPressとデータベースが関連づかない。

FTPサーバーで旧レンタルサーバーにあったWordPressでファイルをエックスサーバーにアップロードするが、wp-config.phpに記載されているのは旧レンタルサーバーの情報である。

wp-config.phpのデータベースの情報をエックスサーバーの情報に書き換える必要がある。

書き換えるのは以下の4点。
●データベース名
●ユーザー名
●パスワード
●MySQLのホスト名

動作確認

レンタルサーバーには通常、動作確認URLが設けられている。
動作確認URLでサイト（のトップページ）の表示を確認し、問題なければ、ネームサーバーを変更する。

しかし、ロリポップ からエックスサーバー にWordPressサイトを移転した時、動作確認を行ったらエラーが発生した。⇒別記事参照

データベースとは？

WordPressをインストールすると、記事を投稿すると記事のデータが増えていく。
こういったデータがデータベースに溜まっていく。

WordPress1つに対してデータベースは1個だ。

データベースは各レンタルサーバーのphpMyAdminで管理されている。

従って、サイトを移転するには、以下の作業が必要になる。

サイト移転に伴うデーターベース関連の作業

①ロリポップのphpMyAdminにログインし、データベースをエクスポート
②エックスサーバーでデータベースを新規で作成。
③エックスサーバーのphpMyAdminにログインし、データベースをインポート
④wp-config.phpのデータベース情報を修正

尚、phpMyAdminにログインする時のユーザー名・パスワード等もwp-config.phpに記載されている。

ロリポップは1つのデータベースで複数のデータベースを管理

エックスサーバーでは、WordPress1個＝データベース1つに個別のユーザー名・パスワード等が対応しているが、ロリポップでは、1ドメインに複数のWordPressをインストールした場合、1つのユーザー名・パスワードで複数のデータベースを管理する事になる。
※WordPress1つに1つの接頭辞が割り振りされている。
※同じ接頭辞のファイルの固まりが1つのWordPressデータベース1個分

データベースのエクスポート

phpMyAdminを開く

ロリポップのphpMyAdminにログインしてデータベースにアクセス。
ロリポップのphpMyAdminは、「サーバーの管理・設定」→「データベース」。
以下のページで「phpMyAdminを開く」をクリック。

phpMyAdminにログイン

下記のページで、ユーザー名、パスワードを入力し、サーバの選択を行ったら、「実行」クリック。

データベースのユーザー名・パスワード・サーバはどこ？

データベースのユーザー名・パスワード・サーバは移行予定のドメインのWordpressファイルのwp-config.phpに記載されている。
「サーバーの管理・設定」→「ロリポップ!FTP」をクリック。
移行予定のドメインのWordpressフォルダを開く。

下記の赤枠内の個所ををメモ帳等にコピペ。

そして、データベース情報を下にスクロールし、「WordPress データベーステーブルの接頭辞」もメモ帳等にコピペ。

下記の「$table_prefix = ‘●_’;」の「●_」の部分。

各々の値「’●●●●’」の「●●●●」を入力と選択を行い、phpMyAdminにログイン。

接頭辞は何？

これでphpMyAdminにログイン出来るのだが、問題が発生。
私の場合、1つのドメインに複数のWordpressをインストールしており、1つのデータベースに複数のデータベースが存在。
※仕様はレンタルサーバーによって異なり、エックスサーバーではデータベース1個にデータベース1個。

下図では、接頭辞がwp1_からwp3_まで見えるが、これ以外に、wp4_、wp5_、wp_もある。

問題は、以降予定のドメインのデータベースはどれかということ。
この情報も実は、前述のwp-config.phpに記載されている。

データベースをエクスポート

エラーが出やすいのは、エクスポートの場面だ。
エラーの最大の原因はデータベースの容量が大きい事。
1つのドメイン下に複数のWordpressをインストールした場合は注意が必要だ。

ロリポップの場合は1つのデータベースの複数の接頭辞（データベース）が管理されているので、全部のデータベースをエクスポートしようとすると、失敗する。

移行予定のドメインのWordPressのデータベースを選択

1WordPressには1つのデータベースなので、該当する接頭辞ファイルだけ選択する必要がある。

例えば、以降予定のドメインのデータベースの接頭辞が「wp_」なら、「wp_」のファイルにチェックを入れ、一番したの「チェックしたもの：」のプルダウンメニューから「エクスポート」クリック。

「エクスポート」時の設定

次の画面では以下の設定を行い「実行」をクリック
●圧縮：なし→zip形式

●追加コマンド：「DROP TABLE / VIEW / PROCEDURE / FUNCTION / EVENT コマンドを追加する」のチェック

問題がなければ、ファイル保存の画面が表示される。
保存画面が中々表示されず、エラーメッセージが出る場合は、容量の大きいファイルが含まれている可能性がある。

容量の大きいファイルとは？

容量は各ファイルの右の方にある数字。
私の場合、アクセス解析のプラグインstatpressのデータが異様に大きかった。
statpressはサイトが重くなるので今は使っていない。
しかし、今までのデータは残ったまま。

statpressにチェックを入れ「削除」。

以上、ロリポップのデータベースをエクスポートに成功。
次にデーターベースのインポートについて解説します。⇒失敗しないデータベースのインポート方法【サイト移行】

サイトの移転方法

サイトの移転方法には3つの方法がある。

●レンタルサーバーの「かんたん移行」ツールを使う。
●FTPソフトを使う
●Wordpressのプラグインを使う

個々の詳しい説明は省略するが、一番簡単なのが、レンタルサーバーの「かんたん移行」ツールを使う方法。

但し、「かんたん移行」はWordpressサイトの移行ツールだが、名前はレンタルサーバーによって異なる。
※Xserverでは「Wordpress簡単移行」。

ConoHa WING「かんたん移行」ツールでサイトの引っ越し手順

ConoHa WINGの「かんたん移行」ツールを使ったWordpressサイトの引っ越し手順は、ConoHa WINGお乗換えガイドに記載がある。

但し、ここでは実際に私が実行した手順で説明することにする。

①申込
②ドメイン設定
③「かんたん移行」ツールでサイトを移行
④動作確認
⑤ネームサーバーの情報設定
⑥独自SSL設定

申込

ConoHa WINGの申込は、ConoHa WING のトップページの「お申し込み」又は「今すぐお申し込み」から行う。
※いずれも申込ページが開く

ConoHa WING公式サイト⇒ConoHa WING

ドメイン設定

ConoHa WINGの管理画面（コントロールパネル）には、登録したメールアドレスとパスワードでログイン。

左端のメニューから「サーバー管理」クリック。
次に「ドメイン」をクリック。

右上の「+ドメイン」をクリックすると、以下の入力画面が表示。

ドメイン追加

「新規ドメイン」か「サブドメイン」を追加は追加

ドメインを入力してください

「新規ドメイン」の場合には「http(s)://ドメイン/」の「ドメイン」、サブドメインの場合は、「▲▲.ドメイン」となる。

無料独自SSL

「無料独自SSL」を利用できるのはネームサーバーの設定後。
この時点で「利用する」を選択してもエラー表示が出る。

従って、「利用しない」を選択。
ドメインの設定が性交すると、下の一覧表に設定したドメイン名が表示される。

「かんたん移行」ツールでサイトを移行

ConoHa WINGのコントロールパネルの左のメニューから「サイト管理」をクリック。
「サイト設定」→「アプリケーションインストール」を選択後、「+アプリケーション」をクリック。
以下の入力画面が表示される。
※インストールをする前にチェックすべきポイントがある。インストール前のチェックを怠ると、サイト移転に失敗する可能性がある。インストール前にチェックすべきポイントは別記事参照。

アプリケーション

「Wordpress」を選択。

インストール方法

「かんたん移行」を選択。

バージョン

「4.9.12」か「5.3.0」のいずれか。
自分のWordpressサイトのバージョンを選択。

サイトURL

「wwwあり」か「wwwなし」を選択。
通常は「wwwなし」。
その下に「http(s)://ドメイン名/」に続き、空欄があるが、これはサブディレクトリーにWordpressをインストール場合に、フォルダ名を入力すうｒ。

移行元ユーザー名・移行元バスワード名

いずれも移行元のWordpressにログインする時のユーザー名とパスワード。

データベース名

予めデータベース名とユーザー名が入力されている。
任意なので別の名前に変えても良いが、そのままでも問題はない。

パスワード

データベースのphpMyAdminの管理画面にログインする時のパスワード。
任意に設定。

以上を設定すると以下のようになる。

下部の「保存」をクリック。

動作確認

ConoHa WINGへのサイト移行後にサイトが正常に表示されるかを「動作確認URL」で確認。

「サイト管理」→「サイト設定」→「基本設定」→「動作確認URL」
「動作確認URL」をクリックし「利用設定」を「ON」にすると、「動作確認URL」が表示される。

「動作確認URL」をクリック。
サイトが正常に表示されればOKだが、正常に表示されない場合がある。
私の場合は、デザイン（CSS）やテーマが反映しないという問題が発生。

「動作確認URL」でサイトが正常に表示しない原因

その場合、以下の原因が考えられる。

●hosts
●Wordpressのプライグイン
●PHPのバージョン
●その他

最初に試みるべき方法は「hostsの編集」。

hostsの編集

詳細はConoHa WING「ご利用ガイドhostsを設定してWebサイトの動作確認をする」に記載。

hostsファイルの最下部にConoHa WINGのIPアドレス+移行するサイトのドメインを記述。

（例）111.222.333.444 example.com

サイトが正常に表示したら追加した記述を削除。

ネームサーバーの情報設定

最後にネームサーバーの設定だ。
これはそのドメインがどのサーバーにあるかを設定するもの。
ドメインの管理業者のサイトから行う。
私の場合、お名前.com、Xドメイン、ムームードメイン等を使っている。

Xドメインのネームサーバー変更

Xドメインの場合、XSERVERアカウントから、「ドメインパネル」に進む。
以下は、Xドメインの管理画面。

「その他のサービスで利用する」にチェック。
ネームサーバーの入力欄は5つあるが、2つで構わない。

ConoHa WINGのネームサーバーを入力したら、「ネームサーバーの変更（確認）」をクリック。

ConoHa WINGのネームサーバーはどこに記載？

ConoHa WINGのネームサーバはコントロールパネル左のメニューの「DNS」を開き、ドメインリストからネームサーバーを変更するドメインをクリック。

NS（図の赤い箇所）にネームサーバーを記述されている。

独自SSL設定

上記のネームサーバーの変更で、サイトの移行手続きは終了だ。
後は、独自SSL設定だ。

但し。独自SSL設定はサイトの移行手続き終了後にすぐには出来ない。
ネームサーバーの書き換えに24時間から72時間かかるという。
※これについて詳しくは別記事参照

独自SSL設定はコントロールパネルの左のメニュー「サイト管理」→「セイトセキュリティ」→「独自SSL」→「無料独自SSL」をクリック。

「利用設定」の「OFF」を「ON」にするだけ。

但し、ネームサーバーの切り替えが済む前に「ON」にしようとすると、以下の警告が出て、「ON」にはならない。

15分から30分程、時間を置いて、再度設定の必要がある。
⇒ConoHa WING