Bitnami WordPress をEclipseでデバッグできるようにする方法

wordpress
この記事は約13分で読めます。

WordPressをローカル環境にインストールし、オリジナルテーマを作成したりするため、開発環境にEclipseを利用する場合があると思います。ただ、 Bitnami WordPress を利用する場合、Eclipseでデバッグするための設定方法を調べてみると複雑だったので、備忘録としてまとめました。

 

スポンサーリンク

はじめに

WordPressでオリジナルテーマを作成するにあたり、PHPの開発環境が必要になりました。

PHPの開発環境として、恐らく最初に挙がるのがEclipseだと思います。

そして、PHPの実行環境として用いられるのがXAMPPではないでしょうか。

まず、私自身、最初にWordpressをローカル環境で動作させるために、XAMPPをインストールして利用していました。

次に、XAMPPのアドオンにBitnami WordPressがあるので、これもそのまま利用していました。

さらに、ホームページの作成には、EclipseにAptana Studio 3をインストールしてhtmlを作成していた時期がありました。

この一連の流れから、Wordpressのオリジナルテーマを作成するにあたり、XAMPPのアドオンであるBitnami WordPressをEclipseでデバッグすることを思いつくのは私だけではないと思います。

しかし、Eclipse・XAMPP・Bitnami WordPressの3つのアプリを利用してWordpressの開発環境を構築する方法について調べてみると、色々と複雑であることが判明しました。

今回、この3つのアプリを利用して簡単にWordpressの開発環境を構築する方法があったので自分の備忘録も兼ねて紹介したいと思います。

bitnami wordpress

 

 

EclipseによるWordpressの開発環境の構築例

私が調べた限り、EclipseでWordpressの開発環境を構築する方法は、以下の二つでした。

まず、以下のサイトでは、XAMPPにインストールしたWordpressをEclipseのPHPのプロジェクトにインポートする方法です。

この方法の場合、XAMPPのhtdocsをワークスペースに指定し、その直下にインストールされたWordpressのフォルダ名をPHPプロジェクトのプロジェクト名に指定することで開発環境を構築しています。

例えば、ワークスペースの”C:\xampp\htdocs”に”wordpress”という名前でフォルダを作成していた場合、プロジェクト名も”wordpress”にします。

また、次の以下のサイトでは、Eclipse日本語化プラグインのPleiadesに元から組み込まれているXAMPPを利用したWordpressの開発環境を構築しています。

Pleiadesには、フォルダの中を見て初めて気付くのですが、XAMPPが組み込まれています(パス:pleiades/xampp)。

このPleiadesに組み込まれているXAMPPを利用することでWordpressの開発環境を構築しています。

上記二つのやり方でもWordpressの開発環境を構築できるので、自分が今までに使ってきたアプリで出来る方を選べば良いと思います。

ただ、私のような初心者で、以下の条件が当てはまる人は、今から紹介する方法が上記二つの方法より手っ取り早いのではないかと思います。

  • ローカル環境でWordpressを実行するために既にXAMPPをインストールしている。
  • XAMPPのアドオンであるBitnami WordPressもインストールしている。

この二つのアプリがインストールされている場合、あとはEclipseでPHPプロジェクトを作成し、XDebugの設定をするだけです。

XDebugの設定は、次の記事を参考にしてください。

 

 

Bitnami WordPressのインストール

Bitnami WordPressは、インストーラーでPC上に簡単にWordpressをインストールし、実行することが可能です。

このため、初心者がWordpressを簡単に扱いことが出来るアプリケーションとして多くのサイトで紹介されています。

Bitnami WordPressをインストールする場合、予めXAMPPがPCにインストールされている必要があります。

XAMPPのインストールやその他の設定に関しては、上記で紹介した記事を参考にしてください。

ダウンロードは以下のサイトからWindows用をダウンロードします。

インストールの方法は以下の通りです。

上記サイトからダウンロードしたインストーラーを実行すると、最初に言語選択をするウィンドウが表示されます。

日本語版はないので、そのままで「English-English」を選択し、英語版をインストールすることになります。

言語選択を行うと、「Setup」ウィンドウが表示されますが、内容は「ようこそ」なので、そのまま「Next」をクリックします。

 

 

次のウィンドウではインストール場所の選択が表示されます。

インストール場所が選択できると思って、”C:\xampp\htdocs”にインストールしようとしたのですが、エラーが出てインストールできませんでした。

