XAMPPでWordPressローカル環境・PHPのテスト環境を整える手順とフォルダの場所についてのメモ

photo credit: ryancboren via photopin cc
photo credit: ryancboren via photopin cc
Update Web制作メモ >

先日、ローカルでWordPressを使うために「Instant WordPress」でローカル環境を構築したのですが、今回はXAMPPを使い、もう少ししっかりとPHPの学習ができる環境を整えてみました。

インストール自体は難しくありませんでしたが、フォルダを作る場所と、ファイルにアクセスするためのURLがわからずちょっと悩んでしまいましたので、そのあたりも含めて手順のメモを残します。

Windows7を使用、XAMPPのバージョンは1.8.1、WordPressのバージョンは3.5.1です。

XAMPPをインストール

XAMPP for Windowsへアクセスします。

01 xampp for windows 400x256

XAMPPをクリックします。

02 xampp for windows download 400x78

インストーラーをクリック。

03 xampp for windows download installer 400x166 04 xampp for windows install 359x300

何も変更しなければ、C直下にインストールされます。

05 xampp for windows installation folder 356x300

インストールが完了すると、XAMPPのコントロールパネルが開きますので、ApacheMySQLのスタートボタンを押します。

06 xampp control panel 600x389

XAMPPの管理画面で初期設定

XAMPPの管理画面http://localhost/xampp/splash.php)を開きます。最初のページのスクリーンショットをとり忘れてしまいましたが、「日本語」を選ぶとこのような画面が表示されます。

07 xampp for windows welcome 600x334

「要注意」と表示されている項目について、セキュリティの設定を行っていきます。画面下のアドレスをクリック。

08 xampp security 600x270

WordPressで使うMySQL(データベース)のrootアカウントに好きなパスワードを設定します。入力したら「パスワードを変更しました」をクリック。

さらに、これから使っていくローカルサーバへアクセスするためのユーザー名とパスワードを設定します。例としてadminと入力していますが、なんでもいいです。

09 xampp password

PHPMyAdminにアクセス

次に、WordPressで使うデータベースを作成します。データーベースを管理するPHPMyAdminにアクセスし、ログインします。

ユーザー名はroot、パスワードは先ほど設定したMySQLのパスワードです。

10 phpmyadmin toppage

新しいユーザーを追加します。上の「ユーザー」タブをクリック。

11 phpmyadmin dashboard 600x333

「ユーザーを追加する」をクリック。

12 phpmyadmin add user

好きなユーザー名とパスワードを設定します。真ん中のホストという項目は「ローカル」を選びます。それから、下の「同名のデータベースを作成してすべての特権を与える」を選択。

13 phpmyadmin add user 2 600x452

これでMySQLの新しいユーザーとデータベースが作成できました。

WordPressをインストール

WordPressをサーバーに手動でインストールしたことのある方にはおなじみの手順です。

WordPress日本語ページヘアクセスし、最新のWordPressをダウンロードします。

14 wordpress download page 600x360

ダウンロードしたZipファイルを解凍してできたwordpressフォルダを、xamppフォルダ内にもともと作られているhtdocsフォルダの中に入れます。

15 xampp htdocs wordpress1

http://localhost/wordpress/にアクセスします。すると「wp-config.phpファイルが見つかりません」という注意が表示されますので、これを作成するために下のボタンをクリックします。

16 no wp config 600x192

なお、wordpressフォルダ内のwp-config-sample.phpファイルを自分で書き換えてwp-config.phpを作成しても良いです。Codexの参考ページを載せておきます。

続けて下のボタンをクリックします。

17 no wp config 2 600x398

先ほど、MySQLの新しいユーザーを追加しました。そのユーザー名とパスワードを入力します。またその際に「同名のデータベースを作成してすべての特権を与える」にチェックを入れましたので、データベース名もユーザー名と同じものです。

18 no wp config 3 600x429

インストール実行ボタンをクリック。

19 no wp config 4 600x180

無事にインストールできました!サイトのタイトルや、WordPressのユーザー名・パスワードを好きなように設定して完了です。

20 welcome to wordpress page 600x516

ローカルのWordPressにログインするときのURL

今後、このローカルにインストールしたWordPressへログインするときには、http://localhost/wordpress/wp-login.phpへアクセスします。

PHPを学習するためのテスト環境も構築

htdocsフォルダ内に入れたPHPファイルは、ブラウザからアクセスすることができるようになります。もちろん、htdocs直下にファイルを置かずにフォルダを作っても大丈夫でした。

そこで、ちょっとPHPの動作を確認したり、復習に使用したりするためのテストフォルダをひとつ作りました。

WordPressフォルダと同じ場所、xamppフォルダ内のhtdocsフォルダの中に、適当な名前でフォルダを作ります。

folder in htdocs 21

ブラウザで確認したいPHPファイルを、作ったフォルダの中に入れます。

folder in htdocs1

ファイルにアクセスするときのURL

ちょっと悩んでしまったのですが、先ほどのWordPressと同様、htdocsという文字はURLに含まないのでした。htdocs内のフォルダ(test)に入れたPHPファイルにアクセスするときのURLは

http://localhost/フォルダ名/ファイル名

になりますので、上のファイルの場合はhttp://localhost/test/index.phpとなります。