【Mac・Windows対応】WordPress開発環境を構築する方法

WordPress開発環境を作成する方法

WordPressはPHPなどのサーバーサイト言語が必要なため、ブラウザとエディターだけでは動作しません。

この記事では初めてPHPなどを触る人向けに、開発環境を1から構築する方法をまとめました。

Mac・Windowsともに対応する手順ですのでOSを気にせず導入ができます。

目次

WordPress開発環境にはMAMP導入が楽

PHP・データベース(MySQL)を動かせるように、ローカル環境内(自分のPC内)で擬似的にサーバーを立ち上げる必要があります。

Vagrant, Xamp, Dockerなどいろいろな手法で環境構築をすることができますが、WordPressが動く環境がほしいだけであれば、Mac・WindowsともにMAMPという無料ツールを使うのが一番簡単で確実です。

プログラム開発の初心者でも簡単に環境が作れるのでおすすめ。

  1. MAMPのインストール
  2. WordPressのインストール
  3. MySQLデータベースの用意
  4. WordPressとデータベースの連携

という4段階の手順で環境構築をします。

MAMPのインストール

MAMPのダウンロード

まずは公式サイトのダウンロードページよりMAMPをダウンロードします。

Download MAMP & MAMP PRO

自分が使っているOSに応じたものを選んでください。

Macの場合は、M1チップを利用しているPCなら右側のアイコン、旧来のIntelであれば左側のアイコンを選択する必要があります。

Macの場合はMAMP_MAMP_PRO_◯◯◯◯.pkgが、Windowsの場合はMAMP_MAMP_PRO_◯◯◯◯.exeがダウンロードされるはずです。

無料版のMAMPと有料版のMAMP PROの2つを同時にダウンロードしています。
ただし、PRO版はインストールしていても使わなければ料金は一切発生しないので、気にせず操作を進めていってください。

MAMPのインストール

ダウンロードしたファイルをダブルクリックしてプログラムを起動し、画面の案内に沿ってインストールをしていきます。
※これ以降、Macでのスクリーンショット画面で案内していきますが、Windowsの場合も操作は同じです。

MAMPインストーラー

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

MAMP 大切な情報

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

MAMP 利用規約

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

MAMP 同意確認

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

MAMP インストール先

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

MAMP インストール確認

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

新しいソフトウェアをインストールしようとしています。

インストールが始まる前に、Touch IDかパスワードで認証が必要です。
Windowsの場合は管理者ユーザーのパスワードを入れるように要求されるはずなので、PCログイン時のパスワードをいれてください。

これでインストール完了です。

MAMPの起動

Macの場合は「アプリケーション」の中にインストールされているはずです。
Windowsであれば、基本的にCドライブの中にあります。

MAMP, MAMP PRO

「MAMP」と「MAMP PRO」の2つがありますが、使うのは「PRO」とついていない方です。

クリックして中をみるとグレーのMAMPアイコンがあるので、ダブルクリックして起動させてください。

フォルダのリスト

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

MAMP OFF

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

MAMP ON

少し待つと、右上の「Apache Server」「MySQL Server」のところに緑色のマークがつくはずです。
正常にサーバーが立ち上がったという意味です。

同時に、デフォルトのブラウザで下記のようなページが勝手に開かれるはず。

Welcome to MAMP

MAMPのトップページです。

URLに注目してください。
http://localhost:8888/MAMP/?language=English となっているはずです。

通常、WEBサイトを閲覧するときにはhttps://◯◯◯◯.comのような形をしていますが、今回はドメイン部分がlocalhost:8888になっています。

ローカルホスト(localhost)つまり、ローカル環境内で動いているサーバーを参照しているのですね。
ネットワークに繋がなくとも、自分のPC内でサーバーが動くようになり、そのページにアクセスしているという意味です。

今後、WordPressサイトを開発していくときは、かならずこのローカルホスト内で作業をします。

ちなみに、作業を終えたあとは「Start Servers」をクリックすればサーバーは停止できます。

MMAP ON

停止すると、もちろんhttp://localhost:8888/MAMP/?language=Englishは見えなくなるはずです。

サーバーを立ち上げたまま放置するとPCに負荷がかかるので、必要ないときは止めるようにしてください。

WordPressのインストール

必要なローカル環境が用意できたので、次はWordPressをインストールしていきます。

まずはWordPress公式サイトから本体ファイルのダウンロードを行います。

WordPressファイルのダウンロード

「WordPress 5.9をダウンロード」ボタンをクリックしてファイルのダウンロードをしてください。

タイミングによって「5.9」の部分が最新のバージョンになっていることがありますが、違っても問題ありません。

ちょっと重いのでダウンロードに時間がかかりますが、そのまま待ちます。

wordpress-5.9-ja.zipという圧縮ファイルがダウンロードされたので解凍してください。
「wordpress」というフォルダができます。

