当ブログはWordpressで作成されているのだが、徐々にアクセスも増え始め、オンラインサーバー上でテーマの編集やウィジェットのカスタマイズを行うと、何かバグがあってサーバーがダウンした際のダメージが大きくなってきている。そこでローカル環境でカスタマイズをした（もしくは試した）あとでオンラインのデータに反映させるという方法をとれるようにローカルにWordpressのデータや設定を移行できるようにした。
備忘録という意味合いと同じような設定を行いたい人のために方法をまとめておこうと思う。
目次
1．ローカルに開発環境を整える方法
やりたいこととしては、
1．オンライン上のWordpressの環境をローカルに移行する。
2．ローカルのPCでWordpressを編集する。
3．ちゃんと動作するかPCから試す
4．オンラインに反映させる
ということになる。オンラインへの反映は、最悪ローカルで行ったものと同じ編集をサーバー上で行うのが一番確実かなーとも思うので、ここでは1,2,3ができればよしとする。
とりあえずググってみると、一番手っ取り早い方法は「Instant WordPress」というソフトをPCに導入する方法のようだった。この方法、ウェブ上からソフトを落として最低限の設定をするだけで完了し、インストールの必要すらない。かなり画期的で使い勝手の良いソフトだと思ったのだが、試してみるとどうやら現在のバージョンは不具合がありうまく動作しない模様！
具体的にはソフトを立ち上げWordpressを開こうとボタンを押しても何も反応がない。
というわけで使えない。似たようなアプリケーションに「Local by Flywheel」というソフトもあるようだったが、具体的な方法や細かな設定に関しての情報がなかなか見つからずハードルが高そう。
そこで参考にしたのはこちらのサイト。
XAMMPというソフトを使って仮想サーバーをローカルPCに立て、そのサーバー上にウェブ上のWordpressデータの移行とWordpressのインストールを行うというもの。PHP等の開発用にEclipseの設定まで書かれているが、あって悪いこともないので導入しておいた。ただし、やってみていくつかうまくいかない部分もあったのでまとめよう。
行わなければいけない作業としては下記のようになる。
・ローカルにサーバーを構築する
・ウェブ上のデータベースをエクスポートする
・ローカルのサーバーにデータベースを構築してデータをインポートする
・ウェブ上のWordpress本体をローカルに移行する
・EclipseをダウンロードしてローカルのWordpressと同期させる
2．EclipseとXAMMPのインストール
まずEclipseのサイトに行き、最新のPKGをダウンロードする。
筆者の確認時点の最新版はバージョン4.7 Oxygenだった。
クリックして進むとOS要件ごとのリンクがあるので、PHP編集用で自身のPC環境にあったものをダウンロードする。筆者の場合はWindows 64bit。
ダウンロードしたファイルを解凍するとEclipse本体のほかにXAMMPも入っている。XAMMPはソフトウェアパッケージ群のひとつで、中にApacheというWebサーバーとMySQLというSQLデータベースソフトが入っている。これを動作させることでローカル環境でもWordpressを動かすことができるようになる。
参考サイトではこのXAMMPフォルダ内の「xamppsetup_xampp.bat」を実行することでXAMMPがインストールされ使えるようになると書かれているが、手順通りに進めていくと筆者の環境ではXAMMPが起動しなかった。「xammp-control.exe」からApacheとMySQLを立ち上げようとしても起動しない。エラーメッセージも出ている。
そこでXAMMPは別途単体で落としてきてインストールする。XAMMPのインストールは難しくなくダウンロードサイトからインストーラーを落としてきて実行すればインストールされる。
インストーラーの設定はデフォルトのままで問題ない。インストールしたら動かすためにスタートメニューから「XAMPP Control Panel」もしくはインストールフォルダ内から「xammp-control.exe」を実行する。コントロールパネルが開くのでApacheとMySQLのボタンをクリックすることでサーバーとデータベースが使えるようになる。
XAMMP内のApacheはデフォルトでポート80と443を使用するので、Skypeをするユーザーはポートが競合して動作しないことがある。その場合はSkypeの設定から「設定」→「詳細」→「接続」と進みポート設定内の「上記のポートに変わり、ポート80と443を使用」のチェックを外す。
これでローカル内のWebサーバーとSQLデータベースの土台ができた。
3．ウェブ上のデータベースをローカルに移行する
3-1．ウェブ上のデータベースをエクスポートする
次にウェブサーバー上にある記事や画像といったデータベースをローカル環境へ移行する。これらはWordpress本体とは別のディレクトリに保管されているので、単体で落としてくる必要がある。
まずはphpMyAdminというページに行かなければならない。Xサーバーであればサーバーパネル内にリンクから行けばよいのだが、このリンクはクリックするとユーザー名とパスワードを求められる。
現在何が設定されているか確認しなければならないのだが、これらの情報はWordpressインストールフォルダにあるwp-config.phpに記載されている。そのため、まずFTPサーバーを使用してこのファイルを落としてくる。
XサーバーからFTPへログインして[サイト名のディレクトリ]→[public_html]と進みwp-config.phpを落とし、テキストエディタで開く。ユーザー名とパスワードが記載されているのでこれらを入力するとphpMyAdminへログインできる。
ログインしたら上のエクスポートタブからデータベースをエクスポートする。
エクスポートの出力フォーマットがSQLになっている部分を確実に確認したら後の設定はデフォルトでよいだろう。データはローカルのどこに保存しても良い。
3-2．エクスポートしたデータの一部を書き換える
データをダウンロードしたら一部分をローカル用に書き換える必要がある。具体的には内部にあるウェブサイトのドメイン情報をローカル環境用に書き換える。
筆者のサイトのドメインは「hasenora.com」だがその部分をすべて「localhost/hasenora.com」に書き換える。落としてきたデータベースの内容によっては「www.hasenora.com」があるため、まずは「www.hasenora.com」を検索して「hasenora.com」に変えたあと「hasenora.com」を「localhost/hasenora.com」に変える。
具体的な方法だが、落としてきたSQLをサクラエディタやSublime Textなどの高機能テキストエディタで開く。置換機能があるので、まず
置換前の部分に「www.hasenora.com」
置換後の部分に「hasenora.com」
次に
置換前の部分に「hasenora.com」
置換後の部分に「localhost/hasenora.com」
と入力してすべて置き換える。
3-3．ローカル環境に新しいデータベースを作成する
SQLの準備ができたら、それらを使ってローカル環境にデータベースを構築する。
まずはXAMMP control panelからapacheとMySQLが起動しているのを確認する。
ウェブブラウザを開きアドレスに「http://localhost/phpmyadmin/」と入力するとローカル上のphpMyAdminが開ける。
データベースタブをクリックして飛んだ画面に「データベースを作成する」という部分があるので名前を入れて作成ボタンを押す。名前はなんでもよいのだがウェブ環境と同じ「hasenora_wp1」とした。
作成できたらデータベースタブに戻り、「Check privileges」から権限のあるユーザーを新しく追加する。
「Check privileges」→「Add user account」と進み
User name : root
Host name : localhost
パスワード : （任意のパスワード）もしくは無し
Re-type : （同じパスワードを再入力）
グローバル特権 : Check Allにチェック
として新規ユーザーを作成、権限を付与する。
ここまでできたら、作成したデータベースにウェブから落としてきたデータをインポートする。
左のリストから作成したデータベースをクリックしてからインポートタブをクリックする。
アップロードファイルの部分に落として一部編集したSQLファイルを入れ、フォーマット部分がSQLになっていることを確認したらインポート。もしも「データベースが選択されていません」というエラーが出たら、左のリストで作成した空のデータベースが選択されていないのでクリックしてからもう一度試す。
これで、データベースの作成は完了となる。
4．ウェブ上のWordpress本体をローカルに落としてくる
次にウェブ上のWordpress本体をローカルに落とす。ここには編集済みのテーマの情報などが入っている。レンタルサーバー内の対象のフォルダをコピー（ダウンロード）してローカルの対象の場所に置くのだが、SFTPソフトが必要になる。XサーバーのFTP昨日はファイルのダウンロードは可能だがフォルダごと落としてくる機能がない。
FFFTPなど有名なソフトはたくさんあるのだが、筆者が入れたのはWinSCPというソフト。
こちらのサイトからダウンロードできる。ダウンロードしたらインストーラに従ってインストールする。
設定方法はこちらのサイトに非常に詳しく書かれている。
インストール、接続ができたら、Wordpressが保存されているpublic_htmlのフォルダごとローカルにダウンロードする。
サイズが大きいのでかなり時間がかかるだろう。
完了したら、落としてきたフォルダ内の一部のファイルをローカル環境用に書き換える。
書き換えるのは
wp-config.php
.htaccess
の2つのファイル。
まずwp-config.phpをテキストエディタで開く。変更する箇所はユーザー情報の部分である。
データベース名：（先ほど作成したデータベース名）
ユーザー名：（先ほど作成したユーザー名）
パスワード：（先ほど作成したパスワード）
ホスト名：localhost
書き換えたら上書きする。
.htaccessのファイルのほうにはレンタルサーバーのコンフィグ機能をWordpressと結びつけるための記述が書かれている。ローカルのXAMMPにはそうした機能がないので、エラーとなってしまうことがある。
最低限必要なのは「# BEGIN WordPress」から「# END WordPress」なので、ここ以外の部分は削除しておく。ただし、入れているプラグインによっては.htaccessにコードを追記している場合があるので、どれがプラグインからの追記か分かるという人はその部分は残した方が良い。
また、コード内の「. /index.php [L]」は「. /（公開ディレクトリ名）/index.php [L]」に書き換える。これをしないとXAMMPのデフォルトの参照ディレクトリが/xammp/htdocsなので画面遷移時に/xammp/htdocs/index.phpを読みに行ってしまう。
筆者はウェブ環境と同様、公開ディレクトリ名は「hasenora.com」とした。
書き換え作業が終わったら「public_html」フォルダの名称を公開ディレクトリ名（hasenora.com）に変えて適切なフォルダに置く。対象フォルダはXAMMPのインストールフォルダ内xammp/htdocs/である。
これで、設定は終了。ローカルのWordpressにログインする際はブラウザから「localhost/（公開ディレクトリ名）/wp-login.php」と入力する。
5．Eclipseの設定
以上でWordpressのローカルへの移行は完了なのだがphp編集のためにEclipseと連動させる。
やり方はそれほど難しくない。まず、EclipseのワークスペースはXAMMP内のhtdocsフォルダにする。「ファイル」→「新規」→「PHPプロジェクト」で新規のプロジェクトを作成、プロジェクト名を公開ディレクトリ名と同様の名前にするとhtdocs内の公開ディレクトリが自動的に読み込まれEclipse内に表示される。
ここから編集していけばよいわけである。実行するとブラウザが開きローカル上でサイトが表示される。
6．まとめ
以上でローカル環境でWordpressが使用できるようになる。テーマを編集するときなどはローカルで試した後にウェブ上にも変更を入れるようにした方がリスクは少ない。かなり手順が多いが、一度やっておくとWordpressやサーバーの構成にも詳しくなるので良いだろう。