WordPressはPHPなどのサーバーサイト言語が必要なため、ブラウザとエディターだけでは動作しません。
この記事では初めてPHPなどを触る人向けに、開発環境を1から構築する方法をまとめました。
Mac・Windowsともに対応する手順ですのでOSを気にせず導入ができます。
WordPress開発環境にはMAMP導入が楽
PHP・データベース(MySQL)を動かせるように、ローカル環境内(自分のPC内)で擬似的にサーバーを立ち上げる必要があります。
Vagrant, Xamp, Dockerなどいろいろな手法で環境構築をすることができますが、WordPressが動く環境がほしいだけであれば、Mac・WindowsともにMAMPという無料ツールを使うのが一番簡単で確実です。
プログラム開発の初心者でも簡単に環境が作れるのでおすすめ。
- MAMPのインストール
- WordPressのインストール
- MySQLデータベースの用意
- WordPressとデータベースの連携
という4段階の手順で環境構築をします。
MAMPのインストール
MAMPのダウンロード
まずは公式サイトのダウンロードページよりMAMPをダウンロードします。

自分が使っているOSに応じたものを選んでください。
Macの場合は、M1チップを利用しているPCなら右側のアイコン、旧来のIntelであれば左側のアイコンを選択する必要があります。
Macの場合はMAMP_MAMP_PRO_◯◯◯◯.pkg
が、Windowsの場合はMAMP_MAMP_PRO_◯◯◯◯.exe
がダウンロードされるはずです。
無料版のMAMPと有料版のMAMP PROの2つを同時にダウンロードしています。
ただし、PRO版はインストールしていても使わなければ料金は一切発生しないので、気にせず操作を進めていってください。
MAMPのインストール
ダウンロードしたファイルをダブルクリックしてプログラムを起動し、画面の案内に沿ってインストールをしていきます。
※これ以降、Macでのスクリーンショット画面で案内していきますが、Windowsの場合も操作は同じです。

右下の「続ける」をクリック。

MAMPの取り扱いなどについて案内が表示されますが、そのまま「続ける」をクリックで大丈夫です。

利用規約も「続ける」でOK。

改めて同意確認が表示された場合も「Agree」で進んでください。

インストール設定の確認画面です。
特別な事情がなければそのまま「続ける」をクリック。

インストール先も変更する必要がありません。
そのまま「インストール」をクリック。

インストールが始まる前に、Touch IDかパスワードで認証が必要です。
Windowsの場合は管理者ユーザーのパスワードを入れるように要求されるはずなので、PCログイン時のパスワードをいれてください。
これでインストール完了です。
MAMPの起動
Macの場合は「アプリケーション」の中にインストールされているはずです。
Windowsであれば、基本的にCドライブの中にあります。

「MAMP」と「MAMP PRO」の2つがありますが、使うのは「PRO」とついていない方です。
クリックして中をみるとグレーのMAMPアイコンがあるので、ダブルクリックして起動させてください。

起動すると次のようなものが表示されるはずです。

右側の「Start Servers」をクリックして、PC内にサーバーを立ち上げます。

少し待つと、右上の「Apache Server」「MySQL Server」のところに緑色のマークがつくはずです。
正常にサーバーが立ち上がったという意味です。
同時に、デフォルトのブラウザで下記のようなページが勝手に開かれるはず。

MAMPのトップページです。
URLに注目してください。http://localhost:8888/MAMP/?language=English
となっているはずです。
通常、WEBサイトを閲覧するときにはhttps://◯◯◯◯.com
のような形をしていますが、今回はドメイン部分がlocalhost:8888
になっています。
ローカルホスト(localhost
)つまり、ローカル環境内で動いているサーバーを参照しているのですね。
ネットワークに繋がなくとも、自分のPC内でサーバーが動くようになり、そのページにアクセスしているという意味です。
今後、WordPressサイトを開発していくときは、かならずこのローカルホスト内で作業をします。
ちなみに、作業を終えたあとは「Start Servers」をクリックすればサーバーは停止できます。

停止すると、もちろんhttp://localhost:8888/MAMP/?language=English
は見えなくなるはずです。
サーバーを立ち上げたまま放置するとPCに負荷がかかるので、必要ないときは止めるようにしてください。
WordPressのインストール
必要なローカル環境が用意できたので、次はWordPressをインストールしていきます。
まずはWordPress公式サイトから本体ファイルのダウンロードを行います。

「WordPress 5.9をダウンロード」ボタンをクリックしてファイルのダウンロードをしてください。
タイミングによって「5.9」の部分が最新のバージョンになっていることがありますが、違っても問題ありません。
ちょっと重いのでダウンロードに時間がかかりますが、そのまま待ちます。
wordpress-5.9-ja.zip
という圧縮ファイルがダウンロードされたので解凍してください。
「wordpress」というフォルダができます。
WordPressが動くために必要なPHP・HTML・CSS・JavaScript・画像ファイルなどの集合体ですが、PHPはサーバー内にいないと動作しません。
MAMPが立ち上げたサーバー内にフォルダ一式を移動させる必要があります。
MAMPというフォルダの中に、htdocs
というフォルダがあるはずです。

htdocsというフォルダ内に入れたものはローカル環境のサーバー内で動くようになるので、「wordpress」フォルダを移動させます。

「wordpress」フォルダの中身は一切変更しないでください。
これでローカル環境にWordPressがインストールされました。
MySQLデータベースの用意
次はWordPressが動くために必要なMySQLデータベースを用意します。
MAMPでサーバーが立ち上がっていることを確認して、http://localhost:8888/MAMP/?language=English
にアクセスしてください。

