ローカル環境であればいじり放題
WordPressを使ってサイト運営していると、テーマを変えたくなったり、デザインをいじりたくなったりすることたくさんありますよね?
サイト公開前であれば好きなだけいじっても誰も見てないからよいのですが、公開後となると色々な人が見ている可能性があるので、変更途中のサイトを見られるのはあまりよろしくないですね。
特にテーマを変更するとなるとデザインが崩れてしまうことなんかもあると思うので、調整が色々必要になってくると思います。
そんな時、自分のPCの中に公開中と同じサイトが構築できれば、好きなだけいじってからサイトへ公開なんてことができるようになるわけです。
自分に対しての備忘録をかねてまとめたものを書いておきたいと思います。
ちなみに私はアップル信者のMac派なのでww、これはMac環境前提でのものになります。
MAMPをインストールするところから
WordPressを動かすにはPHPとmysqlが必要になります。
MAMPってやつはそれらがパッケージになっていて、インストールするだけで環境が構築できちゃうっていう便利なものです。
コマンドをうつ必要もないし、画面見ながらできるので、エンジニアじゃなくても抵抗なく進められると思います。
2019年1月の時点での最新は5.2
ダウンロード後、ファイルを解凍してそのままインストールすれば完了です。
インストール後、Mac>HDD>アプリケーション内にMAMPというフォルダができていると思います。
MAMPフォルダ内にMAMPのアプリケーションファイルがあると思うので、そちらをクリックします。
上記の画面が表示されます。
右上にあるapacheとmysqlが緑色になっていると思いますが、起動しているということです。
ここからポートの設定をするのですが、最新のMAMPは設定ボタンが見当たらなかったので、Macの画面上部にあるメニューバーの「MAMP>preference」から設定できます。
この設定は色々なサイトに記載があると思うのでそちらも参考にして
Apache:8888
Nginx:80
mysql:3306
続いてPHPのバージョン
こちらは環境に合わせて設定してください。
ここまででMAMPの設定は完了。
データベースの設定
mysqlが使えるようになったので、Wordpressで使用するデータベースを作成します。
データベースの作成も画面からできるので簡単。
MAMPを起動させるとページが開かれます。
そこからphpmyadminというリンクがあるので、それを開きます。
phpmyadminというのは簡単に言えばコマンドをうったりしなくても、ブラウザ上からデータベースにアクセスできて、新しいデータベースを作成できたり、中身をみれたりするものです。
上がその画面。
ここでWordpress用のデータベースを作成してやればよいということです。
Databasesタブからデータベース名を入力。私は「pnet」としました。
「utf8-general-ci」を選択して作成ボタンをクリックすれば終了。
なんでutf8-general-ciかっていうと日本語を使うならそれにした方がよいってことらしいですw
これで、開発環境用のデータベースが作成されたので、あとはWordpressをインストールするのみです。
WordPressのインストール
インストール作業も簡単です。
公式サイトからWordpressをダウンロードしてきましょう。
最新版は5.x.xになります。
別で書こうと思いますが、最新版の5系は記事の入力がかなり変わっているので、旧バージョンになれている方は「つかいずれ〜w」って最初なると思います。
私もその1人。一応旧バージョンのエディタもあるので、最新版でも問題ないと思いますが、旧バージョンがよい方は以前のバージョンを落としてきましょう。
落としてきたファイルをそのまま解凍。
中身をMAMPの以下のフォルダに格納します。
そのままであれば、
>Applications>MAMP>htdocs
に一式コピー。
複数サイト管理する場合はフォルダ作ってそこに一式いれましょう。
そしてブラウザで以下にアクセス
http://localhost:8888/
すると以下のような画面が表示されます。
クリックすると
言語選択画面。日本語を選択
進めるとデータベース名やらユーザー名やらを入力する画面が出てきます。
データベース名は先ほどphpmyadminで作成したものを入力。
ユーザー名とパスワードは任意のもので。
データベースのホスト名も任意のものなのでそのままでも問題ないです
その後ようこそ画面が出てくるのでサイトの情報を入力しましょう
上記画面になります。ちなみに私はメアド入れ忘れてバリデーションエラー出ているというww
入力後にインストールボタンをクリックであとは待つだけ。
完了したら管理画面へのログイン画面が出てくるので先ほどのユーザー情報でログインしましょう。
これで完成です。
一旦デフォルト状態のWordpressが使える状態になりました。
この後本番環境と同じ状態にする簡単な方法もあるので、別で紹介したいと思います。
まとめ
- Macの場合、MAMPを使えば開発環境が簡単に作成可能
- エンジニアの知識がなくても画面操作で全ていける
- テーマを変えたいとか、新規で構築したい場合は開発環境があった方が何かと便利