このため、ここでも特に設定変更は行わずに「Next」をクリックします。

何のためにあるんでしょうね…。

 

 

インストール場所を設定したら、次はWordpressのアカウントの設定です。

PCのローカル環境でWordpressを実行するだけなので、適当でも良いのですが、「Login」と「the application password」がWordpressの管理画面にログインする際のUser nameとPasswordになるので分かりやすいものにした方が無難です。

そこで、今回はパスワードの設定だけを行い、パスワードを「password」にしておきましょう。

こうすることで、管理画面にログインする場合、User nameが「user」、Passwordが「password」になります。

 

 

管理者アカウントの設定をしたら、次はブログのタイトルの設定です。

ここも必要があれば、自分の好きなタイトルに変更しましょう。

 

 

ちなみに、これまでの管理者アカウントとタイトルは、Wordpressをインストールした後で管理画面にログインして変更可能です。

タイトルの設定が終わったら、次はメールによるお知らせの設定です。

デフォルトではチェックボックスにチェックが付いていません。

ただ、これもローカル環境での設定なので、しなくても良いと思います。

お知らせメールの動作をチェックしたい場合には設定する必要があるかもしれませんが…。

 

 

SMTPの設定が終わったら、次はBitnami Cloudの設定です。

どうやら、Bitnamiが運営するサーバーの設定なので、Bitnamiにアカウントを持っていなければ設定しても意味がないです。

なので、チェックボックスのチェックは外しておきましょう。

 

 

ここまでの設定で、次はインストールを開始します。

インストールが終了するまでしばらく待ちましょう。

 

 

インストールが終了すると、「Setup」ウィンドウに以下の内容が表示されます。

「Launch Bitnami WordPress Module」チェックボックスにチェックが入っている場合、ブラウザが起動してWordpressが表示されます。

 

 

以上で、Bitnami WordPressのインストールは終了です。

 

 

Bitnami WordPress をEclipseにインポートする

ワークスペースの設定

XAMPPのインストール先がCドライブ直下でBitnami WordPressをインストールした場合、インストール先のパスは”C:\xampp\apps\wordpress”になります。

EclipseでPHPのプロジェクトを作成した場合、デフォルトではワークスペースで指定したフォルダの直下にそのプロジェクトのフォルダが作成されます。

このため、Bitnami WordPressのフォルダをプロジェクトのフォルダにしたい場合、ワークスペースを”C:\xampp\app”に指定する必要があります。

 

 

PHPプロジェクトの設定

ワークスペースを選択した後、次にPHPプロジェクトとしてBitnami WordPressをインポートします。

Eclipseのファイルメニューには「インポート」があり、「新規プロジェクトとして既存のフォルダーを使用」という選択があります。

通常であれば、この選択で間違いはないと思うのですが、実はこれではデバッグを構成することが出来ないという問題が生じます。

具体的には、「デバッグの構成」で「サーバー」タブにある「ファイル」項目で「参照」ボタンを押して「ファイルの選択」ウィンドウを表示しても、「使用可能なエントリーはありません」というメッセージが表示され、ファイルを選択することが出来ません。

 

 

Bitnami WordPressをPHPプロジェクトとしてインポートする場合、「ファイル」→「新規」→「PHPプロジェクト」でPHPプロジェクトを作成します。

表示される「新規 PHP プロジェクト」ウィンドウでプロジェクト名を「wordpress」にします。

前述したようにプロジェクトフォルダは、Bitnami WordPressがインストールされた”C:\xampp\apps\wordpress”になります。

 

 

これで、PHPプロジェクトとしてのBitnami WordPressのインポートは終了です。

 

デバッグの構成

大抵、既存のフォルダをPHPプロジェクトにインポートするには、ファイルメニューの「インポート」で行う方法が紹介されていると思います。

このため、通常の方法を色々と選択を変えたりなどして、今回の方法に辿り着くまでにかなり梃子摺りました。

さらに、梃子摺ったのは、「デバッグの構成」です。

まず、「デバッグの構成」で「PHP Web アプリケーション」を選択します。

 

 

次に、「サーバー」タブで「ファイル」の「参照」ボタンをクリックします。

 

 

前述した「インポート」と異なり、プロジェクトで指定したフォルダの中身がちゃんと登録されていることが分かります。

