【2022年Windowsユーザー向け】XAMPPを使ってWordPresssをインストールする方法を解説


【2022年Windowsユーザー向け】XAMPPを使ってWordPresssをインストールする方法を解説

「WindowsにWordPressをインストールしたいけれどやり方がわからない」

上記のような方に向けて、XAMPPというソフトを使ってWordPressをインストールする方法について解説します。

XAMPPを使うことで、自分のパソコンにWordPressをインストールする環境を作ることができます。

XAMPPの特徴から使い方まで詳しく解説しているので、Windowsを利用していてWordPressをインストールしたい方はぜひチェックしてみてくださいね!

目次
  1. XAMPP(ザンプ)とは
  2. XAMPPをインストールする
  3. XAMPPの初期設定を行う
  4. WordPress用のデータベースを作成する
  5. WordPressをインストールする
  6. WordPressの詳細設定を行う

XAMPP(ザンプ)とは

XAMPPは、WebアプリケーションやWebサイトの構築に必要なソフトがまとめられているソフト。
XAMPPという名前は下記のように、まとめている各ソフトの頭文字をつなげたことが由来となっています。

  • cross-platform:クロス(X)プラットフォーム
  • Apache;サーバー
  • Maria DB:データベース
  • PHP:プログラミング言語
  • Perl:プログラミング言語

クロスプラットフォームとは、WindowsからmacOSまで異なる開発環境でも利用できるシステムのことです。クロスプラットフォームのクロスを(X)として各ソフトの頭文字を並べるとXAMPPになります。

WordPressのローカル環境を作るには、下記3つのソフトが必須になります。

  • サーバー:WordPressで作ったサービスを提供するコンピューター
  • データベース:記事や個人情報などのデータを保存する場所
  • PHP:WordPressのシステムを構築しているプログラミング言語

XAMPPを使うと、WordPressのローカル環境に必要なソフトを一括で利用できます。各ソフトを別でインストールする手間が省けるので、初めてローカル環境を作る方におすすめのソフトです。

XAMPPをインストールする

XAMPPをインストールする - オンラインプログラミングスクールならコードキャンプ

トップ画面にある「Windows向けXAMPP」という部分をクリックするとダウンロード開始します。

XAMPPをWindowsにDL - オンラインプログラミングスクールならコードキャンプ ダウンロードしたXAMPPデータをクリックすると上記の画面が表示されます。
要約すると「C:\Program Filesには書き込み権限がないのでインストールしないでください」という内容。デフォルトの設定通り進めれば問題ないので「Yes」をクリックしましょう。

XAMPPをWindowsにDL - オンラインプログラミングスクールならコードキャンプ 上記の表示画面も先ほど説明したように「Program Files」にインストールするのは避けるようにという指示。そのまま「OK」をクリックして進みましょう。 XAMPPをWindowsにDL - オンラインプログラミングスクールならコードキャンプ XAMPPのセットアップ画面が表示されるので「Next」をクリックします。

XAMPPをWindowsにDL - オンラインプログラミングスクールならコードキャンプ

続いて、XAMPPにインストールするソフトを選択します。
デフォルトだと全てのソフトにチェックされているので、上記のようにWordPressで使うソフト以外はチェックを外して「Next」ボタンをクリックします。

XAMPPをWindowsにDL - オンラインプログラミングスクールならコードキャンプ XAMPPのインストール場所を設定します。先ほど表示されたように、C:\Program Filesには書き込み権限がないことに注意しましょう。

インストール場所にこだわりがない方は、デフォルト設定のまま「Next」ボタンをクリックします。

XAMPPをWindowsにDL - オンラインプログラミングスクールならコードキャンプ XAMPPの言語設定画面ですが、日本語は選べないのでデフォルトのまま「Next」をクリックします。

XAMPPをWindowsにDL - オンラインプログラミングスクールならコードキャンプ 上記の表示内容は、Bitnami(ビットナミー)というWordPressを簡単にインストールできるソフトを利用するかどうかを指定します。

