このトピックスで学べること
WordPressのローカル環境作成アプリケーション「LOCAL」を使って、WordPressをローカル環境に立ち上げるまでの手順
LOCALの使い方とWordPressのセットアップ方法
- 「LOCAL」（https://localwp.com/）をダウンロードしたら、画面の表示に従ってインストールを進める
- 「LOCAL」を立ち上げたら「Create A New Site」を押して、WordPressを立ち上げる為に必要な情報を入力する
- ① Setup Site ( What’s your site’s name? )：任意のサイト名を入力
- ② Setup Environment ( Choose your environment )：ローカル環境の設定で、「Preferred」は推奨設定、「Custom」では PHP や MySQL のバージョン、WebサーバのOSの種類が選択できる
- ③ Setup WordPress：WordPressのログイン情報を入力する。ADVANCED OPTIONSからはマルチサイトの設定が可能
- 上記設定後に表示される画面では、「ADMIN」からは管理画面、「VIEW SITE」で先ほど作成したWordPressサイトにアクセスできる
- WordPressの日本語化は「Settings」の「General」内の「Site Languages」で日本語を選択して保存
2サイト目は、画面左下のプラスボタンから追加できる
LOCALで設定・確認できること
- データベースの確認
DATABASE 内の「OPEN ADMINER」「OPEN SEQUEL PRO」どちらからでも確認できる。「OPEN SEQUEL PRO」は「Sequel Pro」が予めインストールされてる人向け。 - SSLの設定
OVERVIEW の SSL の「TRUST」をクリックするとSSL証明書が発行される。WordPressの一般設定で、サイトとWordPressのURLを http:// から https:// へ変更する。 - メールの送受信
UTILITIES にある「OPEN MAILHOG」から確認できる
WordPress の環境をご自身の Mac の中で簡単に立ち上げるソフトウェア「LOCAL」についてご紹介します。画面を共有します。
はい、「LOCAL（https://localwp.com/）」こちらです。WordPress の開発を行う際に自身のパソコンの中において WordPress を（ローカル）環境として動かす必要性があるんですけども、そのためには WordPress を構成する要素である PHP 動かすとか、MySQL をインストールするとか、Webサーバーが必要とか、そういったものがあります。これらがもう一つのパソコンの中で、最初から設定するのはなかなか大変です。というわけで、それらを簡単に WordPress の環境を自分のMacの中に立ち上げるソフトウェアがいくつかあるんですけども、その中でも、今、有力なのがこの「LOCAL」というソフトウェアになります。
実際に今回はこの「LOCAL」のインストールの方法と、そこから WordPress のサイトをローカルに立ち上げるというところまでを一連で行いたいと思います。
まずソフトウェアのインストールは「LOCAL」のサイトに訪れたら、ダウンロードのボタンをクリックします。はい、そしたら「Please choose your platform」っていうふうに出てきますので、ここはMacですね、Macを選びます。で、ご自身の名前を入れてください。 Eメールアドレスですね。入れていただいて、電話番号を入れて設定します。はい、少し時間を飛ばしましたけど、今、ダウンロードが始まりました。DMG ファイルがありますね。こちらをダウンロードして展開してインストールするという流れになります。
先に、名前とメアドと電話番号を入力するという内容がありました。そこはご自身の情報を入れてください。
はい、それではインストールが終わりましたので、クリックして実行します。実行すると DMG ファイルが展開されてマウントされた状態ですね、そしてアイコンが出てくるはずです。出てきました。これをアプリケーションの所に入れるという形ですね。この辺、同じですね。そうするとアプリケーションの中にコピーされるということで、これでインストールが終了となります。はい終了しました。
じゃあ、アプリケーションのとこに行くと「LOCAL」のアプリケーションがありますね。これはダブルクリックして展開します。
はい、しばし待ちます。はい「開きますか？本当にいいですか？」というので「はい、開いてください」っていう形で開きます。
はい、そうすると、最初にまずAgreeするですね、利用規約みたいなものが出てきますので、「I Agree」としましょう。
はい、というわけで、こちら「Turn on Error Reporting」…「エラー送りますか？」っていうことですが、お好きな方を選んでください。先にいろんな、どうしたらいいかとかっていうのが出てきますけども、ここは一旦バツしましょう。で、ここが最初の画面ですね。この内容となります、はい。
じゃあここで、プラスマークを押すのかな？ここも同じですね。「CREATE A NEW SITE」ってので、押してみます。したらどのサイトを作りますかという風に、名前をつけるところが出てきますので、まず名前を。そうですね、今回は「demo」・・・「first WordPress」にしましょうか、「firstWP」という風にしてみたいと思います。そうすると「firstWP」ということで、ローカルのサイト名は「firstwp.local」です。そして「Local Sites」の「firstwp」というところに行いますよ、というふうに出てきます。このままで結構なのでクリックします。はい。
クリックして、そうすると PHP のバージョンやMySQLのバージョンを設定するところが出てきます。こちら「Custom」の所に行くと、 PHP のバージョン変更できたり、 Web サーバーは Apache かnginx か選べたり、データベースも8系か5.7系で選ぶことになります。今回は、そうですね、どれでも多分、大丈夫なんですけど5.7型で、7.4の PHP のバージョンで作ってみまーす。「CONTINUE」。
そしたら、ユーザー名とパスワードを設定するところが出てきます。ローカルなので、まずはひとまず簡単に admin、admin とします。本当は難しいパスワードにしないといけないんですけども、ローカルだからということで、一旦は甘えて admin、admin としてみたいと思います。
あと「ADVANCED OPTIONS」の方には、マルチサイトにするかどうかのセッティングがありますね。今回は普通のサイトにしたいので普通に「No」という風にしておいて、メアドは勝手に割り振られたもので設定をしておきます、で、「ADD SITE」。
ということで、今押しただけで、これで PHP がまずインストールされて、MySQL もインストールされると。すごいことですね。何にもしてないんですけども、ポチ、ポチとするだけで WordPress の環境がここに動き出す準備が行われているということになります。
はい、そうすると Provisioning Services ということで「今、サービスの準備をしていますよ」ということで、今度「Starting Up Site Service」ですね。ここで、パスワードの入力が求められます。パソコンのパスワードを入力して Enter を押します。こうすると WordPress が今度はダウンロードされてインストールが始まるというフェーズへと進みます。
ここでは、最新版の WordPress がダウンロードされて、今作られた PHP と MySQL の環境下においてWordPressが動くように、自動的に設定されるということが行われます。
はい、もう出来上がりましたね。今、飛ばさなかったんですけども、そのまま出来上がりました。
で、今「firstWP」てのが出てきて「1 site running」てことになってます。で、「ADMIN」と「VIEW SITE」があります。「VIEW SITE」をクリックしてみましょう。こうすると、このように、もう、いきなり WordPress のサイトが立ち上がりました。すごいことですね。「firstwp.local」というドメイン、ここは、「localhosts」という技術ですけども、要はこのパソコンの中からだけ「firstwp.local」という所にアクセスすると、このローカル環境にやって来れる、という内容になっています。「Hello World!」の詳細も当然動きますし、日付の一覧だとか、ユーザーの一覧というのにも行けますね。全く問題なく WordPress が動いてるのが分かります。固定ページの開きますね。で、さらにもう一度戻っていただいて「ADMIN」というところをクリックすると、今度はログインページへと行きます。先ほど決めた admin、admin で入れば WordPress の管理画面と進むことが可能です。はい。すごいことですね。で、英語バージョンになってますので、日本語バージョンにする時はこの「Settings」の「General Settings」の中から「Site Languages」ですね、ここを選んで日本語を探します。日本語、ありましたね。ここです。これを選んで保存（Save Changes）を押すと、日本語の「Language Pack」がここの中にさらに設定されて、いつも通り見慣れた日本語のメニューに全てが変わるという内容になります。はい、凄い。
さらにですね、今度は「SSL」っていうのがありますね。で、ここ「TRUST」っていうのをクリックします。したらまたパスワードを望まれますのでパスワードを入力して Enter をすると、すると「TRUSTED」という風になりました。これだけで SSL の証明書が発行されています。ですので、ここも、初期状態であれば「WordPressのアドレス」と「サイトアドレス」、ここを「http:// → https://」と変えてあげて、保存するだけで大丈夫ですね。はい、こうすると一旦ログアウトしますけども、今度はここが証明書付きになってるのがわかるかと思います。「自己署名ルート」っていうことになってますね、ということで、こちらは「オレオレ証明書」と呼ばれるようなものですけども、こちらによって SSL が利用できるということになってます。なので、もう一度 admin、admin でログインすると、今度は先ほどまでは http だったんですけども、今回は https の状態でログインすることができました。これもとても便利ですね。あの要は SSL 環境をローカル環境内に作るのは、またそれはそれで大変なんですけども、そこの部分も自動的にポチ、ポチとするだけで設定してくださる、という内容になってます。
また、こちらなんですけども「DATABASE」というタブにおいては、データベースの確認が可能です。「OPEN ADMINER」ということで、もともとこの「LOCAL」にくっついている PHP MyAdmin のようなものですね。 PHP…、データベースの中身が見れるもの、から見ることもできますし、こちら「OPEN SEQUEL PRO」というものでクリックすると、今度は「Sequel Pro」が開いて、その中身で WordPress のデータの中身が見ることが可能です。こちらはもちろん、先に「Sequel Pro」をインストールしてあることが前提ですけども、このように、データベースの中身を簡単に閲覧することが可能です。
さらにすごいのがこの「UTILITIES」ですね。「UTILITIES」に「OPEN MAILHOG」っていうのがありますけども、こちらへ、メールを確認するためのローカルの環境ということになります。何かというと、こちらにですねメールを送ることで WordPress のローカル環境でメールフォームのテスト等々ができるという事になりますね。これが便利ですよね。例えば EC サイトを作る際に「ちゃんとメールが届いているかな？」とか、そういった事って必ずテストが必要なんですけども、そういった時にもこの「OPEN MAILHOG」が使えますし、もちろん、メールフォームで「メール送信ができるかな？自動返信メールが届いているかな？」ということを確認する際にも、都度都度、普通の本体のメールでですね1回どこかのサーバーにあげてからメールのテストをしなくとも、「LOCAL」の環境だけでメールの確認もできるというわけになります。はい、すごい、便利。
そしてですね、こちら、更にプラスマークを押すことで、いくつでもここにですね、どんどんどんどんと WordPress を追加して行きます。「secondWP」とかってしといて、ここら辺なんでもいいですけどね、えーと「CONTINUE」。それで今度は（PHPのバージョンが）7.3で、nginx で、MySQL 8.0で行ってみましょうか。で、同じように、admin、adiminとしますと。ってことで「ADD SITE」ってやると、今度は環境が変わりまして、 PHP は7.3系、そしてデータベースは8系で WordPress が設定されるということになります。こういう風にすることで PHP のバージョン違いの環境を簡単に設定ができたり、また同様のサイトでも途中で PHP のバージョンも変更できますから、それによって「このバージョンで動くかな？このバージョンで動くかな？」ってことを確認しながら、作業を行うことができます。で、今、出来上がりましたのでまたこれはこれで、「secondWP」が立ち上がってると。
当然、二つとも動かすことができます。なので、「firstWP」と「secondWP」の両方とも動かしながら作業を行うことも可能ですね。まあ～、便利。素敵ですね。
というわけで「LOCAL」の設定と…あ、インストールと、その中で WordPress の動かし方でした。さらにここから先の作業としては、個々の WordPress の入ってる場所ですね、においてテーマをオリジナルで作ってみたり、必要な環境を別の場所から持ってきたりするわけですけど、またそれは次回以降にご紹介するとしてまずはローカル環境が簡単に作れる「LOCAL」のご紹介でした。是非、ご利用なさってみてください 。