ご自身のパソコンの中でWordPressが動かせるように、ローカル環境を作っていきましょう。
本講座ではwindowsで使用するXAMPPのインストール方法を解説します。 WordPress基礎講座【前編】の動画を参考に、MAMPを導入してください。
1.ローカル開発環境とは
「ローカル環境」とは、個人のコンピューター内に構築された環境を指します。 HTMLやCSSはテキストエディタでコードを書いて、そのままブラウザで確認してきましたよね。しかし、WordPress(PHP)はコードを書いてファイルを保存→ブラウザで確認しようとしても上手く動いてくれません。
そのため、ローカル環境でこうしたプログラム/アプリケーションを動かせるようにする必要があります。この、自分のパソコンだけで開発や確認が出来る状態にローカル環境をカスタマイズすることを「ローカル開発環境」を作ると言います。
簡単にまとめてしまうと… Windows/MacそのままだとWordPressは動かないので、動かせる状態にしよう。 という事です。
MAMPとXAMPP
WordPressサイトを作成する際、制作環境作りに多く使用されているのが以下のソフトウェアです。
- Windowsの場合は「XAMPP」
- Macの場合は「MAMP」
どちらもweb開発環境を立ち上げるために必要なソフトウェアをまとめた(パッケージ化した)もの。 インストールと初期設定を行うだけで、ローカル環境内でWordPressを動かすことが出来るようになります。
2.XAMPPインストール(windows向け)
windowsで、XAMPPをインストールしていきましょう。
1.ダウンロード
https://www.apachefriends.org/jp/download.html を開きます。 「windows向けXAMPP」の中から、一番上もしくは真ん中のバージョンをダウンロードしてください。
ページが切り替わり、自動タウンロードが始まります。 自動ダウンロードされない方は「ここをクリック」をクリックしましょう。
補足:最新より古いものをDLする理由
WordPressが最新版のPHPに対応するには、少しタイムラグがあります。 このため、最新版をDLするとWordPressのインストールができないケースがあります。 (PHPのバージョンは数字が大きいもの、XAMPPのDLページだと下にあるものの方が新しいです。)
WordPressのバージョンとPHPの互換性は、以下をご確認ください。
PHP の互換性と WordPress のバージョン
2.インストール
ダウンロードしたXAMPPインストーラーをダブルクリックします。
ウィルス対策ソフトやセキュリティ設定によっては、下図のようなポップアップが表示されることもあります。Yesもしくは実行を選択してください。
XAMPPのインストーラーが立ち上がります。
Nextをクリックして進めましょう。 インストールしたいソフトウェアを選んでください、という画面に変わります。
初期状態では全てにチェックが入っているはずです。 全てにチェックを入れたまま、Nextをクリックしてください。
XAMPPのインストール先を指定する画面になりました。 デフォルトの「C:\xampp」のままでOKです。 Nextをクリックしてください。
↓
LanguageもデフォルトのEnglishのまま、Nextをクリックします。
“BitNami for XAMPP”の紹介が表示されます。 チェックを入れて「Next」をクリックすると、ブラウザでアプリケーションの紹介ページが開かれます。今回BitNamiは必要ないので、チェックを外してNextをクリック。
インストールの準備が出来ました、という画面になります。 Nextをクリックするとインストールが実行されます。 完了までしばらく待ちましょう。
↓
途中でセキュリティ警告が出る場合があります。 その場合は「アクセスを許可」を選択してください。
インストール完了画面に切り替わりました。
点線部にチェックを入れて「Finish」をクリックすると、XAMPPのコントロールパネルが立ち上がります。続けて設定を行う方はチェックを入れておいて下さい。
次回からのXAMPP起動
XAMPPはインストール時に、自動でデスクトップにショートカットアイコンを作成してくれません。 使用する時にはwindowsのスタートボタンから、「XAMPP」内にあるXAMPP Control Panelをクリックします。
面倒な方はショートカットを作っておいても良いかもしれません。
3.XAMPPの動作確認
XAMPPのコントロールパネルを開いてください。
ApacheとMySQL2つのStartボタンをクリックしてください。
↓
上図のようにApacheとMySQLが動いている状態になったら、 ブラウザを立ち上げてURLバーに「http://localhost 」と入力して開いてみましょう。
下図のような画面が表示されれば、インストールが完了し、正常に起動しています。
次回、WordPressを導入していきましょう。