MAMPでワードプレスの練習環境を作ろう

テクノロジー

IT系のwebサイト「vitbyte」が出来ました!本業のエンジニアとして活動しています。IT記事はそちらに移転しました。

ワードプレスでウェブサイト等を作る際に、サーバーを借りたりドメインを取得したりします。ですが、その前にワードプレスがどのようなものなのか、実際に使ってみたりしたいですよね。また、既に作っていてウェブサイトを公開している方は、サイトのデザインを変えたりするときに事前にどのように変わるのかをテストしたいですよね。
そのために、ローカル環境(自分のPC内)で、無料に、ワードプレスを使える環境を作りましょう。

どうやって環境を作るの?

ワードプレスを使うためには、PHP実行環境、データベースシステム、ウェブサーバ機能というものが必要です。そのような環境を整えた上で、ワードプレスをインストールすることで使用することができます。しかし、自分で一つ一つ環境を用意するのは、専門知識が無い方にとっては難しい作業になると思われます。
ですので、それらの環境が一つにまとまっていて、簡単に設定してくれるMAMPというソフトウェアをここではオススメします。

MAMPについて

MAMPとは、ApacheやMySQL、PHPなどを構築してくれるソフトウェアです。つまり、ワードプレスを使うために必要な環境を簡単に設定してくれます。ちなみに、MAMPは無料ですが、MAMP PROという便利な機能が追加されている有料版もあります。ここでは無料版の方を紹介します。

MAMPを入手しよう

初めにMAMPを入手しましょう。Googleなどで検索して、MAMPの公式サイトにアクセスしてください。URLは次の通りです。https://www.mamp.info/en/downloads/
①WindowsかMacかを選んで、②Downloadボタンを押します。

ダウンロードが終わったら、インストーラーを起動しましょう。次のような画面が表示されます。ちなみに、私はWindowsでインストールしており、ここではWindows版で紹介します。Macのインストーラーは日本語訳になっているらしい?のですが、Windowsは日本語訳がありません。

MAMPをインストールしよう

起動すると言語の選択画面が出てきます。日本語の選択欄がありませんので、英語のまま進めます。「OK」をクリックしてください。

次の画面ではMAMPをインストールすることに加えて、MAMP PROとApple Bonjourをインストールするかどうかを選択します。
MAMP PROはMAMPの有料版で機能が拡張されています。
Apple Bonjourは、難しい設定をしなくても機器とネットワークを自動的に接続できるようにするソフトウェアです。iTunesなどApple製品をインストールした際に大体一緒にインストールされます。
私はどちらも使用しないので、チェックを外しました。「Next」をクリックして進みます。

使用許諾契約です。問題がなければ、「I accept the agreement」を選択して、「Next」をクリックして進みましょう。

インストール先を選択します。特に変える理由がなければ、このまま「Next」をクリックして進みましょう。

スタートメニューにMAMPの起動やアンインストールのショートカットを追加するかの確認です。特に変更が無ければ、「Next」をクリックして進みましょう。

デスクトップにMAMPの起動のショートカットリンクを作成するかどうかの確認です。
私は作成してほしいので、チェックを外しませんでした。「Next」をクリックして進みましょう。

最後にインストール内容の確認です。内容を確認して「Install」をクリックしましょう。クリックするとインストールが始まります。

インストールが完了すると、このような画面が表示されますので、「Finish」をクリックして画面を閉じましょう。これでMAMPのインストールが完了しました。

MAMPの設定をしよう

それではMAMPをさっそく起動しましょう。デスクトップにMAMPの起動ショートカットのアイコンが作成されていますので、そこから起動しましょう。インストールの中の設定で、起動ショートカットリンクの作成のチェックを外していなければ、作成されています。外した場合は、スタートメニューから起動しましょう。
起動するとこのよう画面が表示されます。真ん中に3つのアイコンが並んでいますが、左から、
①設定を行なう画面を開くアイコン。
②スタートページというものを開くアイコン。
③WEBサーバ(Apache)やDBサーバ(MySQL)を起動/停止するアイコン。これを起動しなければ、ワードプレスが動かないので、ウェブサイトにアクセスできません。

最初に設定を行いましょう。Preferencesをクリックして初期設定画面を開きます。

Start/Stopタブの設定画面です。
①Start servers when starting MAMP:MAMPを起動したときに自動的にサーバを起動します。
②Check for MAMP PRO when starting MAMP:MAMPの起動時にMAMPかMAMP PROのどちらを起動するか選ぶ画面が表示されます。
③At startup open:MAMPの起動時にWebStartページを自動的に開きます。WebStartページにはphpMyAdminなどへのリンクなどが記載されています。
④Stop Servers when quitting MAMP:MAMPを終了したときにサーバを自動的に停止します。
私はStart servers when starting MAMPとStop Servers when quitting MAMPが便利なのでチェックを入れています。
⑤My favorite link:ドキュメントルート内のサブフォルダ名を入力した場合、MAMPで自動的にローカルホスト名とポート番号を補足してくれるので、ポート変更した場合でも、とくにいじる必要はないです。良く分からんという人は無視して大丈夫です。

