WordPressをローカル環境に構築しました。作業としては、必要なモジュールのインストール（Webサーバー、データベースおよびPHP）とWordpressデータのコピーが必要となります。。
忘れないよう備忘録としてまとめておきます。尚、トラブルにより解決に時間がかかったこともあるので、そういったところも残して置きます。
今回の記事の背景
この記事はWordpressを使っていて、サーバーはGCPを使っています。
最初は本番の環境のみで作業をしていたのですが、記事を書き進めたりWordpressテーマをカスタマイズするにつれて連れて以下の問題点がでてきました。
- 書いた記事のスマホやタブレットでの見栄え（改行箇所とか文字の大きさとか）を簡単にチェックしたかった。（スマホで本番環境にわざわざログインするのが面倒・・・）
- WordPressのカスタマイズ等、トライ＆エラーでのトライが必要な場合、本番環境では試しにくい。
ということで、自分のローカル環境にWordpress環境を構築して、ローカルのWi-Fiネットワーク環境で記事を公開すれば上記の問題は解決できると思い至ったのが、Wordpressをローカル環境に構築しようとした背景です。
また近い将来、環境を入れ替える際などに迷わないよう、自分自身への備忘録でもあります。
環境
Ubuntu16.04LTS
WordPress環境の立ち上げ
WordPressを立ち上げるには、以下３つが必要です。
（１）Webサーバー（apache, Nginx, IISなど）
（２）データベース（MySQLなど）
（３）PHP
XAMPとかLAMPとか便利そうなツールがありますが、勉強も必要なので！ということで、全部個別にインストールしてみました。
Webサーバーのインストール
Apacheをインストールしました。理由は、単純に本番環境で使っているWordpressがこれを使っていたからです。Terminalから下記コマンドでインストールできます。
$ sudo apt updata
$ sudo apt install apache2インストール後にいくつか設定項目があったり、トラブった点などありました。
こちらの記事でもう少し詳しくまとめています。
データベースのインストール
データベースはMySQLをインストールしました。これも本番環境に合わせました。
やり方は基本的に公式サイトのとおりで、以下コマンドでインストールします。dpkgコマンドの最後の引数は上記でダウンロードしたファイル名になりますので適宜変更してください。
今回は、”mysql-apt-config_0.8.10-1_all.deb”でした。
~$ sudo dpkg -i mysql-apt-config_0.8.10-1_all.deb
~$ sudo apt update
~$ sudo apt install mysql-serverインストール時に発生した問題とその解決方法も併せて以下でまとめています。
PHPのインストール
WordPressはPHPで書かれているので、これは必須ですね。基本的に以下のコマンドでインストールできます。
$ sudo apt -y install php php-cgi libapache2-mod-php php-common php-pear php-mbstring詳細は以下の記事でもまとめています。上記同様にインストール時に発生した問題とその解決方法も記載しています。
WordPressデータのコピー
必要なモジュール類のインストールが完了したら、次はWordpressのデータをローカル環境にコピーします。
Wordpressのデータには、WordPressサイトのファイルとデータベースの2つがあります。
# 公式リファレンスにもデータのバックアップの取り方が載っています。
WordPressファイルのコピー
WordPressのファイルが入っているフォルダの中身をまるまるローカルにコピーすればOKです。
筆者の場合は、下記の通り/var/www/html/learn_prog/配下のファイルを全てローカル環境へコピーしました。
/var/www/html/learn_prog
├── index.php
├── license.txt
├── wp-config.php
├── wp-content
├── wp-includes
:
:
├── wp-settings.php
├── wp-signup.php
├── wp-trackback.php
└── xmlrpc.phpデータベースのコピー
phpMyAdminを使って、本番環境のデータベースをローカル環境へコピーします。
尚、この作業においては、ローカル環境でのサイトのURLが本番環境から変わるので、データに少し手を入れる必要がありますので、それについても以下に触れておきます。
①本番環境のデータベースのエクスポート
本番環境のphpMyAdminにログインし、Wordpressのデータベースをエクスポートしてsqlファイルを取得します。
(1)Wordpressのデータベースを選択後、「エクスポート」をクリックし、必要に応じて「詳細」を選択。
(2)データフォーマットは「SQL」を選択
最後に、一番下に「実行」ボタンが表示されるので、それをクリックしたらバックアップファイルがダウンロードされます。
wordpress公式リファレンスにも記載があるのでこちらも参考にします。
②データベースに記載されている本番環境のURLをローカル環境のURLに修正
エクスポートしたsqlファイルをエディタで開き、中に記述されている本番環境のURLをローカル環境のURLに変更します。
例えば筆者の場合は、https://hibiki-press.tech/を、http://localhost/wordpress/に置き換えました。
③修正したデータベースをローカル環境にインポート
ローカル環境のphpMyAdminにログインし、今回構築するWordpress向けに新しいデータベースを作成します。（「データベース」タブ → データベースの作成）
②で修正したsqlファイルを、上記データベースにインポートします。
WordPress公式リファレンスの「データベースの復元」にも記載があるので、こちらも参考にします。
ローカル環境のwp-config.phpを修正する
ローカル環境のwp-config.phpをエディタで開き、以下の箇所を修正します。
（21行目付近だと思います）
// ** MySQL settings - You can get this info from your web host ** //
/** The name of the database for WordPress */
define('DB_NAME', 'wordpress_on_local'); ★ローカル環境のデータベース名
/** MySQL database username */
define('DB_USER', 'root'); ★ローカル環境のmySQLのログイン名
/** MySQL database password */
define('DB_PASSWORD', 'password'); ★ローカル環境のmySQLのパスワード
/** MySQL hostname */
define('DB_HOST', 'localhost'); ★ローカル環境のホスト名
/** Database Charset to use in creating database tables. */
define('DB_CHARSET', 'utf8'); ★ここは変えないここまでが、Wordpressをローカル環境にコピーする大まかな手順です。今の状態でローカル環境に構築したWordpressへログインができる状態になっているはずですが・・・
実際には色々な問題がおきました。以下は、筆者が作業した際に発生したトラブルと解決方法を記載します。
作業をしている時に問題となった点と解決方法
レベルのかなり低いものまで有りますが、それらも残しておきます。
wp-login.phpを開こうとしたら「該当ページがありません」というメッセージが出てログインできない。
原因は、本番環境でセキュリティのためログイン画面URLをプラグインを使って変えていた為でした。
phpMyAdminを開いてデータベースから本番環境で設定していたログイン画面のURLを検索して削除したところ、無事ログイン画面がでてきました。
ただ、よく考えると、プラグインの状態まで含めて環境をコピーしてあるので、本番の環境で設定していたログインURLをそのまま指定すればよかったという話ですね。
色々なサイトで調べた上で作業を進めたのですが、自分の環境との違いをよく把握しないままサイトの通り実行してしまったために起きたいい例だと思います。
トップページ以外のページが404 NotFoundになってしまう
「ダッシュボード」ー「設定」ー「パーマリング設定」画面にて必要事項を設定した後、「設定の保存」を押下することで表示されました。
ちゃんと保存ボタンを押そう・・・
プラグインのアップデートができない
(1) wp-config.phpに下記の記述を追加
define('FS_METHOD', 'direct');この記述をすることによってファイルをダウンロードするときに強制的にダイレクトメソッドを選択させるようにするようです。
(2) フォルダのパーミッションを設定
wordpressの以下のフォルダのパーミッションを755かそれ以上に上げます
/wp-content/upgrade
/wp-content/themes
/wp-content/plugins
/wp-content/uploadsパーミッションの変更はTerminalから下記コマンドでできます。
chmod 755 フォルダ名
(3) フォルダの所有者の確認
WordPressが格納されているフォルダの所有権をApacheの所有者と合わせる。
Apacheの所有者は、ファイル: etc/apache2/envvarsの以下の箇所で確認可能。
(16〜17行目付近)
export APACHE_RUN_USER=www-data
export APACHE_RUN_GROUP=www-data所有者の変更は、下記コマンドで出来ます。”wordpress”の箇所は、Wordpressが格納されているフォルダ名ですので適宜変更が必要です。
$ sudo chown -R www-data:www-data wordpress筆者はこれでうまくできました。
ローカルネットワーク内のスマホからアクセスした際にCSSが反映されない
以下コードをwp-config.phpへ追加すると、表示されるようになりました。
ここで’/wordpress’は、Wordpressが格納してあるフォルダ名に適宜変更が必要です。
/* サイトURLを動的に設定 */
define('WP_SITEURL', 'http://' . $_SERVER['HTTP_HOST'] . '/wordpress');
define('WP_HOME', 'http://' . $_SERVER['HTTP_HOST'] . '/wordpress');まとめ
長くなりましたが、今回は、Wordpressをローカル環境にコピーする作業について、各種パッケージ類のインストールとWordpressデータのコピー方法をまとめました。また、筆者がこの作業をする際にトラブルになった内容と解決した方法と併せて記載しました。同じトラブルで悩んでいる人の助けになれば幸いです。
