Eclipse PDT + XAMPP で WordPress の開発環境をつくる (1)

はじめに

ブログシステム 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を弄ってみる(準備編)

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

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

xampp01

尚、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 :o ) » Blog Archive » Ubuntu に XAMPP をいれてローカル WordPress

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

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

apache friends – xampp for windows

XAMPP Windows版 1.7.0

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

xampp02

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

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

 image

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

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

image

image

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

XAMPP の起動方法

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

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

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

image

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

image

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

image

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

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

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

XAMPP の動作確認

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

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

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

 

xampp04

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

xampp06

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

xampp07

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

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

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

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

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

   1: wordpress-27x

xampp08

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

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

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

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

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

WordPress | 日本語

ダウンロード

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

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

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

image

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

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

xampp10

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

WordPress に対する MySQL 接続設定

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

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

xampp10

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

xampp11

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

xampp12

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

xampp13

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

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

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

WordPress の設定

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

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

xampp14

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

xampp15

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

xampp16

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

xampp17

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

xampp18

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

ここで作成したローカル環境の 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 から参照が可能です。

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

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