楽にWordPressの開発環境を作る方法3選

みなさんおなじみのWordPress。
インストールから公開までの手順が簡単で、記事作成からデザインの変更まで管理画面から操作できるので、サイトの構造やファイルの細かいことをあまり気にせずかなり時間を短縮できるメリットははかりしれません。

GoogleのMatt Cuttsも推奨（WordPress is a great choice）
していることも有名ですね。
発言が2009年なのでちょっと古いですがその後訂正やマット・カッツさん自身のブログが今もWordPressなので今も変わらずいい選択であることは間違いないでしょう。

設置が簡単で管理画面からもテーマ編集できるし、便利なことは間違いないです。

ただ、管理画面上で編集した場合はエラーがでたりするとデザイン崩れや表示がされないこともあります。
現在はありがたいことに最新バージョンではphpでエラーがあると保存されないような仕様になっています。

それでも細かくチェックしながらの編集や大幅な変更は不安が残ります。

「安心して編集したい！」
「表示崩れやエラーがあっても公開サイトには影響がないようにしたい」
じゃあどうすればいいの？

ということで今回はWordPressの開発環境の構築についての記事です。

大きく分けて3通りの環境が作れます。

XAMPP ・MAMP(ローカル環境)
VCCW（仮想環境のvagrant使用）
wocker(仮想環境のvagrant使用)

XAMPP・MAMPで環境を作る

XAMPP・MAMPはローカル環境にインストールして使うことができるPHP開発環境です。
この方法が一番カンタンです。

ダウンロード先
https://www.apachefriends.org/jp/index.html

ダウンロードした後、インストールを行います。
基本的にデフォルト状態で問題ないと思うのでそのままインストールします。

インストール後は管理画面から操作でき、phpmyadminも使えるのでデータベースもブラウザから管理が可能です。

サイトの設置ディレクトリはxamppの「htdocs」です（MAMPも同じ）

htdocsに任意のフォルダを作り、WordPress一式を設置。

phpmyadminからデータベースを作成。
ブラウザから
http://localhost/先程作成したディレクトリ
にアクセスするとWordpressのインストール画面が表示されると思います。

インストール画面が表示されたら作成したデータベースの情報を入力します。
デフォルトではホスト「localhost」
ユーザー、パスともに「root」
になっているかと思います。

設定が終わればWordpressのインストール完了です。

サイトの編集はローカルから行えるので
テーマを編集する場合は
htdocs/作成したディレクトリ/wp-content/themes/編集したいテーマ/
にあるファイルを編集します。

編集したらブラウザで表示確認してみましょう。

VCCWで環境を作る

VCCWを使う理由は、主に環境による表示などの違いを減らすためになるかと思います。

VCCW公式サイト
http://vccw.cc/
Wordpress開発のためのものなので便利です。
通常のサーバとほぼ同様の環境を作れるのでプラグイン開発にも適しています。

VCCWを使うには2つインストールが必要なものがありますのでインストールします。
またコマンド操作も必要になります。

1. VirtualBoxをインストール

https://www.virtualbox.org/

2. Vagrantをインストール

http://www.vagrantup.com/

任意のディレクトリを作成する

mkdir vccw
cd vccw

以下のプラグイン追加コマンドを実行します。
※windowsはhostファイルの編集権限がないので手動で
hostファイルにvccw.test　192.168.33.10を追加する必要があるようです。

$ vagrant plugin install vagrant-hostsupdater

VCCWを起動する

vagrant up

これで起動ができました。
vccw.testや192.168.33.10にアクセスするとWordpressが表示されます。

え、データベースは？
はい、すでに設定が完了している状態なので初期設定などは必要ないです。

管理画面へのログイン情報
http://vccw.test/admin
Username: admin
Password: admin
でアクセスできます。

wockerで環境を作る

最後にwockerを使った環境構築について説明します。

VCCW同様にVirtualBoxとvagrantが必要です。

VCCWとの違いを簡単に説明すると、wockerは複数のwordpress環境をコマンド1つで作成できます。

wockerの公式サイト
https://wocker.dev/

VirtualBoxとvagrantのインストールをした後、プラグインを追加します。

$ vagrant plugin install vagrant-hostsupdater

wockerをgitでダウンロードします。

git clone https://github.com/wckr/wocker.git && cd wocker

gitがインストールされていない場合は

apt install git
yum install git
//などでインストール可能です。

そして起動します

vagrant up

ブラウザでwocker.testにアクセスするとWordpressが表示されます。

をwockerも初期設定済みの状態です。

管理画面へのログイン情報
http://wocker.test/admin
User:admin
Pass:admin
上記でアクセスできます。

別のWordPressを立ち上げる場合はコマンドで以下を実行します。

//wockerにログイン
vagrant ssh
//起動中のコンテナ停止
wocker stop
//コンテナを新規追加
wocker run --name コンテナ名

最初はコマンド操作になれないと違和感がありますがなれると便利です。

以上が3通りのWordPressの環境構築の説明でした。

まとめ

簡単なのはxampp。
コマンド操作が嫌じゃなければvccwもしくはwocker
プラグインなど作り込みたい場合はVCCW。
複数のWordPressを使いたい場合はwocker。
がおすすめという結論になるかなと思います。

目次