初心者必見!ローカル環境でWordPressを動かす方法(MAMP)

公開日:2016/02/27
更新日:
Web制作,WordPressの使い方

unspecified

こんにちは。

自分のブログを作ったり、何か情報を発信するためにWordPressを使っている方は多いかと思います。自分もWordPressでブログを作りたい!なんなら、メディアとか作ってみたいという人はいるのではないでしょうか。そんな時、どうやって、それらを作る環境を構築するのでしょうか。

この記事では、MAMPを使ってローカル環境を構築し、その上でWordPressを動かしてブログ記事を投稿できるまでを紹介したいと思います。(今回の環境は、Mac OS X El Capitan バージョン10.11.2を使用しています)

MAMPとは

WordPressを動かすには、PHPやWebサーバ、データベースを用意しなければいけません。これを自分で個別にインストールしたり環境を構築したりするのは、面倒で難しかったりします。そこでMAMPを使います!

MAMPは、Macintosh, Apache, MySQL, PHP を省略した名前のことで、これらを一括で簡単にインストールできるようにパッケージングしてあります。

公式サイトからMAMPをインストールしてアプリケーションフォルダにドラッグ&ドロップするだけで、環境構築に必要なPHP、Apache(Webサーバ)、MySQL(データベース)を簡単にインストールすることができます。

MAMPをインストール

それでは、MAMPをインストールしてみましょう。
まずは、公式サイトにあるダウンロードボタンをクリックしてインストーラーパッケージを落としてきます。
mamp_official

ダウンロードしたインストーラーを起動してください。

mamp_package

そうすると、MAMPのインストールが始まるので、説明に沿って進めてください。

この画面が表示されれば、MAMPのインストールは成功です!
mamp_install_finished

MAMPの初期設定

先ほどインストールしたMAMPを立ち上げましょう。
立ち上げると以下の画像のような画面が表示されるので、歯車マークの設定ボタンをクリックしてください。

mamp_menu

ポートの設定

それでは、まずポートと書かれているタブをクリックしてください。
初期設定では
・Nginxポート:「 7888 」
・MySQLポート:「 8889 」
になっているかと思います。

それを以下の画像のように
・Apacheポート:「 8888 」
・Nginx ポート:「 80 」
・MySQLポート:「 3306 」

に変更してください。変更し終わったら、「 OK 」をクリックしてください。
mamp_port_cnf
これで、ポートの設定は終わりです。

PHPのバージョン設定

それでは、PHPと書かれているタブをクリックしてください。
初期設定では、PHPの標準バージョンが「 7.0.0 」になっているかとおもうので、
それを、画像のように「 5.6.10 」に変更してください。

mamp_php_v
変更できたら、「 OK 」をクリックしてください。
これでPHPバージョンの設定は終了です。

※MAMPのインストール時期によっては、表示されるPHPの標準バージョンが画像のものと違う場合があります。その場合は、5.6系に近いものを選んでください。

MAMPを起動&PHPの動作確認

それでは、設定は完了したのでMAMPを起動してみましょう。
「 サーバを起動 」ボタンをクリックします。以下の画像のように2つのボックスが緑色になっていれば、正常にサーバが起動されています!

mamp_server_start_check
次にPHPが動いているかを確認していきます。
確認の方法としては、ドキュメントルートにPHPファイルを置いて、ブラウザから正しく表示されているかをチェックします。

まず、MAMPのドキュメントルートは以下の通りです。
パス: Macintosh HD > アプリケーション > MAMP > htdocs

もし、分からない場合は以下の画像にある、右矢印ボタンをクリックすると「 htdocsフォルダ 」に飛ぶことができます!

mamp_web_server

htdocsフォルダが見つかったら配下に
test.phpというファイルを作成し、以下のようにPHPのコードを書いて保存します。

<?php
echo ‘PHPの動作テストです’;

htdocs_testphp

保存し終わったら、ブラウザより確認します。
ブラウザのアドレスバーに
localhost:8888/test.php と入力してください。
そして、以下の画像のように、
「 PHPの動作テストです 」と表示されれば正しく動作しています!
php_test

これで、MAMPの起動&PHPの動作確認は終わりです。

WordPressとは

ご存知の方も多いかと思いますが、簡単に説明しますと、
無料で提供されているブログシステムのことで、簡単に自分だけのブログを作ることができるアプリケーションです。

WordPressをインストール

それでは、WordPressをインストールしましょう。
まず、公式サイトより、Zipファイルをダウンロードします。

wordpress_official

