MacでWordpressのローカル環境を構築する方法です。
他のバージョンでも利用可能だとは思いますが、OSX Yosemiteでこの記事は書いています。
アルファベットが多く、見た目は難しそうに見えますが、簡単に設定できます。
Sponsored Links
このエントリーは下記サイトを参照させて頂きました。
WordPressをローカル環境へインストールする手順 | WPカスタマイズ&自作テーマ作成説明所(仮)
ローカル環境を構築するために使うアプリ一覧
通常Webサイトはインターネット上にあるサーバーを見にいき、ブラウザ上(SafariやChromeのこと)でファイルをダウンロードして表示させています。
今回の方法はローカル環境なので、自Macの中に仮想サーバーを構築し、サイトを表示させる方法です。
僕はWordPressのデフォルトテーマを自分用にカスタマイズしていますが、そのカスタマイズするときに直接本物のテーマファイルをいじるのは怖すぎてできません。(プログラムをかじったことがある人はわかると思いますが。。)
まずはローカル環境にて試験的に変更してから、本物のブログに反映させています。ローカル環境でプログラミングの勉強にもなります。
MAMP&MAMP PRO⇒仮想サーバー構築
ローカルサーバーを
有料版がPROとなりますが、無料版のみ使います。
NetBeans⇒IDE(統合開発環境)エディタです
プログラムを書くためのエディタです。
直接ブラウザ上のWordpressの管理画面でCSSファイルなどを編集できますが、ブラウザ上では色分け等がされていないので、かなり見づらいです。
なので、僕の場合はエディタ(IDE 統合開発環境)を使って編集しています。
今回はローカル環境で使うための環境設定方法を書きます。前回、本物のテーマファイルを編集するための設定方法(FTPの設定など)のエントリーを書いていますので、もしそっちの方が気になる方は下記エントリーを参照してください。
NetBeansのインストール方法も下記エントリーで紹介していますので、参考までに。
【備忘録】NetBeansでWordPressのテーマファイルなどをいじれるようにするための環境設定⇒FTPの設定など | itkhoshi.com
まずはMAMPで仮想データベースの作成
このアプリはAppStore上にはありませんので、MAMPの公式ページからダウンロードします。
この記事を書いた時点での最新バージョンは【MAMP & MAMP PRO 3.0.7.3】です。
MAMPのインストール方法
MAMPのページで 【Download】ボタンをクリック。
下記の画面になりますので、再度【Download】をクリックすると、インストーラのダウンロードが始まります。
下記がダウンロードしたファイルです。
ダブルクリックして、インストールを始めます。
あとは次々画面に沿って進んでいきます。
インストールには870.3MBの空き容量が必要です。
これでインストール完了です。
下記のファイルがインストールされました。
ただ、使うのは無料で使える【MAMP】のみです。
MAMPの管理ページでデータベースを箱を作ります ⇒ これが仮想のデータベースとなり、ここにWordpressを入れます
インストールしたMAMPを起動します。
MAMP PROについての警告が表示されます。チェックを外すと次から表示されなくなります。
MAMPが起動したら、【サーバを起動】をクリックします。
サーバが起動すると、ブラウザが起動し、MAMPの管理画面が表示されます。
【phpMyAdmin】をクリックします。
もし、この画面が出ない場合はサーバー起動後、【オープンWebStartの】(日本語おかしい?)をクリックすると下記ページが表示されるはず。
WordPressを入れるために、まずは入れる箱を作ります。(箱とはデータベースのこと。)
【データベース】タブを選択。
赤枠の部分に【データベース名】を入力し、【作成】をクリックします。
このデータベース名は後でWordpressインストールの際に必要になります。
これで【itkhoshi_local_db】という箱(データベース)ができました。
次にここにWordpressを入れます。
WordPressのファイル一式をダウンロードし、自Macに保存⇒ローカル環境でWordpressが動作するようにします
下記ページからWordpressのファイル一式をダウンロードします。
下記のボタンをクリックで、ダウンロードが始まります。
下記のフォルダがダウンロードされます。
このフォルダを先ほど作成した箱(データベース)に入れます(インストールします)。
まずはダウンロードした【Wordpress】フォルダを下記の場所にコピーします。
アプリケーション>MAMP>htdocs
こんな感じでOKです。
先ほど作成したデータベースにWordpressをインストールします
Safariなどのブラウザで下記URLを開きます。
http://localhost:8888/wordpress/
MAMPでサーバが起動していれば開くはずです。
WordPressのインストール画面となります。
ここの【データベース名】は箱(データベース)作成のときに使ったデータベースの名称を入力します。
データベースのホスト名、テーブル接頭語はそのまま、他は好みで大丈夫です。
インストール実行。
サイト名、ユーザ名等々入力します。
ローカル環境用なので、ローカルだとわかる表記にした方がいいかもです。
後でも変えられますので、ここでは適当でも問題無し。
インストール完了です。
ログインしてみると。。
WordPressの管理画面が正常に表示されています。
この画面で色々テストも可能ですね。
まさにまっさらな状態です。
このブラウザ上で色々試すのももちろんありですが、今回はIDE(統合開発環境)でテーマ編集などをできるように設定します。
もう少しで終わりますよ。
NetBeans(エディタ)で自MacにダウンロードしたWordpressのテーマファイル一式を編集するように設定する
冒頭でも記述していますが、NetBeansのインストール方法は前回のエントリーで紹介していますので、そちらを参考にして下さい。
インストールができたら、前回のエントリー同様プロジェクトの作成から設定します。
右クリック⇒【新規プロジェクト】を選択します。
カテゴリは【PHP】、プロジェクトは【既存のソースを使用するPHPアプリケーション】を選択します。
ソースフォルダは先ほど入れた、Wordpressフォルダを選択します。
⇒アプリケーション>MAMP>htdocs>Wordpress
プロジェクト名は適当な名前を入れておきます。
(本物のファイルと分けるためにもローカルとわかる表記にした方がいいかもです。)
実行方法は【ローカルWebサイト(ローカルWebサーバーで実行中)】を選択しておきます。
他の項目はそのままで大丈夫です。
これで設定は終わりです。
【終了】をクリックすると、先ほどダウンロードしたWordpressのファイル一覧が出てきました。
あとは、このアプリ上で色々ブログのテーマファイルなどを編集して、ローカルの環境でテストできます。
もちろん本物のサイトにはまったく影響はありません。(テスト用なので当然ですが。)
まとめ
OSX Yosemiteでも問題なくできました。(以前、OSXをアップデートしてMarsEditがクラッシュしたので正直少し不安でした。)
Webサイトに関わらず、テスト環境は必ず必要だと僕は思っています。テスト無しで本物のファイルをいじるのはちょっと勇気が必要ですよね。
このローカル環境はテスト用の他、PHP言語の勉強にもなりますので、Webサイトを作成する上で必要な知識も学べる環境になります。
是非、参考になれば幸いです。
Sponsored Links