10分で構築!Macのローカル環境でwordpressを使う方法

WordpressをMacのローカル環境にインストール

https://remublog.net/wp-content/uploads/2019/02/kurohamu04.jpg
ぼく

WordPressを勉強するために、Macのパソコンにインストールしたいよ!

WordPressをローカル環境にインストールする方法なんて、ググればたくさん出てきます。

しかし、自分のやり方と違っていたり、使うツールがバラバラだったりと、自分からするとわかりづらい内容も多いのです。

なので、自身の備忘録もかねて、WordpressをMacOSのローカル環境にインストールする方法をめちゃくちゃわかりやすく解説します。

この記事を踏まえて、Wordpressの勉強の第一歩を進んでください!

WordPressをローカルにインストールする大まかな流れ

WordpressをMacのローカル環境にインストール

まずは、大まかな流れを頭に入れておきましょう。

目標と大まかな流れさえ理解しておけば、ストレスなく進めることができますよ!

MAMPとかMySQLとかってなんのこと?

れむ
れむ

WordPressインストール時しかつかわないから、忘れてOK

難しい単語が並んでいますが、大丈夫です。
要するに、2つダウンロードするものがあって、決められた通りに設定すればOKというだけです。

それでは、具体的な手段に入っていきましょう!

手順1:MAMPのダウンロードと設定

まずはMAMPのダウンロードと設定についてです。

MAMPはこちらの当該サイトからダウンロードできます。
>>MAMPのサイトへ飛ぶ

サイトに飛んだら、MAC用のボタンをクリックしてください。

WordpressをMacのローカル環境にインストール

*画像の左側をクリック

すると、勝手にダウンロードが始まるので、ダウンロードフォルダにでもダウンロードします。
ダウンロードには数分かかるかもしれませんが気長に待ちましょう。

ダウンロードが終わると、ダブルクリックでインストーラーがはじまるので、インストールをします。

れむ
れむ

MAMPのインストールお疲れ様です。
これからMAMPの簡単な設定をしていくよ!

それではMAMPの簡単な設定をしていきます。

まずはMAMPを起動します。

起動時に以下のような画面が表示されたら、あなたのパスワードを入力していただければOKです。

WordpressをMacのローカル環境にインストール

入力成功で以下のような画面になります。

WordpressをMacのローカル環境にインストール

MAMPを洗濯した状態であれば、PC画面の左上のMAMP>Preferencesをクリックできるはずです。

WordpressをMacのローカル環境にインストール

preferencesをクリックすると、MAMPの設定画面を開くことができます。
変更していただきたい設定が2点ほどあるので、そこだけ画像と同じよう変更しておきましょう

Generalを以下のようにチェックを入れておく。

WordpressをMacのローカル環境にインストール

上記のような設定をすることで、MAMPアプリを立ち上げたした瞬間に、MAMPのサービスの立ち上げとMAMPの更新がおこなわれます。

とりあえず、つかいやすくなるような設定なので、このようにしておきましょう。

続いてはPortsについてです。

WordpressをMacのローカル環境にインストール

ここは説明が難しいので割愛です。

脳死で上記の画像のような設定にしてください。
この設定が終わったら、OKを押してくださいね。

微香ですが、MAMPは⌘+QもしくはMAMPから終了することができます。

WordpressをMacのローカル環境にインストール
れむ
れむ

これでMAMPの設定は終了!
次はWorpdressをダウンロード!

手順2:Wordpressのダウンロードと設定

次はWordpressをダウンロードしていきます。

まずはリンク先からWordpressのサイトに飛んでください
>>Wordpressのサイトへ飛ぶ

サイトに飛んで、Wordpressをダウンロードをクリックすると自動でダウンロードが始まります。

保存先はわかりやすいようにデスクトップにでもしてください。

ダウンロードが終わったら、ファイルを解凍します。

れむ
れむ

ダウンロードと解凍が終わったら、MAMPと紐づけておくよ

先ほど立ち上げたMAMPのルートディレクトリを変更して、Wordpressに関連づけます。
画像を見ながら進めていきましょう。

先ほどと同じようにPreferncesを起動

WordpressをMacのローカル環境にインストール

PreferencesからWeb Serverに飛びます。

WordpressをMacのローカル環境にインストール

初期設定はApplications>MAMP>htdocsというフォルダと紐づいています。
つまり、この設定を変更してあげて、今インストールしたwordpressと紐づけてあげれば完了です。

画面の中心、灰色のタブのSelectをクリックしてください。
すると、ファイルを選択できるようになるので、先ほどデスクトップにダウンロードしたwordpressファイルを選択します。

WordpressをMacのローカル環境にインストール

Desktop>wordpressを選択したらOKです。

WordpressをMacのローカル環境にインストール

MAMP上でも変更されていることを確認しましょう。
これで紐づけができました。

れむ
れむ

MAMPを起動しながら、ブラウザをいじっていこう!

この設定ができたら、MAMPを起動します。

WordpressをMacのローカル環境にインストール

一番右、Start Serversをクリック。

