こんにちはRitsukiです。
今回からある企画をはじめたいと思います。
このサイトを立ち上げてから早いもので半年が経過しました。
こちらの記事がこのサイトの立ち上げたときに書いた立ち上げ記事です。
今以上に稚拙な記事ですね笑
この半年の間で少しずつcssを弄ったりプラグインを入れたりとカスタマイズしたりはしてきましたが、やはりまだ思い通りにできないというのが現状です。
思えばそもそもwordpress自体についてもよくわかっていませんでした。
そこで今回から何回かに渡ってカンタンなwordpressオリジナルテーマをイチから作りながらその構造の理解を深めていきたいと思います。
具体的には
2.wordpressのカンタンなテーマを作る。
という感じで進めていきます。
というわけで今回はその第一弾として「wordpressのローカル開発環境」を作っていきます。
そもそもなんでローカル環境が必要か？
wordpressでサイトを運営していると、違うテーマに変えてみたり、プラグインを導入したり、phpやcssをいじりたくなることがあります。
しかしながらこれらを直接、本番環境(=web上)でカスタマイズをしているとエラーが起きたときに、稼働中のサイトが表示されなくなってしまうということがおきます。
こういった心配をせずに気軽にテーマやプラグインを気軽に試すために「ローカル環境」を整えます。
普通のwebサイトは外部のサーバーに保存されweb上に公開されますが、ローカル環境であればweb上に公開されず、自分のパソコンの中に保存されるため、好きなだけカスタマイズができます。
サーバーにFTPを使ってアクセスする手間も省けるので効率的です。
ローカル環境でちゃんと動作することを確認し、最後に本番環境に適用すれば安心安全にサイトの工事ができますね！
MAMPをインストールしてmac上にローカル環境を作ろう
wordpressのローカル環境の構築ができるフリーソフトはいくつかありますが、僕はmacを利用していることもあり、もともとmac向けに開発された「MAMP」というフリーソフトを利用します。
MAMPとは
・Apache HTTPサーバー
・MySQL
・PHP
の頭文字をとったものです。
wordpressのような動的なサイトを動かすにはwebサーバーやデータベースが必要になりますが、MAMPによってこれらをまとめて構築することができます。
MAMPのインストール
それではMAMPをインストールしていきましょう。
windows用もmac用もあるので自分のOSに合わせてインストールします。
指示通りにサクサクやればインストール完了です。
起動するとこの画面になると思います。
そうしたらまず初期設定を行います。
上のメニューバーから「MAMP>>Preferences」と移動しましょう。
Apache Portの番号を覚えておき、先ほどの画面の「start servers」をクリックします。
Apache serversとMySQL serversが点灯していれば成功です。
MAMPの動作確認
次に動作確認をします。
「test.php」というファイルをテキストエディットで作り以下のように記述してみます。
これを「Application/MAMP/htdocs」にいれます。
そして適当なブラウザを立ち上げ、
と入力します。ここでの「8888」に先ほどのApache Portの番号を入力します。
すると
このように表示されるかと思います！
これでMAMPが正常に動作していることがわかりました。もしもエラーを吐く場合はphpのコード等を確認してみるといいでしょう。
WordPressのインストール
次にいよいよwordpressのインストールです。
インストールしたらwordpressファイルの中のファイルをすべてさきほどの「htdocs」に入れておきます。
次にブラウザを立ち上げて、
と入力し、このようなページに移動します。
「新規作成」をクリックし、新たなデータベースをつくります。
データベース名は適当に「wordpress」、照合順序は「utf8_general_ci」(デフォルト)にしておきます。
こうすると左列に新たにwordpressというデータベースができたことが確認できます。
ブラウザで
この画面になるかと思います。
ここからwordpressの初期設定です。「さぁ始めましょう」をクリックします。
2.データベースのユーザー名>>「root」※
3.データベースのパスワード>>「root」※
4.データベースホスト>>「localhost」(デフォルト)
5.データベースの接頭辞>>「wp_」(デフォルト)
と入力します。
※「root」とは初めからからMySQLに作成されているユーザー名とパスワードです。
「送信」をクリックし、インストールします。
WordPress初期設定
ここからは各々タイトル名やメールアドレス、パスワードを設定する画面となるので指示通りに進めるとログイン画面になります。
さぁ、長い長い環境構築も終わりまできました！ログインしましょう！
ログインできました！
長くなりましたが、これにてwordpressローカル開発環境の構築編は終わりです。
これで本番環境を用いずに中身の.phpを好きなだけいじることができるようになりました。
次回からは実際にテーマ作りに入っていきたいと思います。
それでは！