WordPressには”index.php”が複数あるのですが、デバッグを行う場合、”wordpress\htdocs\index.php”を選択し、「OK」ボタンをクリックします。

 

 

これまでの操作を行ったところで、「デバッグ構成」に注意が必要なのは、「サーバー」タブの「URL」の設定です。

デフォルトでは、「URL」の「自動生成」チェックボックスにチェックがついています。

この場合、赤枠で囲んだ部分に「ファイル」のパスが自動で入力されます。

仮にこの設定でデバッグを実行した場合、「最初の行でブレーク」にチェックが入っていれば、最初の行で一時停止します。

しかし、それ以外の場所でブレークポイントを設置している場合、その場所で一時停止することはありません。

また、表示されるページは、トップページではなく、「Not Found」ページが表示されます。

この問題を解決する方法として、以下のサイトを参考にしました。

Bitnami WordPressのトップページをFirefoxやChrome、Edgeなどのブラウザで表示する場合、そのURLは”http://127.0.0.1/wordpress/”になります。

しかし、自動生成されたURLは”http://127.0.0.1/wordpress/htdocs/index.php”になり、Bitnami WordPressのトップページのURLと異なります。

これが、デバッグを実行した際に「Not Found」ページが表示される原因になるのではないかと思います。

そこで、トップページのURL(“http://127.0.0.1/wordpress/”)と同じようになるように、”htdocs”がないURLにする必要があります。

具体的には、まず、以下の図のように、「サーバー」タブの「URL」にある「自動生成」チェックボックスのチェックを外します。

次に、赤枠で囲んだテキストボックス内のURLの”htdocs”を削除します。

 

 

サーバーの設定は以上です。

「デバッガー」タブでXDebugの設定をまだ行っていない場合は、次の記事を参考にしてください。

実際に自分で作成したテーマのデバッグを行う場合は、「最初の行でブレーク」のチェックを外してください。

 

 

最後に

前回、EclipseとXAMPPを組み合わせてPHPの開発環境を構築しました。

PHPの開発環境が整ったので、いざWordpressのオリジナルテーマを作ろうとBitnami WordPressをインストールしました。

ところが、トップページが表示されず、プログラムの実行がブレークポイントでも停止しないという問題が生じました。

この問題について、EclipseでWordpressの開発環境を構築しているサイトを調べてみると、PHPの実行環境をPleiadesに既に組み込まれているXAMPPを利用していたり、Wordpressのインストール場所をXAMPPのhtdocsにしていたりと方法がまちまちで、皆さん、かなり苦労しているようでした。

私自身、PHPやWordpressに関する知識が全くない初心者なので、後先考えずに、とりあえずPHPの実行環境としてPHPをインストールし、PHPの開発環境としてEclipseをインストールしてきました。

WordPressもXAMPPのアドオンとして紹介されていたので、これも何の疑いもなくインストールしていました。

いずれのアプリケーションも初心者向けとして紹介しているサイトが多数存在するので、当然と言えば当然ですが…。

ところが、この初心者用のアプリケーションを組み合わせると、思ったほど簡単には開発環境を構築できませんでした。

とりあえず、XAMPP・Eclipse・Bitnami WordPressを組み合わせて試行錯誤の上、Wordpressのオリジナルテーマを作成するための開発環境を構築することが出来ました。

単に、Eclipseのデバッグの構成でサーバーのURLを修正すれば良いだけだったんですけどね。

私と同じように、初心者向けのサイトを辿ってWordpressのオリジナルテーマを作成しようと思いついた方の参考になればと思います。

最近、私の周りで自分のサイトを立ち上げたいという方が増えてきており、Wordpressを紹介する機会が増えてきました。

ただ、右も左も分からないまま、いきなりサーバーをレンタルしてWordpressを導入しても自分がやりたい事と違う場合があります。

また、数多くあるテーマの中から自分に合ったテーマを探すにしても時間が掛かるでしょう。

その点、PC上のローカル環境でWordpressを実行できる環境を構築できれば、サーバーをレンタルする前に色々と試すことが出来ます。

そして、XAMPPやBitnami WordPressはインストール時に何か特別なことをする必要がないので初心者でも簡単にPCにインストール出来ると思います。

なので、当施設に来る利用者さんでサイト運営に興味があれば、手軽に始める方法として紹介できればと思います。

コメント

タイトルとURLをコピーしました