WordpressをMacのローカル環境にインストール

緑色になったら成功です。

この状態で、Open WebStart pageをクリック。

WordpressをMacのローカル環境にインストール

すると画像のようなサイトが立ち上がります。
残念ながらまだこのページは使いません。
urlの入力欄にlocalhostと入力してみましょう。

もし今までの過程がうまくいっていれば、以下のような画像のサイトが立ち上がります。

WordpressをMacのローカル環境にインストール

ここでwordpressを始めたいかもしれませんが、ぐっと我慢します。

先に、MySQLの設定をしていきましょう。

手順3:MySQLで設定する

Open WebStart pageで開いたwebページをもう一度開きましょう。

その状態で、下の方をスクロールするとphpMyAdminへ飛べるリンクがあるので、そのリンクをクリックしてください。

WordpressをMacのローカル環境にインストール


すると、以下のような画面が出てきます。

WordpressをMacのローカル環境にインストール

画面の左上、newをクリックして、データベース名をwordpressにしましょう。

WordpressをMacのローカル環境にインストール

すると、新しくwordpressというデータベースが追加されるので、クリックしてください。

WordpressをMacのローカル環境にインストール

次はこのデータベースの情報を少しづつ変更していきます。

まずはphpMyAdminのPrivilegs(特権)の欄をクリックしてください。
その後、Add User account をクリック

WordpressをMacのローカル環境にインストール

すると、ユーザー追加画面へ移動するので、以下のような設定へ変更します。

WordpressをMacのローカル環境にインストール

User Nameは半角で入力してください。
Generate passwardをクリックすれば、強力なパスワードを生成してくれます。

ここで使用したパスワードは後ほど使うので、ひかえを取っておきましょう。

入力が終われば、画面をスクロールしてGOをクリック。

You have added a new user.

というように表示されれば成功です。

れむ
れむ

ここからは、ダウンロードしたWordpressの情報を変更していくよ!

それでは、先ほどダウンロードしたWordpressのコードを変更していきます。
この変更をおこなうことで、PHPMyAdminとWordpressを紐づけていきます。

wordpressを開いたら、wp-config-sample.phpを開きます。

WordpressをMacのローカル環境にインストール

開くと色々見えますが、まずは27行目あたりの設定を変更していきましょう。

WordpressをMacのローカル環境にインストール

これを以下の画像のように変更していきます。

WordpressをMacのローカル環境にインストール

変更するのは、黄色のアンダーラインだけです。”でかこまれている文字のみ変更します。

変更する値を簡単に説明すると

となっています。

それでは、もう少し変更しましょう。
行数50あたりまでスクロールしてください。

WordpressをMacのローカル環境にインストール

すると、黄色で囲った部分にリンクがかいてあるので、そのリンクをコピーしてブラウザで検索してください。

WordpressをMacのローカル環境にインストール

すると、上記のような画面がでてくるので、テキストを全てコピーします。

WordpressをMacのローカル環境にインストール

この黄色で囲った部分をすべて今コピーした内容に変更します。

WordpressをMacのローカル環境にインストール

この作業の意味は、セキュリティ向上のためにおこなうものです。
以上でコードを触ることはないので、⌘+Sで保存して閉じてしまいましょう。

れむ
れむ

お疲れ様!
WordPressをインストールしていくよ!

最後のステップです頑張りましょう!

urlの入力欄にlocalhostと入力してみましょう。
すると、以下のような画面になります。

WordpressをMacのローカル環境にインストール

さぁ始めましょうをクリックしてください。

WordpressをMacのローカル環境にインストール

このような画面になるので、情報を入力していきましょう。
先ほど、wp-config-sample.phpに入力していた内容を入れていただきます。

無事に入力ができていれば、以下のような画面に遷移します。

WordpressをMacのローカル環境にインストール

インストールを実行します。

すると、以下のような画面になります。

WordpressをMacのローカル環境にインストール

ここには、データベースとは全く関係のない情報を入力します。

この画面では、Wordpressで作りたいサイトの名前や、管理するためのユーザー名など、普段から使っているような内容を入力してOKです。

検索エンジンでの表示は、ググった時にサイトが出てく内容にしてもいいか?と聞いています。
ググった時に、サイトが表示されて欲しい人はチェックをせずにお願いします。

あとで変更できるので、とりあえず入力してwordpressをインストールをクリックします。

すると、ログイン画面に飛べるので、先ほど入力したログイン情報を入力します。

WordpressをMacのローカル環境にインストール

今回は、私のユーザー名が入力されていますね。似たユーザー名でTwitterもやっているので、よければフォローお願いします。
>>れむのTwitterをみてみる


ログインに成功すれば、以下のような画面に推移します。

WordpressをMacのローカル環境にインストール

お疲れ様でした!

まとめ

WordPressをローカルに落として環境をつくることは、最初の1回目だけとっても難しく感じてしまいます。

しかし、2回目以降からはどんどん作業ゲーになるので、5分程度で作れるようになりますよ!

これからのWordpressライフ、ぜひ楽しんでください!