先ほどダウンロードしたWordPressのZipファイルを展開すると、
「 wordpress 」というフォルダが出てきます。

zip_open

次は、「 wordpressフォルダ 」の中身を
先ほどPHPの動作確認をした 「 htdocs フォルダ」の配下にコピーします。
その際、先ほど作成したtest.phpは必要ないので削除して構いません。

wordpress_content

これでインストール作業は終わりです。

データベースの作成

WordPressは、データベースを使って、ユーザーが書いたブログ記事を保存しています。なので、WordPressで利用するデータベースの作成をしていきましょう。

まず、ブラウザのアドレスバーに
localhost:8888/phpmyadmin
と入力してください。
そして、以下のような画面が表示されれば成功です。

create_db

次に、上の画像にあるように、「 NEW 」をクリックして、新しいデータベースを作成していきます。

dbname

上のような画面になるので、
データベース名: wpdb
照合順序: utf8_general_ci
を選択して、作成ボタンをクリックするとデータベースが作成されます。

以下の画像のように、
左側のデータベースのリスト部分に
「 wpdb 」表示されていれば成功です!

created_db

これで、WordPressを動かす準備は整いました!
次は、初期設定を行っていきましょう!

WordPress初期設定

ブラウザのアドレスバーから
localhost:8888
にアクセスすると、以下のような画面が表示されます。

wp_first

「さあ、始めましょう!」をクリックして、WordPressの設定をしていきましょう。

次の画面に進むと、
・ データベース名
・ データベースのユーザー名
・ データベースのパスワード名
・ データベースのホスト
・ で=食べ=すの接頭辞
を入力する画面が表示されます。

以下のように、同じように各入力欄に入力してください。

wp_input_dbcnf

説明すると、データベース名には、先ほど作成したデータベース名を入力します。

ユーザー名は、MySQLに初めから作成されている「 root 」というユーザー名を入力します。

パスワードには、ユーザー「 root 」に初めから設定されている「 root 」というパスワードを入力してください。データベースのホスト名は、「 localhost 」のままで結構です。テーブル接頭辞も、「 wp_ 」で結構です。これは、テーブルを作成するにあたり、各テーブル名の先頭に付けられるものです。

入力が終わりましたら、送信ボタンをクリックしてください。すると、以下のような画面が表示されます。

wp_install

この画面が表示されれば、インストール準備が整ったということになります。
それでは、「インストール実行」ボタンをクリックしましょう!

「インストール実行」をクリックすると、以下のような画面が表示されます。

wp_user_info

この必要情報については、自分好みに入力していただいて構いません。
・ サイトのタイトル
・ ユーザ名 (半角英数字、スペース、下線、ハイフン、ピリオド、@ のみ利用可能)
・パスワード (忘れないように、覚えておいてください!)
・メールアドレス
を入力できましたら、「 WordPressをインストール 」をクリックしましょう!

「 WordPressをインストール 」をクリックすると、
ユーザー名 と パスワード(伏せ字)で表示されます。

「 ログイン 」ボタンをクリックしてログイン画面より、
先ほど登録した、ユーザー名、パスワードを入力してログインしてください!

wp_login

ダッシュボード画面が表示されれば、ログイン成功です!

wp_dashboard

これで、ローカル環境にWordPressを動かすことができました!
おめでとうございます!!

記事を投稿してみる

最後に自分で作ったブログから記事を投稿してみましょう!
メニューより「 投稿 」の「 新規追加 」をクリックしてみましょう!

wp_post_menu

すると、新規投稿画面が表示されるので、
投稿記事のタイトルと本文を入力してください。
入力し終えたら、「 公開 」ボタンをクリックすれば公開されます!

wp_new_post

公開し終えたら、パーマリンクをクリックします。
すると、どのように投稿したものが表示されているか確認することができます!

blog_display

最後に

いかがだったでしょうか?
普段から何かをインストールしたり、何かのブログシステムの設定をしてないと難しく感じた方もいらっしゃるかもしれません。僕も初めてMAMPやPHP、WordPressを使い始めた頃は、よく分からず挫折しかけたことが何度もありました。

やはり、環境構築は難しいイメージがあって、挫折もしやすい。そんなように思います。しかし、慣れてしまえば、自分のブログをカスタマイズしたり、PHPのコードを書くのも楽しくなってきます!

この記事が、少しでも環境構築に躓く人の助けになれば幸いです。

この記事が気に入ったら
いいね!しよう

creiveの最新情報をお届けします

この記事を書いた人

木田亮介
1991年生まれ 大阪在住のWebエンジニア。カフェで本を読むのが趣味です。@_ryskit