インストールした Eclipse PDT に「Eclipse PDT + XAMPP で WordPress の開発環境をつくる (1)」でインストールした WordPress ファイルをプロジェクトとして取り込んでみます。

Eclipse ではファイルの集合をプロジェクトとして扱い、複数のプロジェクトを管理することができます。 ここでは、先にインストールした WordPress をそのプロジェクトのひとつとして管理対象に加える操作を行います。（たとえば異なるバージョンの WordPress を各プロジェクトとして管理できます）

ファイルメニューから、新規-> PHP Project を選択します。

プロジェクト名を wordpress-27x に、Content 欄のラジオボタンを「Create project from exsisting source」とし、以下の WordPress をインストールしたディレクトリを指定します。

   1: C:\Develop\xampp-win32-1.7.0\htdocs\wordpress-27x

この操作で、既存の PHP ファイルをプロジェクト管理下とすることができ、またファイルの修正も直接そのディレクトリに対して行われます。 このディレクトリは Apache からも閲覧していますので、Eclipse PDT からの修正をブラウザからのアクセスに反映させることができます。

設定できたら終了ボタンを押下します。

左ツリーに、インストールした WordPress が展開されます。 また .php ファイルクリックでエディタが立ち上がり .php ファイルの修正が行えることが確認できます。

テキストエディタは一般的なそれの操作とほとんど変わりません。

たとえば、wp-content/themes/default 配下のデフォルトテーマなどを修正し、ブラウザで以下の URL にアクセスして画面が更新されるのを確認してみましょう。

   1: http://127.0.0.1/wordpress-27x/

Eclipse PDT のプロジェクトと、Apache からみえるドキュメントが一致していることが分かります。

Eclipse PDT の機能

ここからは通常のテキストエディタにない統合環境特有の編集機能をみていきます。 難しい操作はありませんので、ぜひ手になじませてください。

リアルタイムエラー申告

Eclipse PDT は編集中の PHP/HTML/JavaScript 等の構文をリアルタイムに監視し、それにエラーがあれば Problems ビュー（画面下部）に申告してくれます。

標準状態ではプロジェクト全体のエラー申告が表示され、少々使いづらいためフィルターを設定して、編集中のファイルだけにしぼると良いでしょう。

Problems ビュー の右に配置されたドロップダウンから選択上の警告を選択します。

また同じドロップダウンの「内容の構成」からチェックするエラーも選択することができます。（重大度にエラーと警告が含まれることを確認してください）

タイプ部分で表示するエラーを選択できます。 HTML の監視に関しては、PHP からの include によるファイルをまたぐタグ整合までは監視できませんのでチェックをはずしたほうが良いかもしれません。（WordPress プロジェクトでエラーが多く申告されるのはこのためです）

では実際にテーマファイルを修正してエラー申告の確認をしてみましょう。 たとえば以下のファイルを修正してみます。

   1: wp-content/themes/default/single.php

このファイルで以下の部分でタグを表示している箇所があります。

   1: <?php the_tags( '<p>' . __('Tags:', 'kubrick') . ' ', ', ', '</p>'); ?>

少々複雑です。 開始タグ指定 <p> へスタイルを適応しようと過って引数に HTML のシングルコーテーションを入れてしまったとします。

   1: <?php the_tags( '<p style='hoge'>' . __('Tags:', 'kubrick') . ' ', ', ', '</p>'); ?>

Eclipse PDT はこの修正直後に以下のように画面で警告を発生します。

一般的には修正後ブラウザ閲覧を行い そこに表示されたPHP エラーの表示をみて気がつく問題ですが、統合環境を用いると未然にこのようなケアレスミスをみつけることができます。

入力補完機能