Bitnamiを利用するとWordPressの管理画面が英語表記になるので、チェックを外して「Next」をクリックしましょう。

XAMPPをWindowsにDL - オンラインプログラミングスクールならコードキャンプ 「Ready to Install」という画面が表示されると、インストールの準備が整った合図です。「Next」ボタンを押すとXAMPPのインストールがスタートします。

XAMPPをWindowsにDL - オンラインプログラミングスクールならコードキャンプ 上記の画面が表示されたらインストール完了。画面上に表示されているチェックボックスを外して「Finish」をクリックしましょう。

XAMPPをWindowsにDL - オンラインプログラミングスクールならコードキャンプ

XAMPPの管理画面が表示されたらインストール完了です。

XAMPPの初期設定を行う

次に、XAMPPのコントロールパネルを使って、WordPressを導入するための初期設定を行います。

コントロールパネルの上部には、XAMPPで利用できるサーバーやデータベースが表示されています。「Start」ボタンで起動し「Admin」ボタンを押すと、起動したソフトの設定をブラウザ上で実行できます。

コントロールパネルの下部には、実行したプログラムの結果が時系列に表示されます。

XAMPPをWindowsにDL - オンラインプログラミングスクールならコードキャンプ まず、画面に表示されている「Apache」と同じ横の並びにある「Start」をクリックしてサーバーを起動します。

XAMPPをWindowsにDL - オンラインプログラミングスクールならコードキャンプ

上記の警告はファイアウォールのアクセス許可を選択する画面。ファイアウォールとは、外部からの不正アクセスやサイバー攻撃を防ぐシステムです。

今回は自分のパソコンにサーバーを入れることで外部と接続しないため、プライベートネットワークのみチェックを入れて「アクセスを許可する」ボタンをクリックしましょう。

XAMPPをWindowsにDL - オンラインプログラミングスクールならコードキャンプ サーバーが無事に起動すると、上記のようにApache部分が緑色へ変化します。
プログラムの実行画面にも「Status change detected: running(ステータスが起動中に変わりました)」と表示されているので、無事起動していることがわかります。

XAMPPをWindowsにDL - オンラインプログラミングスクールならコードキャンプ サーバーの次はデータベースを起動します。MySQLと同じ行にある「Start」ボタンをクリックしましょう。

すると、Apachiを起動したときと同じく、ファイアウォールのアクセス許可を選択する画面が表示されます。

パブリックネットワークのアクセス許可へのチェックを外し、プライベートネットワーク部分のチェックボックスをクリックしてチェックを追加しましょう。最後に「アクセスを許可する」ボタンをクリックします。

XAMPPをWindowsにDL - オンラインプログラミングスクールならコードキャンプ データベースが無事に起動すると、上記のようにApache部分が緑色へ変化します。

WordPress用のデータベースを作成する

MySQLを起動したら、WordPress用のデータベースを作成します。

XAMPPをWordPress用のデータベースを作成する - オンラインプログラミングスクールならコードキャンプ

まず、MySQLの行にある「Admin」ボタンをクリックします。XAMPPではデータベースの設計から管理までブラウザ上で操作できる「phpMyAdmin」というソフトがインストールされているのです。

「Admin」ボタンをクリックすると、ブラウザ上でphpMyAdminの操作画面が表示されます。

phpMyAdminでデータベースを作りワードプレスのxamppを動かす - オンラインプログラミングスクールならコードキャンプ phpMyAdminが表示されたら、ヘッダー左部分の「データベース」ボタンをクリックします。

phpMyAdminでデータベースを作りワードプレスのxamppを動かす - オンラインプログラミングスクールならコードキャンプ 上記の赤枠内に、作成するデータベース名と文字コードを入力します。
右の入力欄に「wptestdb」左の選択欄で「utf8_general_ci」を指定して「作成」ボタンをクリックしましょう。

