1. ホーム > 
  2. Webサイト制作 > 
  3. WordPressの使い方 > 
  4. WordPressのテスト環境を構築する方法

WordPressのテスト環境を構築する方法

WordPressのテスト環境は、XAMPPというアプリを使えばサーバー構築の経験がない人でも簡単に作ることができます。

  • 2016/3/10
  • 2016/3/10

WordPressのテーマファイルを作ったり、プラグインの動作確認をするには、公開されているWebサイトには影響を与えないテスト環境が必要です。
「テスト環境を作る」というと、本番サーバー以外のサーバーが必要になると思ってしまうかもしれませんが、いま使っているパソコンにサーバー環境を構築して、テスト環境にすることも可能です。

WindowsでもMacでも、手軽にサーバー環境を構築できるアプリがありますので、サーバーを構築した経験のない方でも大丈夫です。

初心者でも手軽にサーバー環境を構築する方法

XAMPPというアプリをインストールするだけで、いま使っているパソコンにWebサーバー、PHP、MariaDB(MySQL派生のデータベース)がインストールされます。

通常のアプリと同じようにインストールできますので、初心者の方であっても手軽にWordPressが動くサーバーの構築ができます。
ここではWindowパソコンにXAMPPをインストールする手順をご紹介します。(Macでも基本的には同様です)

  1. XAMPPをダウンロードXAMPPのWebサイトにアクセスして、それぞれの環境にあったアプリをダウンロードします。
  2. XAMPPのエラーメッセージ例ダウンロードしたファイルをダブルクリックして、アプリのインストールを始めると、こんなウィンドウが開くことがありますが、気にせずに「OK」ボタンをクリックして、インストールを進めます。
  3. Nextボタンをクリックしてインストールを進めるインストールはすべて初期設定で問題ありませんので、どんどん「Next」ボタンをクリックしてインストールを進めましょう。
  4. XAMPPの説明ページを開かない場合はチェックを外すこの画面でチェックを入れたまま「Next」ボタンをクリックすると、Bitnamiのページがブラウザで開きますので、チェックを外して「Next」ボタンをクリックします。
  5. チェックを入れておくと、Finishをクリックした後にコントロールパネルが開くインストール完了画面でチェックを入れたまま「Finish」ボタンをクリックすると、XAMPPのコントロールパネルが開きます。

    コントロールパネルのショートカットは作成されませんのでタスクバーにピン留めしておくなどして、すぐに起動できるようにしておきましょう。

  6. ApacheとMySQLのStartボタンをクリックするコントロールパネルのApacheとMySQLの「Start」ボタンをクリックすると、Webサーバーとデータベースが起動します。

    これでWordPressのテスト環境を構築するサーバーの準備は完了しました。

データベースの設定

いま使っているパソコンにサーバー機能の構築ができたら、次にWordPressで使うデータベースの設定をします。
特別なコマンドを入力する必要はなく、ウェブブラウザを使って設定できます。

  1. グローバルメニューのphpMyAdminをクリックウェブブラウザを起動して、アドレス欄に「http://localhost/」と入力します。すると、XAMPPのデフォルトページが開きますので、右上のリンクから「phpMyAdmin」をクリックします。
  2. Newをクリックする左メニューから「New」をクリックして、新しいデータベースの作成画面を開きます。
  3. データベース名と照合順序を指定してデータベースを作成データベースの名前を適当に入力して、照合順序を「utf8_general_ci」にして、「作成」ボタンをクリックします。ここではデータベースの名前は「wp_test」としました。

これでWordPressのテスト環境を構築する準備は整いました。

WordPressをダウンロードしてインストール

最後にWordPressをダウンロードしてインストールします。

  1. wordPressをダウンロードhttps://ja.wordpress.org/から最新のWordPressのファイル一式をダウンロードして、適当な場所に解凍します。
  2. Cドライブ直下にあるXAMPPフォルダ内にあるhtdocsにWordPressのファイルをコピー解凍したフォルダごと、XAMPPをインストールしたファイル内の「htdocs」フォルダにコピーします。ここでは、解凍した時のフォルダ名「wordpress」のままコピーしました。
  3. さぁ、始めましょうボタンをクリックウェブブラウザでhttp://localhost/wordpress/にアクセスすると、WordPressのインストール画面が表示されますので、「さあ、始めましょう!」ボタンをクリックします。
  4. 作成したデータベースの情報を入力するデータベースへの接続設定を行います。
    データベース名には先ほど作成したデータベースの名前を入力し、ユーザー名には「root」、パスワードは空欄にします。

    それ以外の設定はそのままで大丈夫ですので「送信」ボタンをクリックします。

  5. インストール実行をクリックする無事にデータベースに接続できたら「インストール実行」ボタンをクリックします。
  6. テスト用サイトの情報を入力してWordPressをインストールする最後にWordPressで構築するテストサイトの設定を行います。

    サイトのタイトル、ユーザー名、パスワード、メールアドレスの欄に適当なものを入力します。
    後から修正することができますが、パスワードは忘れてしまうとWordPressにログインできなくなってしまいますので注意しましょう。

  7. インストール完了後、ログイン下画面「WordPressをインストール」のボタンをクリックすると、WordPressがインストールされます。
    これでWordPressのテスト環境が出来上がりました。

WordPressのテスト環境があると、テーマファイルの修正を試してみたり、新しいプラグインの動作を確認したりと、何かと便利です。

XAMPPを使えば簡単にサーバーが構築できてしまいますので、WordPressでWebサイトを運営されている方は、テスト環境も構築しておくことをお勧めします。

(今回は説明を簡便にするために、rootユーザーのパスワードや、データベースに接続できるユーザーの設定などは行っていません。)

Webデザイン・プログラムスキルを身につけたい方におすすめしたいスクール

私もWebスキルを身につけるためにスクールに通いましたが、正直言って「趣味の講座レベルのスクール」が多く、実践的なスキルを身につける事ができるスクールは多くありません。

ただ全くの未経験ではWebを仕事にする事が難しいのも事実。そこでWebの実践的なスキルを身につけられるスクールをご紹介します。

スクールの価格は安くありませんので、まずは無料体験レッスンや無料カウンセリングで体験してみて、良さそうだなと思ったら本格的に取り組む方法をおすすめします。

Webスク(6か月のガッチリ型)

半年間、オンラインとオフラインのカリキュラムで「即戦力」と呼ばれるような人材になるためのスクール。業界の企業を見学するオフィスツアーやIT企業の人事担当との交流会など、現実的なキャリア形成のイメージを作れる機会があるのが良いです。

無料体験レッスンでは、キャリア形成の相談もできます。

WebCamp(1か月の集中型)

こちらは1ヶ月の短期集中型。と言っても、最初のカウンセリングを通してカリキュラムは個人ごとのオーダーメイドなので、自分の都合で学べるのが良いです。

このご時世、直接Web制作に携わらない部署の人もWebに関する知識は必要なので、社会人の方の受講も多いです。

CodeCamp(2〜6か月のカスタマイズ型)

現役エンジニア・デザイナーからマンツーマン指導が受けられるスクールです。内容的には他のスクールにひけはとらないにもかかわらず、オンラインのみなので価格が安いのが良いです。

新卒などの社内研修でも利用されているので、社員のスキルギャップに悩んでいる方にも良いかもしれません。

「役にたった」と思ったらシェアお願いします