メニュー「TOOLS」のサブメニューにある「PHPMYADMIN」をクリックしてください。
まずはデータベースにアクセスするためのユーザーを作成します。

タブ「User accounts」に移動し「Add user account」をクリック。

「User name」欄の右側にユーザー名を入れてください。
次の「Host name」は左側のプルダウンメニューを「Local」にします。
自動で右側にlocalhostという文字が入るはずです。
「Password」「Re-type」欄の右側にパスワードを入力します。
2つともに同じものを設定してください。

下の「Global privileges」エリアで「Check all」にチェックを入れます。
ここはアカウントの権限を設定するところで、データベース内で新しくデータを保存したり、更新したり…という各種操作がどこまでできるかを設定します。
単にユーザー名とパスワードを設定しただけだとデータベース内でなんの操作もできないアカウントになってしまうので、今回はWordPressが自由にデータを扱えるように全権限を付与しました。

ページ最下部にある「Go」をクリックして保存します。

緑の枠内に「You have added a new user.」と表示されれば、ユーザー登録完了です。
作成したユーザー情報はのちほど使うので、覚えておいてください。
次にWordPressのデータを保存するための専用データベースを作っていきます。

左サイドバーの「New」をクリックしてください。

左の枠に「wordpress」と入れ「Create」をクリック。
ここで指定した「wordpress」がデータベースの名前になります。
以上でデータベースの作成は完了するので、phpMyAdminは閉じてOKです。
WordPressとデータベースの連携
これでWordPressがローカル環境内で動くために必要なものがすべてインストールできました。
ただし、WordPress本体ファイルとMySQLデータベースが連携できていないため、WordPressは正常に動きません。
連携させていきましょう。
ブラウザでhttp://localhost:8888/wordpress
にアクセスします。
MAMPのルートディレクトリ(htdocs
フォルダの中)に「wordpress」というフォルダでWordPress本体を入れたので、http://localhost:8888/wordpress
というURLでアクセスができるんですね。

画面にはデータベースとの接続をするための案内が表示されています。
「さあ、始めましょう!」というボタンをクリックしてください。

データベース名、ユーザー名、パスワードを入れます。
今回はphpMyAdminにてデータベース名は「wordpress」にしました。
ユーザー名・パスワードは自分で設定したものを入れてください。
データベースのホスト名・テーブル接頭辞は変更しなくてOKです。
補足しておくと、今回MySQLはローカル環境(localhost
)に設置しているので、デフォルトのlocalhost
のままで問題ありません。
テーブル接頭辞というのは、データベース内で作成されるテーブルの名前の最初に付与するものを意味します。
今回、MySQLの仕組みについては深く触れませんが、データベースはいわば1つのエクセルファイルのようなものです。
エクセルファイルの中に複数のシートが作れるように、データベース内には複数のテーブルが作られます。
1つ1つのテーブルが「ユーザーデータ」「記事データ」などを管理しています。

テーブルの名前は、WordPressにおいて◯◯_users
、◯◯_posts
などの名前にするルールになっていますが、◯◯_
の部分は自由に設定できるんですね。
だからその◯◯_
を何にしますか、というのが「テーブル接頭辞」という項目です。
今回は何でも構いませんので、デフォルトのwp_
のままにしました。
データベース名、ユーザー名、パスワードが設定できたら「送信」をクリックしてください。
もし入力した内容が間違っていた場合は「データベース接続確立エラー」が表示されてしまいます。

「もう一度お試しください」のボタンを押して戻り、入力し直してください。
正しく入力できた場合は、次の画面が表示されます。

「インストール実行」をクリックしてください。

データベースとの接続ができたので、最後にWordPressサイトの最低限の設定を行います。
サイト名、ユーザー名、パスワード、メールアドレスを入力してください。
サイト名は自由に設定して構いません。
あとから変更もできるので、安心して決めてもらってOKです。
ユーザー名・パスワードはMySQLデータベースで作成したものではなく、WordPress管理画面にログインするためのものを決める部分です。
データベースのアカウントとは別のものを設定しましょう。
なお、パスワードはデフォルトでパスワードが入力されているのでそのまま使ってもOKですし、別のものにしても問題ありません。
ただし、セキュリティ的に弱いパスワードを入れてしまうと注意が表示されます。

最終的に作ったサイトをネット上にアップすることを考えると、パスワードは大文字・小文字・記号などを混ぜた強いパスワードにしておくのがおすすめです。
ただし「脆弱なパスワードの使用を確認」をクリックして次に進むこともできます。
(あまりおすすめはしませんが…)
ちなみに、「検索エンジンでの表示」欄はチェックせずデフォルトのままでよいです。
チェックを入れると、サイト自体がGoogleなどの検索結果にあがらないようにするようHTML側で調整してしまうので、基本チェックを入れることは無いと思います。
入力できたら「WordPressをインストール」をクリック。

これですべての設定が完了したので、ローカル環境内でWordPressを使うことができます。
「ログイン」をクリックすると管理画面に入るためのログインページが表示されるので、先ほど決めたユーザー名とパスワードでログインをしてみてください。

まとめ
MAMPを使うことでより簡単にWordPress環境を作ることができます。
- MAMPのインストール
- WordPressのインストール
- MySQLデータベースの用意
- WordPressとデータベースの連携
という順で開発環境を用意していってください。
コメント