phpMyAdminでデータベースを作りワードプレスのxamppを動かす - オンラインプログラミングスクールならコードキャンプ 表示画面左のデータベース一覧に、作成したデータベース名が表示されていることが確認できたら完了です。

WordPressをインストールする

XAMPPに導入するWordPressをインストールします。

WordPressをインストールする - オンラインプログラミングスクールならコードキャンプ まず、WordPress公式サイトを開きます。スクロールすると「WordPressをダウンロード」という青いボタンが表示されるので、クリックしてダウンロードします。

WordPressをインストールする - オンラインプログラミングスクールならコードキャンプ 成功すると上記の画像が表示され、画面左下にダウンロードフォルダが表示されます。

WordPressをインストールする - オンラインプログラミングスクールならコードキャンプ zipファイルをダブルクリックで解凍して開くと「wordpress」というフォルダが表示されます。
wordpressフォルダを、xamppフォルダ内にある「htdocks」フォルダ内に配置します。

htdocksフォルダまでの詳細なルートは下記のとおりです。

PC→Windows(C)→xampp→htdocks→ここにwordpressフォルダを指定する。

WordPressをインストールする - オンラインプログラミングスクールならコードキャンプ wordpressフォルダをhtdocksフォルダ内に移動したら、インストールとXAMPPへの設置完了です。

一流デザイナーのスキルが身に付く

無料カウンセリングはこちら

WordPressの詳細設定を行う

最後に、WordPressをブラウザ表示してログイン情報を設定したり、XAMPPのデータベースを紐づけたりと詳細設定を行います。

まず「http://localhost/wordpress」をブラウザに入力します。「http://localhost/」というURLは、先ほどwordpressフォルダを配置したhtocksフォルダ内のデータを表示します。

WordPressの詳細設定を行う - オンラインプログラミングスクールならコードキャンプ

次に、XAMPPで作成したデータベース名、初期設定されているユーザー名とパスワードを入力します。XAMPPでは、ユーザー名が「root」、パスワードは未入力の状態が初期値になります。

データベースのホスト名とテーブル接続詞はデフォルトの状態で、画面左下にある「送信」ボタンをクリックします。

WordPressの詳細設定を行う - オンラインプログラミングスクールならコードキャンプ 上記の画面が表示されたら、データベースの接続とユーザー名、パスワードの入力が無事完了した合図です。「インストール実行」ボタンをクリックして進めましょう。

WordPressの詳細設定を行う - オンラインプログラミングスクールならコードキャンプ 次にWordPressの必須情報を設定します。入力内容は下記の通りです。

  • サイトのタイトル:WordPressで構築するサイトのタイトル
  • ユーザー名:任意のユーザー名を入力
  • パスワード:任意のパスワードを入力
  • メールアドレス:自分のメールアドレスを入力
  • 検索エンジンでの表示:WordPressで作ったサイトの情報を検索エンジンに反映するかどうか

ユーザー名とパスワードは、WordPressにログインする際に利用します。
また、テストのために利用する場合は、検索エンジンでの表示のチェックを外すようにしましょう。

必須情報の入力が完了したら「WordPressをインストール」ボタンをクリックします。

WordPressの詳細設定を行う - オンラインプログラミングスクールならコードキャンプ

上記の画面が表示されると、無事インストール完了です。
最後に、画面左下にある「ログイン」ボタンをクリックしてWordPressの管理画面にログインします。

WordPressの詳細設定を行う - オンラインプログラミングスクールならコードキャンプ

詳細設定のときに指定したユーザー名とパスワードを入力して「ログイン」ボタンをクリックします。

WordPressの詳細設定を行う - オンラインプログラミングスクールならコードキャンプ 上記のようにWordPressの管理画面が表示されると、WindowsへのWordPressのインストール完了になります。お疲れ様でした!


関連記事

だーだい
この記事を書いた人
だーだい
まずは7日間お試し!人気プログラミング講座を無料公開中
オンライン・プログラミングレッスンNo.1のCodeCamp