MACにXAMPP(VM版)をインストールしてWordPress環境を作る手順

ここではMACにXAMPP(VM版)のインストールしてWordPressを導入するまでの手順を紹介してます。

また実際に作業をしている中でいくつか躓きそうな点もありましたので、注意点も交えながら説明します。

作業は次の流れで進めてきます。

  1. XAMPPのインストール
  2. WordPress用DB(データベース)の作成
  3. WordPressのインストール
  4. WordPressの動作確認

XAMPP環境完成後のイメージは次のとおりです。

XAMPP環境の完成イメージ

さっそく進めていきます。

目次

XAMPPのインストール

まず下記のサイトからMAC用のXAMPPをダウンロードします。

https://www.apachefriends.org/jp/index.html

MAC用XAMPPのダウンロード

左側のXAMPP.appアイコンを右側のフォルダにドラッグ・アンド・ドロップします。

アプリケーション一覧にXAMPPが表示されることを確認します。

XAMPPアイコンをクリックしてXAMPPを起動します。

セキュリティ関連の画面が表示されるのでOKをクリックします。

使用しているユーザ名とパスワードを入力します。

XAMPPのコントロールパネル

起動すると次のXAMPPのコントロール画面が表示されるので、「Start」ボタンをクリックします。

XAMPPが起動するとStatusが緑色に変わり、IPアドレスが表示されます。

表示されたIPアドレスにブラウザでアクセスします。

この記事の場合は、URLが「http://192.168.64.2/」となります。
※IPアドレスはあなたの環境のものを入力してください。

下記のようなXAMPPの画面が表示されればXAMPPでWEBサーバーが起動している状態です。

XAMPPインストール時の注意点(WordPressの不具合対策)

XAMPPのWEBサーバー(Apache)の設定を標準のままにしておくと、次に行うWordPressのインストールの際に次のような不具合が発生します。

  • phpMyAdmin(DB管理ツール)にアクセスできない
  • WordPressを正常にインストールできない
  • WordPress上でテーマやプラグイン等のインストール及びアップデートが失敗する現象(具体的には「FTPサーバーを指定してください」と表示される)が発生する

その現象を回避するために、Apacheの設定を下記の通り変更します。

Apacheの設定ファイルの修正

まずXAMPPのコントロール画面で「Volumes」タブを選択し、「mount」ボタンをクリックします。

次に「explore」ボタンをクリックします。

finder画面が開くので以下のファイルをテキストエディタで開きます。

//lampp/etc/httpd.conf

ファイル内の下記の部分を修正して保存して閉じます。

#User daemon ←コメントアウト
#Group daemon ←コメントアウト
User bitnami # ←追加
Group staff # ←追加

ファイルを保存したら次に下記の設定ファイルもテキストエディタで開きます。

//lampp/etc/extra/httpd-xampp.conf

ファイルの下記の部分を修正し保存して閉じます。

<Directory "/opt/lampp/phpmyadmin">
AllowOverride AuthConfig Limit
# Require local ←コメントアウト(左側に#を付ける)
Require all granted # ←追加する
ErrorDocument 403 /error/XAMPP_FORBIDDEN.html.var
</Directory>

次にXAMPPのコントロールパネルでApacheサービスを再起動します。

Apacheサービス再起動後、「http://あなたのXAMPPのIPアドレス/」にアクセスして正常にweb画面が表示されることを確認します。

以上でXAMPPの準備が完了です。

WordPress用DB(データベース)の作成

次にWordPress用のDBを作成します。

下記のURLにアクセスしてphpmyadmin(DB管理ツール)の画面が表示されることを確認します。

http://あなたのXAMPPのIPアドレス/phpmyadmin/

補足

もし下記のようなエラー画面が表示されたら、前手順の「Apacheの設定ファイルの修正」が正しく実施されていない可能性があります。

phpmyadminのエラー画面

phpmyadminのエラー画面

次にDBを新規に作成します。

画面左側の「新規作成」をクリックし、「データベース名」を入力して作成ボタンをクリックします。

[waku]文字コードは「utf8mb4_general_ci」を選択してください[/waku]

新たにDBが作成されますので、次に「特権」-「ユーザーアカウントを追加する」の順にクリックします。

ユーザ追加画面が表示されるので「ユーザ名」、「パスワード」を適当に入力後、「グローバル特権」で「すべてチェックする」にチェックを入れ「実行」をクリックします。

ここでDB名、ユーザ名、パスワードをメモ帳等にメモしておいてください。

以上でDBの作成が完了です。次にWordPressをインストールに進みます。

WordPressのインストール

いよいよWordPressをインストールします。

ドキュメントルートを整理する

まずはドキュメントルートにもともと存在するファイル群を退避します。

標準のドキュメントルートは下記のディレクトリになります。

//lampp/htdocs/

[waku]※ドキュメントルートでの作業は、XAMPPのコントロールパネルからfinder画面を開いて行います。[/waku]

退避の具体的な方法を例えると次の手順になります。

  1. ドキュメントルートにorgフォルダを新たに作成する
  2. 既存のファイル群をorgフォルダに移動する

WordPressをダウンロードする

次に公式サイトからWordPressをダウンロードします。

https://ja.wordpress.com/

「ダウンロード」ボタンをクリックしてWordPressをダウンロードします。

ダウンロードしてきた圧縮ファイル(zip)を展開(解凍)します。

展開したファイル群をXAMPPのドキュメントルートディレクトリにコピーします。

[waku]※ドキュメントルートへのコピーは、XAMPPのコントロールパネルからfinder画面を開いて直接コピーします。[/waku]

WordPressをインストールする

URL「http://あなたのIPアドレス/」にアクセスするとWordPressのインストール画面が表示されますので、「さあ、始めましょう!」をクリックします。

前手順で作成したDBの情報を入力し「送信」をクリックします。

【補足】データベースのホスト名は「あなたのXAMPPのIPアドレス」を入力してください

もし下記のようなDB接続エラーが表示された場合は、DB名やユーザ名、パスワードなどを確認してください。

WordPressインストール時のDB接続エラー

また前手順のApacheの設定が正しくできていない場合は、下記のエラー画面も表示される場合があります。

Apacheno権限設定に伴うエラー

入力したDBの情報に問題が無ければ、下記の画面が表示されますので「インストール実行」をクリックします。

DB情報のチェック完了画面

下記のようこそ画面が表示されるので、WordPressサイトの基本情報を入力して「WordPressをインストール」をクリックします。

WordPressサイトの基本情報設定画面

WordPressサイトの基本情報設定画面

成功しました!と完了画面が表示されればWordPressのインストールが完了となります。

「ログイン」ボタンをクリックしてWordPressにログインします。

WordPressのインストール完了画面

WordPressのインストール完了画面

ここまででWordPressのインストールがほぼ終わりです。

最後にWordPressの動作確認をして終了になります。

WordPressの管理画面

ログイン後のWordPressの管理画面

WordPressの動作確認

WordPressにログイン後、下記の操作が正常にできることを確認します。

  1. WordPressの管理画面にログインできること
  2. 管理画面内で「外観」-「テーマ」から新規にテーマをインストールできること

XAMPP上にインストールしたWordPress管理画面へのログインURLは下記のとおりです。

http://あなたのXAMPPのIPアドレス/wp-login.php

もしくは、

http://あなたのXAMPPのIPアドレス/wp-admin

 

以上で、MACにXAMPPをインストールし、そのXAMPP上にWordPressをインストールする作業が完了になります。

 

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

関連広告

コメント

コメントする

目次