Local by Flywheel – Windows PC に WordPress を簡単にインストールする方法

Local by Flywheel,WordPress,開発環境・ツール

こんにちは。ソリューション開発部 情報発信分科会の飯出(いいで)です。

本業であるシステム開発業務の傍ら、このブログや当社採用サイトの維持・管理を一手に引き受けています。あくまでも本業の傍らでの作業ですが、結構楽しみながらやっています。

今回、先日リリースされた WordPress バージョン 4.9 “Tipton” の公開に合わせ、私のローカル環境も一新してみました。ローカル環境があると、ちょっとした修正を気軽に試したりできますし。

WordPress のローカル環境と言えば、XAMPP をインストールした後に WordPress をインストールするという手間が掛かり、面倒くさいですよね。しかし、Local by Flywheel を使うことによって簡単にインストールができるようになりました。

今回はその手順について紹介します。

Local by Flywheel のダウンロード

Local by Flywheel にアクセスし、インストーラーをダウンロードします。サイト上にある「FREE DOWNLOAD!」ボタンをクリックしてください。

インストーラーをダウンロードする。

ポップアップが表示され、Mac または Windows を選択します。私のローカル環境は Windows ですので、ここでは Windows を選択します。その後、Work Email(メールアドレス)と Number of websites(サイト数)を入力し「GET IT NOW!」をクリックします。

OSを選択し、メールアドレスとサイト数を選択・入力してインストーラーをダウンロードする。

すると以下のポップアップが表示され、ダウンロードが始まります。ダウンロードが始まらない場合は、「click here」をクリックしましょう。ダウンロードするファイルサイズは、500MB 程度です。

インストーラーのダウンロードが始まります。

Local by Flywheel のインストール

ファイルのダウンロードが終わったら、インストーラーを起動します。

セットアップ中の画面が表示され、進捗が表示されますので暫く待ちましょう。その後、エラーレポートを送信するかと確認が行われますので、状況に応じて選択をしてください。

Welcome to Local by Flywheel!!

「LET’S GO!」ボタンをクリックしましょう。

インストールが始まります。
  1. VirtualBox(米国オラクル社が提供するフリーの仮想環境作成ツール)
  2. Host Machine
  3. Local Image

の順に、インストールが進みます。途中、Windows のユーザーアカウント制御ダイアログが数回表示されて許可を求められますので、都度「はい」を選択してください。

ローカル環境の作成

インストールが完了すると、以下の画面が表示されます。「+ CREATE A NEW SITE」をクリックして次に進みましょう。

新しいサイトを作成します。

サイト名の入力

まずはサイト名を入力する画面が表示されます。半角英数字でサイト名を入力しましょう。このブログの開発環境を構築していますので、私は devlog.develop と入力しています。ここで入力したサイト名は、ローカルドメインとして利用されます。

なお、日本語のサイト名は、WordPress の設定画面から後程入力します。サイト名の入力が終わったら、「CONTINUE」をクリックしましょう。

サイト名を入力します。

環境構成の選択

次にこれから作成する環境の構成を決定します。「Preferred(デフォルトの推奨環境)」と「Custom(好みにカスタマイズする)」を選ぶことができます。(インストーラーをダウンロードした時期によって、詳細なバージョンなどは変化するでしょう。)

「Preferred(デフォルトの推奨環境)」では、

  • PHP Version: 7.1.7
  • Web Server: nginx + Varnish(Windows 環境で手軽に nginx が構築できる!)
  • MySQL Version: 5.6

がインストールされます。WordPress が動けば問題ない方は、デフォルトの推奨環境で良いでしょう。

Preferred(デフォルトの推奨環境)を選ぶ場合

さて、「Custom(好みにカスタマイズする)」を選択した場合ですが、以下の選択肢となります。

  • PHP Version: 5.2.4~7.1.4
  • Web Server: nginx or Apache
  • MySQL Version: 5.5 or 5.6

この柔軟性は素晴らしいですね!

「Custom(好みにカスタマイズする)」を選択した場合

環境構成の選択ができたら、「CONTINUE」をクリックして次に進みましょう。

アカウント設定

ユーザー名とパスワードを設定します。設定したら、「ADD SITE」をクリックします。

ユーザー名とパスワードを設定する

その後、次の画面が表示されます。この画面は、今後も Local by Flywheel で環境を作る場合に同じユーザー名とパスワードを使うか?と確認をしています。今後も同じユーザー名とパスワードで環境を作るのであれば「SAVE AS DEFAULT」をクリックしましょう。

今後も Local by Flywheel で環境を作る場合に同じユーザー名とパスワードを使うか?

設定を進めている途中で、Node.js に対するユーザーアカウント制御ダイアログが表示されますが、「はい」をクリックして進んでください。

構築完了

設定内容の詳細が記載された画面が表示される

設定内容の詳細が記載された画面が表示されます。既に WordPress 4.9 が反映されていますね!

この時点で、既に構築したサイトの内容を確認することができます。確認するには、「VIEW SITE」ボタンをクリックしてください。

既に構築したサイトの内容を確認する

ブラウザに WordPress の画面が表示されました!

WordPress の画面が表示されました!

WordPress の設定

ここからは WordPress の設定について記載します。

WordPress の管理画面を表示する

先程クリックした「VIEW SITE」ボタンの左側、「ADMIN」ボタンをクリックします。

WordPress の管理画面を表示する

ブラウザに WordPress のログイン画面が表示されますので、アカウント設定で入力したユーザー名とパスワードを使ってログインすると、WordPress の管理画面が表示されます。

WordPress の管理画面が表示された!

WordPress の日本語化

構築直後に表示した WordPress の管理画面は英語版です。まずは、日本語版に変更しましょう。画面左側のメニューから「Settings」→「General」の順にクリックします。

WordPress を日本語版に変更する

「Site Language」を日本語に変更したら、画面を下にスクロールして「Save Changes」をクリックします。

日本語を選択して設定を変更する

これで日本語版になりましたね!

サイトのタイトルを設定する

サイトのタイトルは、サイト名の入力で記載したローカルドメイン名が設定されています。こちらを変更してみましょう。

日本語版に設定した画面と同じです。この画面の先頭に「サイトのタイトル」を入力します。私の場合は、このブログの開発環境として使いますので、「そるでぶろぐ開発環境」と入力しています。入力したら「変更を保存」をクリックします。

サイトのタイトルを変更する

WordPress の画面を確認してみてください。タイトル名が日本語で表示されています。

タイトル名が日本語で表示された!

従来に比べて簡単になったと思いませんか!?

おわりに

このブログや当社採用サイトなど、公開環境ならびにステージング環境を準備していますが、このようにローカル環境も準備しておけばサイトをカスタマイズする時、手軽に作業をすることができます。

また、ローカル環境で十分な動作確認をした後にステージング環境にアップロードすることによって、テーマやプラグインの問題であるか、サーバー環境の問題であるかなど、問題点の切り分けなども効率よく行うことができます。

インストール作業に多少の時間が取られてしまいますが、公開環境を壊してしまうリスクに対して考えれば、その時間は微々たるものです。公開環境を直接カスタマイズしている方、これから WordPress を使ってサイトを構築しようと考えている方、Local by Flywheel を導入してみてはいかがでしょうか。

  • Zabbix Enterprise Appliance
  • 低コスト・短納期で提供するまるごとおまかせZabbix