静的サイトにWordPressを安全に移行する方法

既に静的サイトがあるサーバーに、wordpressを移行する

既にサーバーのメインディレクトリ上にindex.htmlなどの静的サイトがあるところにwordpressを移行する際に気をつけるポイントをまとめました。index.htmlがある場所にそのままwordpressファイルを全てそのまま移行しても良いのですが、管理やメンテナンス性を考えると好ましくありません。
つまり前提として、既にweb上で公開されている静的サイトを安全にwordpressに移行する ことを目的とした説明になります。

全体の流れ

大きく分けて以下のような手順で移行します。

ルートディレクトリに、サブディレクトリを作りワードプレスファイルを入れる。

作業中に既存の静的サイトにアクセスできなくなるのはよろしくないので、まずはwp(名前は任意)のようなフォルダを作ってそこで作業をします。
wpにLocal環境で構築したファイルをFTPツール等で全て移します。

ダイレクトにURLを打ってwordpressが表示されるか確認

移行したwordpressにURLを直打ちすることで、意図した通りに動くか確認します。
なお、この時点ではまだindex.htmlの静的サイトが表示されているため、普通のお客さんにはwordpressサイトは見れまません。(urlを知ってたら別ですが)
この段階で上手く表示されなかったら、該当箇所を修正していきます。必ず次のステップに行く前に修正してください。

wordpress管理画面から,urlを変更

wordpressの管理画面から、サブディレクトリにあるwordpressのurlをrootディレクトリのurlになるように書き換えます。

index.php と.htaccess ファイルの複製と追加

上記2つのファイルをrootディレクトに配置し、サブディレクトリにリダイレクトさせます。

静的サイトを消す

静的サイトのindex.htmlを削除また別の場所に保存します。この段階で 静的サイト → wordpressサイト に完全移行されたことになります。

それでは一つ一つ見ていきましょう。

手順

ルートディレクトリに、サブディレクトリwpを作る

今回は実際のwebサーバではなくLocal by flwheel 上で再現します。(LocalではサーバーをApachにしておいてください。詳しくはこちら)

まずはrootディレクトリを探してください。index.html がある階層です(実際にはcssフォルダなどもあると思います)。そこにwp(名前は任意)フォルダを作ります。このファイルの中に既にできているwordpress関連ファイルを全て入れます。

安全に移行する方法

ダイレクトにURLを打ってwordpressが表示されるか確認

次に普通にrootディレクトリに対応するページを開いてください。以下の例ではfortest.localとしています。Local の場合はVIEW SITEでひらけば良いです。
index.htmlの内容が開かれることを確認後、そのURLに/wp を付け足します。すると作ったワードプレスの内容が出力されます。

安全に移行する

もし、ワードプレスが表示されない場合はwp/wp-config.phpに以下の2行を追加してください。
URLは適宜自分のサイトに変更してください。

define('WP_SITEURL', 'http://fortest.local/wp');
define('WP_HOME', 'http://fortest.local/wp'); 

なお、wordpressが表示されることを確認したらこの2行は消すかコメントアウトしておいてください。そうでないと、wordpressの管理画面からこれらの値を変更できなくなってしまいます。(次のステップで変更する必要があります)ワードプレスが表示されたら、設定通りにサイトが表示されているか確認してください。投稿などもクリックして正常にリンク先に飛べるかも確認しておきましょう。

wordpress管理画面から,urlを変更

urlに/wp-admin と打って管理画面に入ります。設定→一般からサイトアドレスを変更します。
サイトアドレスのみ、末尾についている /wp を消してください。
なお、wordpressアドレスは,wordpressの設定ファイルなどが入っているパスを指定する必要があります。そのため、ここは変えないでください。

安全に移行_ワードプレスの設定

index.php と.htaccess ファイルの複製,追加

次にindex.phpと.htaccessの設定です。まずはwpフォルダ内に.htaccessがあることを確認してください。隠しファイルですので、下図を参考に表示させてください。

安全に移行ファイル構成

.htaccessの中身を確認し、以下のようになっていることを確認してください。特に2点、RewriteBaseとRewriteRuleに wp が記載されているかを確認しましょう。もし書いてないまたはそもそもファイルがない場合は新しく作って以下のコードを書いてください。

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
RewriteBase /wp/
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /wp/index.php [L]
</IfModule>

次にこの2つのファイル(index.htmlと.htaccess)をrootディレクトリにコピーします。元のファイルはそのまま残しておいてください。このrootに入れた2つを編集していきます。

安全に移行ファイル構成2

まずはindex.phpから最終行の一部にwpを付け足します。以下のコードのように最終行を変更してください.

require __DIR__ . '/wp/wp-blog-header.php';

次に.htaccessです。RewriteRuleの/wpを削除してください。以下のコードになります。
なおRewriteBaseの/wpはワードプレス設定ファイルのパスを入れる必要があるので、そのままにしてください。(消しても一応動きますが、管理画面に入れなくなったりその他挙動が若干おかしくなります)

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
RewriteBase /wp/
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

静的サイト(index.html)を削除または移行

最後は簡単です。単純にrootにあるindex.htmlを削除してください。または、他の場所に移行してください。するとindex.phpが呼び出されるようになってワードプレスが表示されます。これで完全に移行完了です。URLが正常に表示されていることを確認されているかと思います。

お疲れ様でした。

安全に移行fin

まとめ

色々なサイトで調べましたが、断片的に間違ってたりするところがあったので、まとめてみました。
実際の案件で活用できると思いますので、是非参考にしていただけばと思います。

私ごとになりますが、他のサイトでAWSのlightsailを使っています。lightsailは癖が強く、このやり方では上手くいかいないのでその辺りを次回触れたいと思います。