Eclipse PDT はエディタ上の編集位置を認識し、PHP や JavaScript の関数や HTML のタグなどを補完入力することができます。 たとえば、テーマファイル修正でテンプレートタグ(PHP の関数）を入力するには以下の操作で行うと便利でしょう。

まず入力エリアが <?php ?> の間であることを確認します。 この場所では Eclipse PDT は PHP の関数について補完を試みます。 たとえば、WordPress には the_ ではじまるテンプレートタグがたくさんあります。

テキストエディタ上で、the_ まで入力して CTRL + SPACE キー操作（補完指示）を行います。

このようにプロジェクトに存在する関数を一覧表示し、カーソルキーで選択可能な状態になります。 また、PHP の関数が PHPDoc 形式でかかれている場合は、それをホバー表示し関数に対する引数が分かるようになります。(現在 WordPress の多くの関数は PHPDoc 化されています）

テーマ作成時のテンプレートタグの入力や、プラグイン作成時の関数入力で大きな力を発揮してくれる機能です。 テキスト入力位置によって適切に、HTML タグ補完、JavaScript 補完などモードが切り替わりますので、このことを少し意識して使うと便利です。

関数定義位置へのジャンプ

Eclipse PDT では関数上や requre ファイル位置でで F3 キーを押下することで、その関数の定義位置に直接ジャンプすることができます。 テンプレートタグの動作を知るときや、プログラムの動作を追う場合に有効です。

たとえば、テーマファイル中の wp_link_pages テンプレートタグの上で F3 キーを押下してみます。

このように、関数定義位置にファイルをまたいでカーソルがとびます。

テンプレートタグは、引数の先頭位置にデフォルト値などが書いてあることが多くありますので、これを参考に引数を組み立てることができます。

ALT + ← を押下すると元の位置に戻ります。

テーマ作成だけでなく、プラグイン作成や解析時にも非常に有効な機能です。

PHP 組込み関数支援

PHP には数多くの組込み関数があり、その名称や引数指定を覚えるのはなかなか大変です。 Eclipse PDT には組込み関数利用を支援するためにいくつかの機能があります。

Eclipse PDT 2.0 ではプロジェクトに組込み関数の PHPDoc が自動で組み込まれます。

このことにより、先に記述した入力補完機能とその説明ホバーが組込み関数でも使うことができます。

mb_ と入力し、マルチバイト系の関数を一覧してみました。

また入力後の組込み関数に対して、SHIFT + F2 を押下することで PHP のマニュアルをひくことができます。

PHP Function ビュー（ウインドウ->ビューの表示から選択）では組込み関数などが一覧でき、それらをフィルターで絞ることもでき、さらに右クリックからマニュアルがひらけます。

組込み関数に関する全ての操作を統合環境上で行えるので、効率よくソースを構築していくことができるでしょう。

ローカルヒストリー

ファイル編集中に最終保存よりも過去の修正の方が良かったといった場合があります。 Eclipse は保存するごとに自動的に履歴をとる機能が動作していますので、これを使えば作業中容易にファイルを以前の状態に戻すことができます。

該当ファイルを右クリックし、比較からローカルヒストリーを選択します。

保存日付が表示されるので、 過去のものをダブルクリックしてみます。

現在のものと、過去のものの差分が表示されます。

ここで内容をクリップボードにコピーしたり、右上のアイコンから現在のファイルへのマージなどが行うことができます。 また過去日付を右クリックし「コンテンツを取得」とすることで現在のものにそのまま上書きすることもできます。

この機能により、安心してソースのリファクタリングをかけることができます。 分からなくなったら元に戻せばよいだけです。（残念ながら変数リネームなどのリファクタリングはまだできないようです）

以上がまずは知っておくと便利な、主にテキスト編集系の Eclipse PDT の機能です。 他にもいろいろ技が隠されていますので必要に応じて身につけていくといいでしょう。

Eclipse PDT による PHP のデバッグ

Eclipse PDT と XAMPP に入っている xdebug モジュールを利用すると、実行中のプログラムを任意の位置で停止させ、ソースコードとあわせて１行ずつ動作させるステップ実行や、変数の値の監視や書き換えが行えるウォッチなどのいわゆるデバッグ機能を使うことができるようになります。

プラグイン作成や、WordPress の動作に不具合があった場合、原因を突き止めるのが非常に楽になりますので、そういった作業をされる方は設定するとよいでしょう。

Apache への xdebug モジュールの組み込み

まず XAMPP の Apache に xdebug モジュールの組み込みを行います。 Windows 版の XAMPP の場合、現在 xdebug 2.0.3 モジュールが添付されていますが Windows Vista の場合、Apache が落ちる問題があります。

[2008-12-30] — Xdebug 2.0.4

Fixed crash on Vista where memory was freed with routines from a different standard-C library than it was allocated with. (Patch by Eric Promislow ericp@activestate.com).

もし該当する場合は、XDebug サイトから Windows 版の 2.0.4 以降のモジュールをダウンロードしてします。（ここではこの XDebug 2.0.4 で動作させる手順を書きます。ただし、2.0.4 でも Vista の場合まだ落ちるかもしれません）

XAMPP 1.7.0 の場合は、PHP Version 5.2.8 であるため、5.2 用の XDebug モジュールをダウンロードします。

Xdebug: Downloads

5.2 VC6

ダウンロードしてきた php_xdebug-2.0.4-5.2.8.dll を以下のディレクトリに格納します。

   1: C:\Develop\xampp-win32-1.7.0\php\ext

以下の php.ini ファイルを修正します。 Zend と XDebug エントリをそれぞれ修正し、XDebug 側を有効にします。

   1: [Zend]

   2: ;zend_extension_ts = "C:\Develop\xampp-win32-1.7.0\php\zendOptimizer\lib\ZendExtensionManager.dll"

   3: ;zend_extension_manager.optimizer_ts = "C:\Develop\xampp-win32-1.7.0\php\zendOptimizer\lib\Optimizer"

   4: ;zend_optimizer.enable_loader = 0

   5: ;zend_optimizer.optimization_level=15

   6: ;zend_optimizer.license_path =

   7: ; Local Variables:

   8: ; tab-width: 4

   9: ; End:

  10:  

  11: [XDebug]

  12: ;; Only Zend OR (!) XDebug

  13: zend_extension_ts="C:\Develop\xampp-win32-1.7.0\php\ext\php_xdebug-2.0.4-5.2.8.dll"

  14: xdebug.remote_enable=true

  15: xdebug.remote_host=127.0.0.1

  16: xdebug.remote_port=9000

  17: xdebug.remote_handler=dbgp

  18: ;xdebug.profiler_enable=1

  19: ;xdebug.profiler_output_dir="C:\Develop\xampp-win32-1.7.0\tmp"

ファイルを保存し、Apache の再起動を行い以下の URL にアクセスします。

   1: http://127.0.0.1/xampp/phpinfo.php

phpinfo 画面で xdebug のロードを確認します。

Zend のモジュールとしてリードされていることと、remote.debug が true になっていればうまく設定できています。

XDebug は、WordPress で使われる mod_rewrite 時でもうまくデバッグできます。

Eclipse PDT のデバッグ設定

次に Eclipse PDT でデバッグを行う設定をします。

ウインドウ->設定から PHP の debug 欄を開き、PHP Debugger に XDebug を設定します。 また、Break at First Line のチェックをハズします。

次に、実行メニューからデバッグの構成を開き、PHP Web Page に以下の設定をし、適応を押下し閉じます。

次にプログラムを一時停止したい位置にブレイクポイントを設定します。 たとえば、テーマファイルの以下の位置に設定してみます。

   1: wp-content/themes/default/index.php

止めたい行の左をクリックするとブレイク行マークが出ます。（実行->ブレイクポイントの切り替えでも可能）

ウインドウ->ビューの表示、その他から、デバッグビューを表示させておきます。

再度、実行->デバッグの構成を開き、先ほどの構成を選択しデバッグボタンを押下します。

ブラウザが起動し、Eclipse に制御が返ります。 とりあえず、同じパースペクティブでかまいませんのでいいえボタンを押下します。

ブラウザの表示が停止し、Eclipse で先ほど設定した位置でプログラム動作がとまっているのが分かります。

この状態で、ウインドウ->ビューの表示から、変数ビューを選択します。

現在の変数の設定値が表示できます。

ソースコードの表示を移し、F5 キー（ステップイン）を押下していくと、１行ずつ次々にコードが実行されていきます。 関数などを読み飛ばしたいときは、F6（ステップオーバー）を押下します。 また、デバッグ実行中にブレイクを設定し、F8（再開）でそこまでとばすことも可能です。

とりあえず、F8 を押して後続を再開させると処理が終了し、ブラウザに表示が現れることでしょう。

再度デバッグする場合は先ほど起動したブラウザをそのままつかえば、またブレイク行で停止することができます。 プラグインの管理画面等のデバッグも、そのままの操作で管理画面にログインすればブレイク可能です。

作業中長時間のコーディングなどを行う場合にデバッガを終了させたい場合は、デバッグビューから停止を選択します。 また、再開したい場合は右クリックで再起動を選択します。

以上でデバッガの設定は終了です。

WordPress 実行中におかしなところを発見した場合は、該当の箇所にブレイクを張ってアクセスし、変数ウォッチやステップ実行を行うことで比較的簡単に原因を探ることができるでしょう。

WordPress を構成するテーマやプラグインファイルの実態である PHP 言語ファイルの修正は一般的なテキストエディタでも可能ですが、統合環境と呼ばれる言語専用の開発ソフトウェアを使うとより便利です。

PHP 言語の統合環境はいくつかありますが、ここでは Eclipse PDT (PHP Development Tools) のインストールを紹介します。

PDT Project

The PDT project provides a PHP Development Tools framework for the Eclipse platform. This project encompasses all development components necessary to develop PHP and facilitate extensibility. It leverages the existing Web Tools Platform (WTP) and Dynamic Languages Toolkit (DLTK) in providing developers with PHP capabilities.

Eclipse PDT を使った PHP 編集は、テキストエディタを使った場合と比較して次のような特徴があります。

1. PHP 編集時にリアルタイムでその構文のエラー申告が行われます。 これは行末のセミコロン忘れなどを動作前、未然に防ぐことができる機能です。
2. 予測できる範囲で構文の入力補完ができます。 たとえば関数の完全なスペルを覚えていなくても、統合環境が候補をだしてくれるため入力ミスを防ぐことができます。
3. ソースコード中で宣言部分へのタグジャンプが可能です。 呼び出し元関数から呼び出し先関数へワンキーでジャンプできます。 テンプレートタグなどの引数を知る場合にや WordPress 動作の解析に便利です。
4. WordPress の開発チームが用いている Subversion との統合が可能です。 最新版 trunk やリリース版の tag などを簡単にローカル環境に取得できます。 また更新ログの確認も容易です。
5. PHP 組込み関数のマニュアルが簡単にひけます。
6. 実行のソースコードを途中でとめて、その動きを監視するデバッグが可能です。

以上から、ある程度大きなテーマやプラグインの作成や、WordPress 自体の解析ではテキストエディタを使うよりも効率的に作業が進むと思います。

統合環境はそれ自体が大きなアプリケーションですので、お使いのコンピュータはある程度のスペックが必要です。 特にメモリは 2G 以上つんでいたほうがうまく動作するでしょう。

もし、実施する作業やコンピュータのスペックの要件が合うのであれば試してみると良いかもしれません。

尚、Eclipse PDT はおよびその動作環境である Java は、Windows、Linux、Mac OS X などで動作可能で、ライセンスに従い無料で使うことができます。

JRE のインストール

Eclipse PDT は、Java 言語によってかかれ動作するアプリケーションです。 このため、お使いのコンピュータに Java ランタイム（動作環境）のインストールが先に必要になります。 ここでは、Windows 用の JRE (Java Runtime Enviroment) のインストール手順を示します。 既にインストール済みの場合は読み飛ばしてください。

Sun Microsystems から JRE のダウンロードを行います。

無料 Java ソフトウェアをダウンロード – Sun Microsystems

お使いのコンピュータ用の Java をダウンロードしてみましょう。

無料 Java のダウンロードボタンを押下し、インストールを進めます。

インストール完了後、コントロールパネルに Java のアイコンが追加されることを確認します。

一般的には設定不要ですが、Java コントロールパネルから必要に応じて、アップデート間隔などの設定を行います。

コマンドプロンプトを開き以下のコマンドを実行し、インストールの確認を行います。

   1: java –version

正しくインストールが行われた場合、以下のように Java のバージョン情報が表示されます。 ダウンロードしたものと合致していれば問題ありません。

以上で、Eclipse PDT の動作環境となる JRE のインストールは完了です。

Eclipse PDT のインストール

Eclipse PDT のインストールを実施します。 Eclipse PDT は、Eclipse 統合環境のプラグインとして動作しますが、これらをワンセットにした All in one パッケージがありますのでこれを取得します。

PHP Development Tools (PDT) – Downloads

These downloads include PDT 2.0, Eclipse 3.4.1, and all other required plugins.

Windows の場合は、All-In-One PDT 2.0 (Windows 32-bit) をダウンロードします。 より新しいバージョンがある場合はそちらを使った方がよいでしょう。

Eclipse PDT にはインストーラはありません。 .zip ファイルを展開するだけでインストールが終わります。（アンインストールもファイル削除で行えます）

XAMPP をインストールしたディレクトリと同じディレクトリに展開すると、他コンピュータに一気に環境を移行できるので便利です。 ここでは以下の位置に .zip ファイルを展開しました。

デスクトップなど階層の深いところで展開を行うとパス長の関係で展開時にエラーが出る場合があります。 その場合は C:\develop など浅い階層で展開してみてください。

   1: C:\Develop\pdt-all-in-one-win32-2.0.0GA

Eclipse もまた、いくつかのバージョンをもてるようにディレクトリ名にバージョンをつけると便利です。 ファイルは以下のような配置になります。

インストールが完了しましたので、Eclipse PDT の起動を行ってみます。 以下のファイルをダブルクリックします。

   1: C:\Develop\pdt-all-in-one-win32-2.0.0GA\eclipse.exe

Eclipse PDT が起動します。

インストール初回に、設定やファイルを格納するワークスペースディレクトリの問い合わせがあります。 これも C:\Develop にいれると便利なので、フォルダを作成して指定します。

   1: C:\Develop\workspace

フォルダを以下のように作成します。

作成したフォルダを指定し、「Use this as the default and do not ask again.」にチェックをつけます。

Eclipse のメイン画面が起動します。

Welcome タブを閉じます。

これからは PHP の作業を行いますので、便利であろう作業スペースが事前に登録された PHP パースペクティブに切り替えます。 右上の Resouce 部分の左をクリックし、PHP を選択します。

これで Eclipse PDT のインストールは完了です。 ただし、このままではメニューが英語となっており直感的ではないため日本語化を行います。 まずは一度、Eclipse を終了させておきます。

Eclipse の日本語化

Eclipse PDT 自体はまだ日本語化されていませんが、そのコアとなる Eclipse を日本語化することで多くの部分で日本語メニューが使えるようになります。

日本語化は次のファイルを Eclipse に追加インストールすることで可能です。

Eclipse 日本語化言語パック (サードパーティ版)

Eclipse 日本語化言語パック (サードパーティ版) をダウンロードすることができます。

   1: NLpackja-eclipse-jee-ganymede-SR1-blancofw.zip

こちらから「Ganymede SR1 Language Packs Eclipse IDE for Java EE Developers」をダウンロードします。

.zip を展開し以下のファイルを得ます。

この2つのディレクトリを、以下の Eclipse インストールディレクトリにあわせる形で上書きします。

操作が環境したら再度 Eclipse を起動します。

メニュー等多くの部分が英語から日本語に変更されます。(英語が残る部分は日本語化されていない Eclipse PDT 固有のところです）

Eclipse PDT の設定

Eclipse PDT で作業をはじめる前に以下の設定をしておきます。 メニューのウインドウ-> 設定の左ツリーから選択していきます。

編集ファイル文字コードの設定

編集するファイルの文字コード設定を UTF-8 にします。 テキスト・ファイル・エンコードを その他から UTF-8 に変更してください。

テキストエディタの行番号表示

PHP ではエラーが行番号で表示されるため、テキストエディタの設定で行番号が表示されていると便利でしょう。

以下から行番号の表示にチェックを入れます。

PHP マニュアルの日本語化

PHP の日本語オンラインマニュアルをひくために、ドキュメント URL の追加を行い標準に設定します。

NEW で日本語版の URL を追加します。

追加したマニュアルにカーソルをあわせて、Default ボタンを押下します。

これで PHP 組込み関数の上で SHIFT + F2 を押下することでマニュアルがひけるようになります。

テキストエディタの改行やタブ、全角スペース可視化

PHP ファイルの編集ではテキストエディタで、改行やタブ、全角スペースを可視化したほうが良いかもしれません。 これを実現するには、JStyle プラグインを導入すると便利です。（標準でも設定可能ですがあまり見やすくないため、JStyle をお勧めします。 ただし Windows のみです）

JStyle (Eclipse 改行、タブ、全角空白を表示)

Eclipse のエディタで全角空白、半角空白、タブ、改行（LF、CRLF、CR）を表示可能にするプラグインです。 他に太字を通常文字と同じ幅で表示するオプションがあります。

Eclipse を終了させ、.zip ファイル展開後、plugins ディレクトリを日本語化と同じように、Eclipse インストールディレクトリの plugins に上書きします。

コマンドプロンプトを開き、以下のコマンドで Eclipse を起動します。

   1: C:\Develop\pdt-all-in-one-win32-2.0.0GA\eclipse.exe –clean

これは JStyle インストール後、１回だけで問題ありません。

以下の場所に JStyle の設定が現れればインストール完了です。

この他の設定

Eclipse にはこの他にも標準やプラグインの拡張で開発に便利な機能を拡張することができます。 以下が参考になりますので、必要に応じてインストールしてみてください。

プラグイン – EclipseWiki

Eclipse はツールのプラットフォームという位置づけです?ので、さまざまな機能を追加するプラグインがあります*1。

以上で Eclipse PDT の初期設定は終わりです。

続いて、Eclipse PDT + XAMPP で WordPress の開発環境をつくる (1) でインストールした WordPress を Eclipse PDT に取り込んで、実際に操作をしてみます。

ブログシステム WordPress でのサイト構築にあたって必要となってくる、いわゆるローカル環境の構築手順です。

WordPress | 日本語

WordPress 日本語ローカルサイトへようこそ。

WordPress (ワードプレス) は、オープンソースのブログ／CMS プラットフォームです。セマンティック Web、コードやデザインの美しさ、Web 標準、ユーザビリティなどを意識して開発されており、無料でダウンロードして使うことができます。

WordPress を使って、思い通りにカスタマイズしたブログサイトを作り上げてみませんか。

WordPress は多くの場合レンタルサーバ上にインストールを行いインターネットにサイトを公開しますが、サイト運転中のレンタルサーバ上に直接修正したテーマファイルや追加インストールしたプラグインをアップロードして試験すると、ブログ読者にその作業状況が見えてしまいます。 また、エラーがでた場合の対応も難しく、修正効率もあまり良くありません。

ローカル環境は、ご自宅の PC 上に WordPress をインストールし、その動作の確認に使う環境です。 ローカル環境で動作の確認や細かい修正を行った後に、レンタルサーバに修正ファイルをアップロードすることで、読者への影響を最小限にしてサイト構築を行うことができます。

この文書はこの WordPress ローカル環境の構築方法です。（WordPress と同様な Apache + PHP + MySQL を使う Web アプリケーションの開発環境構築手順としても役に立つかもしれません。）

文書前半は WordPress の動作に必要な、Apache + PHP + MySQL 環境が簡単に用意できる XAMPP というパッケージのインストール方法で、後半は Eclipse PDT と呼ばれる PHP の統合開発環境もあわせてインストールし、テーマやプラグインなど PHP のファイルを修正するにあたってあると便利なヘルパープログラムのインストール手順も示します。

Eclipse PDT が必要ない方は、前半の手順だけ実施すればテキストエディタを使った WordPress の試験・開発環境が整えることができます。 必要に応じて読み進めてください。

XAMPP とは

XAMPP は Apache Friend プロジェクトから提供される、Web 開発環境を手軽にインストールするための統合的なパッケージです。 これには WordPress に必要な Apache、PHP、MySQL 環境が含まれ、phpMyAdmin などあると便利なソフトウェアも標準インストールされます。

apache friends – xampp for windows

多くの皆さんが経験上、Apache Web ServerとMySQL、PHP、Perlのインストールと連携が難しいことはご存知だと思います。XAMPPはMySQLやPHPやPerlを含んだディストリビューションとして簡単にインストールすることができます。インストールは「ダウンロードして、展開して、実行」するだけ。本当にとても簡単です。

インストールは .zip を展開するだけの簡単なもので、アンインストールもファイルを削除するだけで実施可能です。 また、他の PC へ環境をうつす場合も、ファイルをコピーするだけで容易に行うことができます。

ここでは、2009/01 の最新版である XAMPP 1.7.0 for Windows のインストール手順を記述しています。 これよりも新しいバージョンがある場合は、適宜よみかえて実施ください。

XAMPP 1.7.2、および Eclipse 3.5.1 の手順について Saya. さんが差分のフォローをしてくださいっています。

Eclipse PDT + XAMPP でWordPressを弄ってみる（準備編）

さて、ドキュメント通りに進めてみたのですが、バージョン違いによる挙動や表記の違いが結構見られますので、ウチでの実験結果に基づいて差分を書いてみたいと思います。

大変参考になります。（ありがとうございました!） インストールされる方は併せて読み進めてみてください。

尚、XAMPP は Web 開発向けのパッケージです。 本来サイトを運用するときに設定すべきセキュリティー系の設定が標準状態でされていません。 XAMPP はインストールを行う PC は ルータ等でインターネットから直接アクセスできない環境におき、開発時以外はなるべく起動しないようにしたほうが良いでしょう。

apache friends – xampp for windows

以前にも述べたように、XAMPPは開発環境での開発用の使用を目的としており、本番環境用ではありません。XAMPPは可能な限りオープンに、また Web開発者が求めることをできるだけ実現させるように設定されています。これは開発環境としてはすばらしいことですが、本番環境としては致命的となり得ます。

本手順では、XAMPP 標準インストール時のユーザ名・パスワードなどを使った記述を行っています。 上記リンクに説明があるとおり、これらも任意に設定が可能です。 可能であれば、ご自身でセキュリティ設定を行った方がベターです。 その場合は、パスワードなどの部分を置き換えて設定を行ってください。

XAMPP のインストール

XAMPP のインストールは、.zip を展開し、環境設定用のバッチファイルを一度起動するだけの簡単なもので、おそらく 15 分もあれば完了することでしょう。

ここでは、Windows 版のインストール手順を示します。

Linux / Mac OS X / Solaris でもインストール先が異なるだけでほぼ同一の操作で行うことができると思います。 Linux の方は以下の手順が参考になる可能性があります。

hiromasa.another ) » Blog Archive » Ubuntu に XAMPP をいれてローカル WordPress

WordPress やるならローカル環境いるでしょ～ってことで、Ubuntu におなじみ XAMPP を入れてローカル環境をつくる方法です。

ではまずは、パッケージファイルのダウンロードを行います。

apache friends – xampp for windows

XAMPP Windows版 1.7.0

リンク先に、 ZIP 版がありますのでこれをダウンロードします。

以下の位置に展開します。 ここでは、開発系のファイルをひとつにまとめるために、C:\Develop というフォルダを新規に作成し、その下に展開しています。 また、XAMPP のバージョンを将来複数持つために、XAMPP を格納するフォルダ名にバージョンナンバーを付与しておくと便利でしょう。

   1: C:\Develop\xampp-win32-1.7.0

.zip ファイルが展開できたら、以下のバッチファイルをダブルクリックします。

   1: C:\Develop\xampp-win32-1.7.0\setup_xampp.bat

これで XAMPP のセットアップは終了です。

XAMPP の起動方法

XAMPP はインストールしただけではサービスの起動は行われません。 作業するときに以下のコントロールパネルから操作をすることではじめて Apache や MySQL などのプロダクトが起動します。（逆に言うと、作業していないときは PC 環境に影響を与えないためこのほうが便利でしょう）

起動は以下のファイルをダブルクリックし、XAMPP のコントロールパネル操作を行います。

   1: C:\Develop\xampp-win32-1.7.0\xampp-control.exe

xampp-control.exe をダブルクリックすると以下のコントロールパネルが表示されます。

WordPress の動作には、Apache 、MySQL の起動が必要となりますので、それぞれの Start ボタンを押下し起動状態とします。

各ステータスが Running となれば正常起動されています。 もし Running にならない場合は、他のアプリケーションがプロダクトが使うポートを占有している可能性があります。

たとえば、Skype などは Apache が使うポート80番を標準で使いますので、その場合は Skype の詳細設定からその解除を行ってください。 また、別途 XAMPP 以外の Apache や Windows の IIS などが起動している場合も同様です。 この時は、それぞれを一度落としてから再試行します。

尚、XAMPP コントロールパネルの Svc 欄にチェックをいれると、PC起動とともに各プロダクトを自動起動させることができます。 これは継続した作業では便利ですが、前述の通り XAMPP は標準状態でセキュリティーが緩い設定になっていますので、必要の無いときに不意に起動してしまわないよう、この欄はチェックをいれないことをお勧めします。

XAMPP の動作確認

XAMPP から起動した、Apache 、MySQL の動作確認をします。

ブラウザを起動し以下の URL を入力します。

   1: http://127.0.0.1/

ブラウザに以下の表示が出れば、Apache が正常に起動しています。

右に「日本語」とありますのでこれをクリックします。

MySQL の動作確認をするために、左フレームの phpMyAdmin を押下します。

この画面が表示されれば、MySQL も正常に動作しています。

Apache、MySQL の確認ができたら、引き続き WordPress をしてみましょう。

WordPress のインストール(MySQL データベース)

WordPress のインストールを行うために、まず MySQL に対して WordPress 用のデータベースを作成します。 将来 WordPress のバージョンアップ検証を行うために、データベース名にバージョン名を付与すると便利でしょう。

新規データベースを作成する欄に以下の名称でデータベースを作成します。 またデータベース名入力欄の横の照合順序ドロップダウンを utf8_general_ci に設定します。

   1: wordpress-27x

作成ボタンを押下するとデータベースが作成されます。

WordPress の動作に必要な MySQL データベースの作成が完了しました。 次に、WordPress 本体、PHP ファイルの配置を行います。

WordPress のインストール(PHP ファイルの配置)

WordPress 本体ファイルを XAMPP の Apache に配置します。

まず、WordPress 日本語版を以下からダウンロードします。

WordPress | 日本語

ダウンロード

最新の WordPress 日本語版 は右のダウンロードリンクよりどうぞ。

ダウンロードした .zip ファイルを XAMPP のドキュメントルートに配置します。 ここでも、いくつかの WordPress をインストールできるようにバージョン番号をフォルダ名に設定すると便利でしょう。

   1: C:\Develop\xampp-win32-1.7.0\htdocs

これで WordPress の PHP ファイルの配置は完了です。

ブラウザから以下の URL にアクセスし、WordPress の動作を確認します。

   1: http://127.0.0.1/wordpress-27x/

次に WordPress に対して、wp-config.php を指定するためにウイザードに従って設定をしていきます。

WordPress に対する MySQL 接続設定

ここから WordPress に先ほど作成した MySQL データベースの指定などを行い、WordPress を起動していきます。

wp-config.php ファイルを作成するボタンを押下します。

次に進みましょう！ボタンを押下します。

先ほど作成した、MySQL データベースを指定 (wordpress-27x) します。 ユーザ名、パスワードは XAMPP 規定値で、ユーザ名「root」、パスワード「(なし)」となっていますのであわせて設定し、作成するボタンを押下します。

インストールを実行しましょう！ボタンを押下します。

これで WordPress の初期設定が完了しました。

もしボタン実行後から反応がない場合で、PC にウイルスバスターをインストールしているときは一度ウイルスバスターを停止してからインストールを行ってみてください。

では続けて WordPress の設定を行っていきます。

WordPress の設定

ローカル環境にインストールする WordPress の設定を行います。

ブログ名称を記入しますが、レンタルサーバ上のサイトと簡単に区別できるように Localhost などと本番環境と間違えない名前にするとよいでしょう。 また、ローカル環境での作業で更新 ping などが動作しないように、「このブログを Google や Technorati などの検索エンジンに表示されるようにする。」のチェックをオフにします。

WordPress のユーザ名、パスワードが表示されます。 パスワードを必ずメモしてログインボタンを押下します。

今ほどのユーザ名、パスワードでログインします。

これで、WordPress のインストールは完了です。

先駆けてパスワードを管理できるものに変更しておくと良いでしょう。 左フレーム、ユーザから「あなたのプロフィール」を選択し、画面最下部から設定できます。

ローカル環境でのファイル修正方法

ここで作成したローカル環境の WordPress は以下の位置に配置されています。

   1: C:\Develop\xampp-win32-1.7.0\htdocs\wordpress-27x

またテーマやプラグインのインストールに必要なフォルダである wp-content ディレクトリは以下となります。

   1: C:\Develop\xampp-win32-1.7.0\htdocs\wordpress-27x\wp-content

通常のレンタルサーバであればファイルを FTP で転送し、追加や修正を行うことになりますが、ローカル環境ではこれらのファイルをテキストエディタなどで直接書き換えることが可能です。

修正した結果は以下の URL から参照が可能です。

   1: http://127.0.0.1/wordpress-27x/

尚、この手順でインストールで動作した WordPress は、インストールしたコンピュータからのアクセス以外では正しく動作しません。 (サイト動作URL が http://127.0.0.1/wordpress-27x/ として WordPress に登録されるためです）

もし、複数の PC でクロス開発などを行う場合は、「WordPress 初期インストール時」にアクセスする URL を http://[PCのIPアドレス]/wordpress-27x/ としてください。