Unformed Building

XAMPP + PhpStorm + WordPressの設定メモ

公開:

パーマリンク

毎回設定方法を忘れて検索するのがつらいのでメモしておきます。

  • C:\Develop以下で構成。
  • XAMPPのドキュメントルートはそのまま、実際に使うのはC:\Develop\www以下にディレクトリ作る。
  • WordPressのルートはC:\Develop\www\wpにする。
  • MySQLのdataもXAMPPとは別ディレクトリのC:\Develop\mysqlに。
  • WordPressのURLはwp.localhostにする。

バーチャルホストの設定とか

今回はC:\Develop\xamppにインストールする。
インストールが終わったらphp.iniの設定。

mbstring.language = Japanese
date.timezone=Asia/Tokyo

とりあえずこれだけやって、他は本番用サーバーにあわせる。

参考リンク:
php.iniファイルの確認と修正 - XAMPPの使い方

ApacheとMySQL起動して、ちゃんとインストールできていたらセキュリティ設定して一旦終了させる。
次はバーチャルホストの設定。

C:\Develop\xampp\apache\conf\extra\httpd-vhosts.confを開く。
一番最後に次を加える。

NameVirtualHost *:80

<VirtualHost *:80>
  DocumentRoot "C:/Develop/xampp/htdocs"
  ServerName localhost
</VirtualHost>

<VirtualHost *:80>
  DocumentRoot "C:/Develop/www/wp"
  ServerName wp.localhost
  <Directory "C:/Develop/www/wp">
    Order allow,deny
    Allow from all
    Require all granted
  </Directory>
</VirtualHost>

C:\Windows\System32\drivers\etc\hostsを開く。
最後に次を加える。

127.0.0.1 localhost
127.0.0.1 wp.localhost

C:\Develop\www\wp<?php phpinfo() ?>だけを書いたindex.phpを置いて、Apacheを起動したらhttp://wp.localhostにアクセスしてちゃんと表示されるか確認。

参考リンク:
XAMPPのVirtualhostで複数のサイトを管理する方法(403対策あり) | ケーキ・先生・アドセンス

phpMyAdmin のログイン時間を変更

初期状態だと短いので変更する。

C:\Develop\xampp\phpMyAdmin\config.inc.phpを開く。
最後に次を追加。

ini_set(
  'session.gc_maxlifetime',
  ($cfg['LoginCookieValidity'] = (3600 * 8))
);

参考リンク:
phpMyAdminの自動ログアウト時間を延長する。 | 篠原隆司のブログ

MySQL Dataを移動

C:\Develop\xampp\mysqlにあるdataディレクトリをC:\Develop\mysqlに移動。

C:\Develop\xampp\mysql\bin\my.iniを開く。
C:/Develop/xampp/mysql/dataになっている箇所をC:/Develop/mysql/dataに変更。
必要ならログファイルのパスも変更する。

MySQLを起動してちゃんと動いているか確認。

参考リンク:
初心者がWEB開発に挑戦 MySQLのデータディレクトリの変更方法(XAMPP)

WordPressのインストール

WordPress用のデータベースwp_testを作成。
C:\Develop\www\wpに WordPressを置いたらインストール。
http://wp.localhostにブラウザでアクセスして表示されたらOK。

PhpStormの設定

プロジェクト作成。
PhpStormを起動して、ツールバーの「Open Directory」からC:\Develop\www\wpを指定。
wp-config.phpを触らないなら、C:\Develop\www\wp\wp-contentを指定するといい。その際、次の段落の手順は飛ばす)

Settings → Project Settings → Derectoriesへ。
Content Rootを一旦削除し、Add Content RootでC:\Develop\www\wp\wp-contentを指定。

XAMPPとの連携。
Settings → Project Settings → PHPへ。
Interpreterボタンをクリックして、Interpretersウィンドウが開いたらAddをクリック。
名前は何でもいいので「XAMPP PHP」とでもつけておく。
パスはC:\Develop\xampp\phpにする。
OKをクリック。
Include pathにC:\Develop\www\wp\wp-adminC:\Develop\www\wp\wp-includesを追加。

使わないと思うけど、一応Deploymentの設定もしておく。
Settings → Project Settings → Deploymentへ。
Addをクリック。
名前は何でもいいので「WordPress Test」とか。
TypeはLocal or mounted folderを選択。
Upload/donwload project filesはC:\Develop\www\wpを指定。
Browse files on serverはバーチャルホストで設定したhttp://wp.localhostを指定。

次はデータベースとの接続。
エディタ画面に戻って、ツールバー → View → Tool Windows → Databaseへ。
New → Data Srourceをクリック。
名前は何でもいい。
Databaseタブ → JDBC driver files → MySQL Connectorを選択。
ダウンロード先はどこでもいい。ダウンロード済みなら、JDBC driver filesにそのパスを指定する。
Database URLはjdbc:mysql://localhost:3306/を記入。
ユーザー名とパスワードはXAMPPで設定したデータベースのアカウント。
IDEからの書き換えを禁止するならRead-onlyにもチェック。
左下のTest Connectionをクリックして接続テスト。
Schemas & Tablesタブ → WordPressで使うものだけにだけScan for TablesとMake Defaultにチェック。

参考リンク:
Installing and Configuring XAMPP with PhpStorm IDE - PhpStorm - Confluence

簡単なテーマ作成用なので、たぶん足りないものいっぱいあります。あと間違っていたらすみません。
Xdebugの導入とかは自信ないので検索してください……。