WordPressが動くために必要なPHP・HTML・CSS・JavaScript・画像ファイルなどの集合体ですが、PHPはサーバー内にいないと動作しません。
MAMPが立ち上げたサーバー内にフォルダ一式を移動させる必要があります。

MAMPというフォルダの中に、htdocsというフォルダがあるはずです。

MAMP内のhtdocs

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

htdocsの中にWordPressを設置

「wordpress」フォルダの中身は一切変更しないでください。

これでローカル環境にWordPressがインストールされました。

サーバー上に置かれたフォルダを「ディレクトリ」と呼びます。
また、サーバーなどの一番上の階層(最初の場所)を特に「ルートディレクトリ」と言います。

今回、htdocsフォルダがMAMPサーバーのルートディレクトリということですね。

MySQLデータベースの用意

次はWordPressが動くために必要なMySQLデータベースを用意します。

MAMPでサーバーが立ち上がっていることを確認して、http://localhost:8888/MAMP/?language=Englishにアクセスしてください。

PHPMYADMINを起動

メニュー「TOOLS」のサブメニューにある「PHPMYADMIN」をクリックしてください。

phpMyAdminは、データベースを管理するためのツールです。

まずはデータベースにアクセスするためのユーザーを作成します。

User accounts

タブ「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でアクセスができるんですね。

WordPressインストール

画面にはデータベースとの接続をするための案内が表示されています。

「さあ、始めましょう!」というボタンをクリックしてください。

データベースとの接続

データベース名、ユーザー名、パスワードを入れます。

今回はphpMyAdminにてデータベース名は「wordpress」にしました。
ユーザー名・パスワードは自分で設定したものを入れてください。

データベースのホスト名・テーブル接頭辞は変更しなくてOKです。

補足しておくと、今回MySQLはローカル環境(localhost)に設置しているので、デフォルトのlocalhostのままで問題ありません。

テーブル接頭辞というのは、データベース内で作成されるテーブルの名前の最初に付与するものを意味します。

今回、MySQLの仕組みについては深く触れませんが、データベースはいわば1つのエクセルファイルのようなものです。
エクセルファイルの中に複数のシートが作れるように、データベース内には複数のテーブルが作られます。
1つ1つのテーブルが「ユーザーデータ」「記事データ」などを管理しています。

データベースの構成

テーブルの名前は、WordPressにおいて◯◯_users◯◯_postsなどの名前にするルールになっていますが、◯◯_の部分は自由に設定できるんですね。
だからその◯◯_を何にしますか、というのが「テーブル接頭辞」という項目です。

今回は何でも構いませんので、デフォルトのwp_のままにしました。

データベース名、ユーザー名、パスワードが設定できたら「送信」をクリックしてください。

もし入力した内容が間違っていた場合は「データベース接続確立エラー」が表示されてしまいます。

データベース接続確立エラー

「もう一度お試しください」のボタンを押して戻り、入力し直してください。

正しく入力できた場合は、次の画面が表示されます。

インストール実行

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

WordPress最低限の設定

データベースとの接続ができたので、最後にWordPressサイトの最低限の設定を行います。

サイト名、ユーザー名、パスワード、メールアドレスを入力してください。

サイト名は自由に設定して構いません。
あとから変更もできるので、安心して決めてもらってOKです。

ユーザー名・パスワードはMySQLデータベースで作成したものではなく、WordPress管理画面にログインするためのものを決める部分です。

データベースのアカウントとは別のものを設定しましょう。

なお、パスワードはデフォルトでパスワードが入力されているのでそのまま使ってもOKですし、別のものにしても問題ありません。

ただし、セキュリティ的に弱いパスワードを入れてしまうと注意が表示されます。

脆弱なパスワードの確認

最終的に作ったサイトをネット上にアップすることを考えると、パスワードは大文字・小文字・記号などを混ぜた強いパスワードにしておくのがおすすめです。

ただし「脆弱なパスワードの使用を確認」をクリックして次に進むこともできます。
(あまりおすすめはしませんが…)

ちなみに、「検索エンジンでの表示」欄はチェックせずデフォルトのままでよいです。
チェックを入れると、サイト自体がGoogleなどの検索結果にあがらないようにするようHTML側で調整してしまうので、基本チェックを入れることは無いと思います。

入力できたら「WordPressをインストール」をクリック。

設定完了

これですべての設定が完了したので、ローカル環境内でWordPressを使うことができます。

「ログイン」をクリックすると管理画面に入るためのログインページが表示されるので、先ほど決めたユーザー名とパスワードでログインをしてみてください。

管理画面へのログイン

まとめ

MAMPを使うことでより簡単にWordPress環境を作ることができます。

  1. MAMPのインストール
  2. WordPressのインストール
  3. MySQLデータベースの用意
  4. WordPressとデータベースの連携

という順で開発環境を用意していってください。

WordPress開発環境を作成する方法

この記事が気に入ったら
いいね または フォローしてね!

SHARE
  • URLをコピーしました!

コメント

コメントする

目次