Portsタブの設定画面です。
ここでは各サーバのポート番号という数字を設定する必要があります。この数字は簡単に言うと、パソコン内からインターネットへ繋がる道がたくさんあるのですが、その道を番号で振り分けたのがポート番号です。つまり、各サーバと通信するときに、どの道を通ってやりとりしますか?を決める番号です。同じ道を指定することはできません。
また、既にパソコン内のソフトやシステムで使っている番号があるので、それも避けて設定しなければなりません。
私は初期設定値のままで設定しています。ちなみにNginxが同じ80番を入力しています。これはApacheと同じWebサーバであり、今回WebサーバはApacheの方を使用し、Nginxは使いませんので問題ありません。

PHPタブの設定画面です。
Standard Version:PHPのバージョンを選択することができます。
Cache:PHPのコードをキャッシュするかどうかを選択できます。ONにするとほんの少しワードプレスの動作が早くなると思ってください。しかし、PHPのコードを変更した際に、その変更がすぐに反映されない場合があります。
私はどちらも初期設定のままです

Web Serverタブの設定画面です。
WebServer:どちらのWebサーバ機能を利用するか選択します。Apacheの方が知名度が高く、実際にサーバをレンタルする場合、大体はApacheを使用していると思います。
Document Root:ドキュメントルートと呼ばれるWebサーバにアクセスしたときに表示される場所を指定します。良く分からん人は初期設定のままで大丈夫です。
私はどちらも初期設定のままです

MySQLタブです。
MySQLのバージョンが表示されます。
設定する箇所は特にありません。

About MAMPタブです。
MAMPのバージョンが表示されます。
設定する箇所は特にありません。

「OK」をクリックして戻ります。これでMAMPのWebサーバの設定は完了です。

MAMPのデータベースを設定しよう

ワードプレスを使用するためにはデータベースが必要です。
ワードプレスをインストールする前の準備としてデータベースを作成しましょう

まずはMAMPでサーバを起動しましょう。
サーバを起動/停止するには、この画面の一番右のアイコンをクリックします。
ちなみに、右上のApache ServerとMySQL Serverの右横に付いている四角のアイコンが、緑色に点灯していればそのサーバが起動していることを表します。

データベースを作成しましょう。
次は2番目のアイコンをクリックしてMAMPのスタートページを開きましょう。

画面上部にあるToolsをクリックしてタブを開き、その中のphpMyAdminをクリックします。phpMyAdminとはMySQLを管理するためのツールです。

phpMyAdmin画面が開きますので、Databasesタブをクリックしましょう。

Databases画面が表示されたら、Create databaseのDatabase nameのところに作成するデータベース名を入力します。好きな名前で良いです。私はワードプレスのデータベースということで、略してwpdbと名付けました。Createボタンをクリックして作成します。

これでデータベースの作成ができました。

次はいよいよワードプレスをインストールします。

ワードプレスをインストールしよう

まずはワードプレス自体をダウンロードしましょう。
次のサイトからダウンロードします。https://ja.wordpress.org/
右上の「WordPressをダウンロード」をクリックします。

ダウンロードページが開きますので、「WordPressをダウンロード」をクリックしましょう。
zipファイルがダウンロードされます。ダウンロードが終わったらzipファイルを解凍しましょう。
解凍するとwordpressというフォルダができます。

解凍したwordpressフォルダをMAMPのドキュメントルートに移動させます。
MAMPの設定でドキュメントルートを初期表示のままの場合は、C:\MAMP\htdocsになっていると思います。

移動が終わったら、ワードプレスのインストール画面にアクセスします。
ブラウザを開いてhttps://localhost/wordpressにアクセスしましょう。
ちなみに、Localhostとは自分自身を指しています。さらにブラウザでURLを入力すると自動的にポート80番を指定します(localhostの後に:をつけて別のポート番号を指定することもできます)。
MAMPの設定でApacheのポート番号を80番に設定したと思います。つまり、このURLは、MAMPのドキュメントルートにあるwordpressにアクセスすることを意味しています。

アクセスするとこのような画面が表示されます。
内容を確認して、「さあ、始めましょう!」をクリックし、進めましょう。
ちなみにデータベースのユーザー名やパスワードも必要と記載されていますが、今まで確認できていません。実はスタートページのMySQLの欄に記載されています。
初期設定ではroot/rootになっています。

データベースに接続するため、各情報を入力していきます。入力が終わったら「送信」をクリックしましょう。

この画面が表示されたら、「インストールを実行」をクリックして進みましょう。

ワードプレスのサイト名や管理者名、ワードプレスのメールアドレスを設定します。
入力が完了したら、「WordPressをインストール」をクリックしてインストールを始めましょう。

成功しました!と表示されれば、以上でインストールは完了です。
ログインをクリックして、ワードプレスを使っていきましょう!
ログイン画面をブックマークしておくと便利です。

これでローカルにワードプレスを動かす環境ができました。
自由に色々試してみましょう!

コメント

タイトルとURLをコピーしました