こんにちはデザインチームオカベです。
自分は開発の人間ではないのですが、WordPress周りを担当する機会が多いため動作確認や追加要件に対応できるようローカル上に開発環境を用意しています。自社オウンドメディア「BiND CAMP」(Webのノウハウ等を扱うブログ)を構築する際などもこちらの方法で行っています。
そこで今回は普段利用しているXAMPP(ザンプ)というツールの導入方法と、WordPressのインストールまで簡単に紹介したいと思います。
WordPressの開発環境(サーバー)の用意
一般的なHTMLとCSS、JavaScriptで構成されたWebサイト、いわゆる静的サイトであれば開発環境として用意するのはブラウザだけで大丈夫ですが、WordPressのように記事の保存やアカウントの管理など、データベースの連携が必要な動的サイトの場合は少なくともデータベースと、プログラミング言語(PHPなど)を処理できるサーバー環境が必要になります。WordPressもこのPHP言語が使用されています。
サーバーの用意といっても物理的に用意するわけではないのでご安心ください。費用もかかりません。
ローカル環境を構築するXAMPPをインストール
XAMPPは、Apache(Webサーバ)、データベース、PHP、データベースの管理ツール(phpMyAdmin)などウェブアプリケーションの実行に必要なものがパッケージングされており、インストールするだけで、すぐに開発が開始でき便利です。
以下はMacの場合の手順です。
XAMPPのダウンロード
「XAMPPのダウンロードページ」から必要ファイルをダウンロードします。
基本的には最新バージョンで大丈夫だと思いますが、利用するWordPressのバージョンによってはPHPのバージョンのズレでうまくいかない場合もありますのでご注意ください。
※ここではWordPressの関係で古いバージョン(5.6.39)を利用しています。過去バージョンはこちらからダウンロードできます。
XAMPPのインストール
ダウンロードできたら、インストーラーを起動し手順に沿ってXAMPPをインストールします。
XAMPP(サーバーとデータベース)の起動
XAMPPを起動し画面上メニュー「Manage Servers」を選択したら画面したの「Start ALL」(またはRestart ALL)をクリックしります。各項目のランプが赤から緑に変われば、正常に起動したことになります。
さらにメニュー「Welcome」から画面した「Go to Application」をクリック(あるいは「http://localhost/dashboard/」にアクセス)、して以下のような画面が表示されれば、より確実に正常動作していることを確認できます。
データベースの作成
次にWordPressを利用するためにデータベースをあらかじめ作成しておきます。
先ほどアクセスしたXAMPPのダッシュボードのメニューから「phpMyAdmin(http://localhost/phpmyadmin/)」にアクセスします。この画面がデータベースの管理画面になり、今後WordPressで作成した記事情報などは全てここで確認できます。
データベースの作成
「データベース」タブをクリックすると現在設定中のデータベース一覧が表示されます。(サイドメニューも同様)
その画面から新しく利用するデータベース名を記入し「作成」ボタンをクリックするとデータベースを新規作成できます。
データベースアカウントの設定・確認
次にWordPressでデータベースを紐づける時に必要な情報を設定・確認しておきます。
先ほどの一覧画面から該当の「Check privileges」をクリック。
そのまま「localhost」の「 Edit privileges」から「ログイン情報」へと遷移すると、このデータベースを利用する時に必要な情報が出てきます。
ただデフォルトではパスワードなどは未設定で、実際使用する時も特に不要なので必要であれば設定してください。
※この先ではパスワードは未設定のまま進めます。
WordPressのインストール手順
WordPressのダウンロード
XAMPPがインストールできたら一旦離れてWordPressを「WordPressのダウンロード」ページからダウンロードします。
※ここではWordPress 4.9.18を利用しています。過去バージョンはこちらからダウンロードできます。
WordPressデータの設置
「アプリケーション」→「XAMPP」→「htdocs」フォルダへと移動しその中で新しくフォルダを作ります。このフォルダ名が開発中に使用するURLになります。
そして作成したフォルダの中に先ほどダウンロードしたWordPressデータを移行させます。
この時、「wp-content」フォルダのアクセス権を全て「読み/書き」にしておくと後々のトラブルが減るかなと思います。
WordPressとデータベースの連携
先ほど移行したWordPressデータの中に「wp-config-sample.php」というファイルがありますので、そちらから-sampleを削除して「wp-config.php」に変更します。
その後ファイルを開き、データベース管理画面で確認したデータベースのアカウント情報を該当箇所(3箇所)に記述します。
保存したらデータベースの連携は完了です。
WordPressのインストール
正しくデータベース連携がされていれば、ブラウザ上で「localhost/〇●〇●」(〇●〇●はWordPressデータを移行したフォルダ名)にアクセスするとWordPressのインストーラー画面が表示されます。
あとは指示に従い進むと、インストールが完了します。
あとはオリジナルのテーマを作成するなり好きにしてください。
追加でWordPressが必要になった際には、またデータベースを作成しWordPressをインストールすることで増やすことができます。