以前にローカルマシーンにXAMPPをインストールしてローカル開発環境を構築する方法を記事にしました。今回はXAMPPで構築したローカル開発環境にWordPressをインストールする方法を扱いたいと思います。

※ この記事はmacOSが対象です。またXAMPPは「loaclhost」が使えるバージョン5.6.xの環境を前提として進めます。XAMPP(バージョン5.6.x)のmacOSへのインストール方法は過去のこちらの記事で扱っています。

スポンサーリンク




目次

  1. WordPressのダウンロード
  2. XAMPPのDocumentRootの変更
  3. WordPressのインストール
    1. wp-config.php の設定
    2. XAMPPの各サービスを起動
    3. phpMyAdminでDBを作成
    4. WordPressで必要情報を入力
  4. まとめ

1. WordPressのダウンロード

まずは、WordPressをダウンロードしましょう。
https://ja.wordpress.org/download/

ダウンロードしたら、ひとまずデスクトップ上に解凍しておきます。

※記事執筆時点は「wordpress-5.0.3-ja.zip」

2. XAMPPのDocumentRootの変更

XAMPPを起動して全てのサービスがストップしていることを確認してください。その後「Manage Servers」タブに切り替え「Apache Web Server」が選択された状態で「Configure」ボタンをクリックします。

次に、開いた小さいウィンドウ内の「Open Conf File」ボタンをクリックするとこのような画面になります。アラートウィンドウの「OK」をクリックしてください。

すると、メモで「httpd.conf」が開きますので「⌘ + Fキー」で検索バーを表示させ「DocumentRoot」を検索します。ちなみに「DocumentRoot」とは、サイトのhtml関連ファイルやphpファイル等を格納するディレクトリのことです。

該当箇所が見つかったら、適宜自分の好みの場所に設定しましょう。デフォルトの設定を残しておきたい場合は、行頭に「#」をつけてコメントアウトしておきます。

例えば…「/Users/(ユーザ名)/XAMPP/wordpress」などとします。設定が完了したら「⌘ + Sキー」で保存して、開いたウィンドウを閉じてください。

「httpd.conf」に設定したディレクトリには、実際にフォルダを作っておきます。

この時、一つ注意点があるのですが「httpd.conf」に設定したディレクトリのパーミッションが「755」になっている必要があるので、ターミナルで確認しておきましょう。

$ ls -alF /Users/(ユーザ名)/XAMPP/

もし755でなければ、chmodコマンドでパーミッションを変更しておきましょう。

$ chmod 755 /Users/(ユーザ名)/XAMPP/wordpress

3. WordPressのインストール

3-1. wp-config.php の設定

今度はいよいよ、WordPressのインストールです。先ほどデスクトップに解凍しておいたWordPressフォルダ内の全てのファイルを「httpd.conf」に設定したディレクトリに移動もしくは複製しておきます。

ファイルの準備ができたら、今度は、いよいよWordPressの設定をします。

「/Users/(ユーザ名)/XAMPP/wordpress/wp-config-sample.php」このファイルを複製して…

「/Users/(ユーザ名)/XAMPP/wordpress/wp-config.php」のように「-sample」を削除しておきます。

「wp-config.php」ファイルをテキストエディタで開き、下記の箇所の設定を変更します。

27〜38行目:

// ** MySQL 設定 - この情報はホスティング先から入手してください。 ** //
/** WordPress のためのデータベース名 */
define('DB_NAME', 'my_wp01_db');

/** MySQL データベースのユーザー名 */
define('DB_USER', 'my_wp01_db');

/** MySQL データベースのパスワード */
define('DB_PASSWORD', '任意のパスワード');

/** MySQL のホスト名 */
define('DB_HOST', 'localhost');

「DB_NAME」と「DB_USER」は基本的に同じにます。また「DB_PASSWORD」に任意のパスワードを設定してください。その他はそのままにします。

最低限の設定は以上ですが、localhostにWordPressを複数インストールしたい場合は、データベーステーブルの接頭辞の設定を適宜変更しておくとよいでしょう。

72行目:

$table_prefix  = 'wp01_';

※ 上記ではデフォルトの「wp_」を「wp01_」と変更しました。

上記の設定が完了したら保存して、テキストエディタを終了します。

3-2. XAMPPの各サービスを起動

ここまでできたら、XAMPPの各サービスを起動します。「Manage Servers」タブに切り替え「Start All」ボタンをクリックします。

3-3. phpMyAdminでDBを作成

ランプが全てグリーンになったら、ブラウザを起動して「phpMyAdmin」にアクセスしてデータベースを作成します。
http://localhost/phpmyadmin/

「phpMyAdmin」にアクセスできたら、今度は「User accounts」をクリックし下記のような画面してください。

上記の画面になったら「Add user account」をクリックします。

下記のように設定してください。

「User name」…「my_wp01_db」
「Host name」…「localhost」
「パスワード」…先ほど「wp-config.php」で設定したもの
「同名のデータベースを作成してすべての特権を与える。」…チェック
「ワイルドカード(ユーザ名_%)に該当するデータベースにすべての特権を与える。」…チェック
「グローバル特権」の「Check all」…チェック

最後に画面右下の「実行」をクリックします。これで、データベースが作成されました!

3-4. WordPressで必要情報を入力

ここまでできたら、今度は、WordPressの設定画面にアクセスして、インストールの仕上げをします。
http://localhost/

各項目に任意の内容を入力します。

「サイトのタイトル」…任意のものを入力
「ユーザー名」…任意のものを入力
「パスワード」…任意のものを入力
「メールアドレス」…任意のものを入力

ちなみに、これらの内容はインストール後もダッシュボードと呼ばれる管理画面から全て変更可能です。

入力が完了したら「WordPressをインストール」をクリックします。インストール後の画面から「ログイン」して以下のような画面に変わったら、インストール完了です!

ちなみにこの画面はダッシュボードと呼ばれる管理画面のトップページです。

画面左上に先ほど設定した「サイトのタイトル」が表示されていると思いますが、そこをクリックするとWordPressの表側の画面が表示されます。

これで、WordPressのインストールが完了しました!

4. まとめ

XAMPPはサーバーやインフラ周りに詳しくないデザイナーでも比較的簡単に開発環境を構築できる優れたツールです。

ローカルマシーン上でPHPを使ってプログラミングしたり、WordPressをベースにした開発をしたりできるのでよく活用しています。今回はWordPressをインストールしてみましたが、一度やってしまえば非常に簡単です。