基礎知識 2023.03.30

10分で完了!WordPressのローカル環境構築なら「Local」

この記事を書いた人

土井 純也

WordPressスペシャリスト・エンジニア/株式会社e2e 取締役 / CTO

1985年北海道生まれ。
200社以上の大手上場企業のWordPressサイトの制作、保守・セキュリティをサポートしている。

【 展開しているサービス一覧 】
■WordPress開発サービス「wp.make
■WordPress保守/運用サービス「wp.support
■WordPressハッキング/緊急復旧対応サービス「wp.rescue
■WordPressバージョンアップ代行サービス「wp.versionup

「WordPressのローカル環境が欲しい!」

と思った時、エンジニアならXAMPPやMAMPで簡単に構築できるでしょう。
ただ、これらのツールはサーバーの知識がない人からすると、構築手順が難しそうで敬遠されがち。

しかし、非エンジニアのWebデザイナーや一般企業のWeb担当者の人でも、ローカル環境を作りたい場合はあるでしょう。

「サーバーの知識はないけど、簡単にローカル環境を構築したい!」

そんな方にオススメなのが、今回ご紹介する「Local」です。
実際、弊社の非エンジニアのWebディレクターも、「Local」を使って10分かからずにローカル環境を作成し、その簡単さに感動していました。

この記事では「Local」のインストールからローカル環境構築までの手順を解説していきます!

ローカル環境とは?

ローカル環境とは、個人のコンピュータ内に構築した環境のことです。サーバーを経由し、インターネット上で公開される環境を「本番環境」と言い、対の意味で使用されています。

ローカル環境と本番環境の違い

ローカル環境では、Web上で公開することなく開発を行えるため、完成まで外部から見られない状態で構築を進めることが可能です。
本番環境と異なり、サーバーの契約等も不要であるため、費用をかけずに構築をはじめられるのも利点の一つと言えるでしょう。

ローカル環境を活用した一般的な開発の流れは、以下のようになります。

  1. ローカル環境で開発を行い、動作テスト等を行なって問題がないことを確認する
  2. 修正したデータをローカル環境から本番環境に反映させる
  3. データの修正がサイトに反映され、ユーザーがネットを通して見られるようになる

WordPressでローカル環境が必要な理由

WordPressでローカル環境が必要な理由は下記の通りです。

  • テストサイトの検証を行うため
  • WordPressテーマやプラグインをテストするため

それぞれ順番に解説します。

テストサイトの検証を行うため

WordPressを構築するにあたって、PHPやHTML、CSSを編集してオリジナルのデザインや機能を実装する方は多いでしょう。しかし、構築段階でエラーが発生したり、レイアウトが崩れてしまうケースはよくあるものです。

公開されているWebサイトに不具合が生じていれば、ユーザーに不信感を抱かせる可能性があります。

ローカル環境でカスタマイズや編集を行い、エラー等が起きないことを確認してから本番環境にアップロードするという流れで進めれば、このような事態が起きるリスクを減らすことが出来ます。

このようにWebサイトをテストする際にローカル環境は、非常に大きな役割を果たしています。

WordPressテーマやプラグインをテストするため

WordPressは年に数回メジャーアップデートがリリースされるほか、バグやセキュリティ欠陥(脆弱性)を修正したマイナーアップデートやプラグインのアップデートも頻繁にリリースされるため、その都度機能が追加・修正されたりセキュリティ面の強化が行われたりします。

その中で、WordPress本体やテーマ、プラグインの互換性が無くなることにより、バグやエラーといった不具合が発生するケースも少なくありません。

もし本番環境で予期せぬ不具合が発生した場合、先述したカスタマイズ時と同様に、ユーザーに不信感を与えてしまう可能性があるのです。

WordPress本体のアップデートによって不具合が発生するケースも少なくありません。

不具合によってWebサイトを正常に使用できなくなると、ユーザーの不信感の原因となったり、事業における大きな機会損失を招いたりしてしまいます。

このような事態になることを防ぐためにも、必ずローカル環境でWordPressテーマやプラグインをテストしましょう。

WordPress開発者がLocalをオススメする理由4選

WordPress開発者の私がLocalをオススメする理由は、下記の通りです。

  • 無料で利用できる
  • 環境を複数作ることができる
  • 初心者でもインストールが簡単
  • 起動・動作ともに快適

それぞれ順番に解説します。

無料で利用できる

無料であることは、説明がいらないほど大きなメリットですね。
PHPバージョンの変更など、複数環境の構築、その他の様々な機能も全て無料で使えるので有難いです。

環境を複数作ることができる

Localを使用することで、複数のWordPressをローカル環境に作成できます。

複数のWordPressを作ることによって、WordPressのバージョンごとにプラグインの互換性を確かめたり、バージョンごとの比較が行えたりするため、非常に便利です。

さらに、WordPressのバージョンだけではなく、MySQLやPHPのバージョンも変更もできるため、非常に多様な環境での検証を行えます。

また、仮想サーバーの内部環境を柔軟に変えられることから、どのような環境でも正常に動作するWordPressのWebサイトを構築することも可能です。

環境によらず正常に動くWebサイトを制作する上で、非常に有用な機能を兼ね備えているといえるでしょう。

初心者でもインストールが簡単

Localは初心者でも簡単にインストールすることが可能です。インストールの詳細な手順については後述しますが、直感的な操作でインストールから使用までできるため、普段コード(プログラム)を触らない方でも安心して利用できます。

慣れていない方であったとしても、ローカル環境でWordPressを構築し、動作させるまでは10分程度で行うことができるでしょう。

起動・動作ともに快適

こういった開発ツールは、いくら機能が良くても起動に時間がかかったり、動作が重かったりすると、それだけで使う気がなくなってしまいます。

その点、Localは起動も動作も軽快です。

Localは、仮想化ソフトウェアのDocker(ドッカー)をベースに開発されています。

Docker自体も軽快なツールですので、Dockerを元にしたLocalも起動・動作ともにとても良好なため、ストレスなく開発に集中できます。

「Local」のインストール手順

まずは、Localのダウンロードとインストール手順から見ていきましょう。

まずは、Localの公式サイトにアクセスします。
左下にある「FREE DOWNLOAD!」というボタンをクリックします。

1.「Local」をダウンロード

ローカルのダウンロード画面

「Mac」と「Windows」から、希望するOSを選択します。
下の入力項目は「Work Email」(仕事で使うメールアドレス)だけ入力すればOKです。
(以前は、「WordPressで管理しているサイトの数」という項目も必須でしたが、最近の更新で入力欄が削除されました)

OS選択画面

入力を完了して「GET IT NOW!」ボタンをクリックすれば、Localのダウンロードが開始されます。
以下ではMac版を例に見ていきますが、Windows版でも手順はほぼ同じです。

2.「Local」をインストール

ダウンロードしたファイルは圧縮されているので解凍し、アプリケーションフォルダに移動します。

Localのアイコンをダブルクリックすると、下記の画面が表示されます。
特に入力の必要はなく。「LET’S GO!」ボタンを押すとインストールが始まります。

Localの立ち上げ

インストールに若干の時間がかかります。
ローカル環境構築にかかる10分間の中で一番長いのが、このインストールの待ち時間です。

インストールが止まる場合は?

途中でインストールが止まり、ソフトウェアの読み込みに許可を与える必要がある場合があります。
その場合、「システム環境設定」を開き、「セキュリティとプライバシー」をクリック。

プライバシーとセキュリティ

「許可」ボタンをクリックすると、インストールが再開します。

変更の許可

Windows版の場合、ユーザーアカウント制御画面やPCによっては再起動が必要になることもあります。
基本的には指示の通りに作業していけば問題ありません。

ローカル環境の構築手順

ここからは、実際にローカル環境を構築する方法になります。

WordPressサイトをセットアップ

インストールが終了すると、自動的に管理画面が表示されます。
「CREATE A NEW SITE」をクリックします。

Localの管理画面

サイト名の設定

サイト名の入力画面が表示されます。
好きな名前を入力して、「CONTINUE」をクリックします。

サイト名の入力

なお、入力欄の下にあるOPTIONをクリックすると、ドメイン名やWordPressを設置するフォルダの場所等を設定することができます。
よくわからなければ、デフォルトのままで構いません。

サーバー・データベースの設定

次にサーバーやデータベースの設定を行います。
特に指定がない場合は、「Preferred」のままで、「CONTINUE」をクリックで大丈夫です。
Local側で”いい感じ”の設定をしてくれます。

サーバー・データベースの環境設定

テスト元のサイトなどがあって、指定したい場合は「Custom」をクリックすれば、以下の項目を設定できます。

  • phpのバージョン(初期設定は7.17)
  • Webサーバーの種類(初期設定はnginx + Varnish)
  • MySQLのバージョン(初期設定は5.6)

WordPressの設定

WordPressにログインするための「ユーザー名」と「パスワード」を指定します。
WordPress Emailはデフォルトのままで問題ありません。

WordPressのログイン情報入力画面

オプションでマルチサイトの設定ができます。
「サブディレクトリ」、「サブドメイン」どちらも対応可能なので、必要に応じて設定します。
よくわからなければ、スルーでOKです。

入力が完了すれば、右下にある「ADD SITE」ボタンをクリックします。

WordPressサイトにアクセスしよう

おめでとうございます!
以下の画面が表示されれば、ローカル環境構築は完了です!

WordPressサイト立ち上げ完了

スムーズに行けば、初めての方でも10分前後で簡単にローカル環境を作ることができます。

「VIEW SITE」ボタンを押せば、今立ち上げたサイトがブラウザで確認できます。
サイトURLは「http://サイト名.local」になります。

サイトを確認する

管理画面を見たい場合は、Localの管理画面から「ADMIN」ボタンを押すか、サイトURL(http://サイト名.local)の後に「/wp-admin」とつけます。

「Local」の基本的な使い方

WordPressの管理画面からサイトの設定・更新する

管理画面のURL(http://サイト名.local/wp-admin)にアクセスすると、下のようなログイン画面が表示されます。
「WordPressの設定」の項目で設定したユーザー名とパスワードでログインします。

WordPressログイン画面

ログイン直後は言語が英語に設定されていますので、管理画面から変更しておくとよいでしょう。
「Setting(設定)」→「General(一般)」をクリックし、「Site Language(サイト言語)」の項目で日本語を選択します。

ついでにすぐ下のTimezoneの項目もTokyoにしておきましょう。
(記事投稿時間などに関係します。)

言語の変更

画面下部の「Save Changes」ボタンをクリックして変更を保存すると、日本語になります。

ファイルを直接編集する

single.phpなどのテンプレートファイルを直接編集することもできます。
Localのサイト名の下にファイルのパスがあり、右側の矢印マークをクリックするとそのディレクトリを開いてくれます。

ファイルの格納場所

なお、デフォルトでは下記の位置に格納されています。

  • Macintosh HD/ユーザ/(ユーザー名)/Local Sites/(サイト名)/app/public/

上記にWordPressのファイルが展開されています。
ここから、phpやcssのファイルをテキストエディターなどを使って編集します。

既存のWebサイトの中身を移管する

WordPressファイルを移管する

現在稼働中のWebサイトと置き換えたい場合は、以下の手順で実施できます。

  1. FTPソフト等で稼働中のWordPressの構成ファイルをダウンロード
  2. 「/Local Sites/(サイト名)/public/」以下のファイルを全て削除
  3. 削除したファイルの代わりに、ダウンロードしたファイルを流し込み

これでWordPressのテーマやプラグインのデータが移しかえられました。
ただ、投稿ページや固定ページなどの記事データも移す場合は、データベースからデータを移管する必要があります。

記事等のデータを移管する

まず、既存サイトのWordPress管理画面に入り、次の手順で記事データをエクスポートします。

  1. 管理画面のツールからエクスポートをクリック
  2. すべてのコンテンツにチェックが入っていることを確認
  3. 「エクスポートファイルをダウンロード」をクリック

次に、Localで立ち上げたサイトのWordPress管理画面に入り、次の手順で記事データをインポートします。

  1. ツールからインポートをクリック
  2. WordPressの下の「今すぐインストール」をクリック
  3. インストール完了後、インポーターの実行
  4. 先ほどエクスポートしたファイルを選択し、「ファイルをアップロードしてインポート」をクリック

これでテンプレートファイル、投稿記事データともにLocal環境へ移管完了です。

SSLを設定する

LocalではSSL設定も、以下の手順で簡単に行うことができます。

SSL設定を行いたいサイトをクリックし、「SSL」のタブをクリックします。

「Certificate」という項目の「TRUST」というボタンをクリックします。

SSL設定画面

少しわかりづらいですが、「TRUST」が「TRUSTED」に変わっていればSSL設定は完了です。

SSL設定完了後

サイトにアクセスして、URLに「https://」をつけて確認すると、SSL設定が完了していることがわかります。

SSL設定の確認

サイトを追加する

Localでサイトを追加する方法

新しいサイトを追加したい場合は、右下の「+」ボタンをクリックします。
サイト名の設定画面が開きますので、一つ目のサイトを登録した時と同じ手順で登録します。

サイトのストップ

Localを使ってサイトをホストするために、CPUを使用しています。
そのため、必要のない時はサイトを止めておきましょう。

サイトをストップするには、Localアプリを閉じるか、
サイトの管理ページの右上の「STOP SITE」ボタンをクリックします。

サイトの停止方法

サイトを再び使用する場合には、同じ場所に「START SITE」ボタンがあるので、こちらをクリックします。
Localを終了して、再び立ち上げた場合も、使用したいサイトの「START SITE」ボタンをクリックする必要があります。

サイトを削除する

削除したいサイトにカーソルを合わせ右クリックをします。
現れるメニューの一番下に「Delete」があるのでクリックすると確認画面が表示されます。

サイトの削除方法

チェックを入っている状態だと、PCに保存されているファイルも一緒に削除します。
チェックを外すと「Local」上とデータベース上からは削除されますが、ファイルは残ります。

サイト削除時の確認画面

基本的には、チェックが入ったままでOK。
何らかの理由でファイルだけ残したい場合はチェックを外しておきましょう。

「Local」でローカル環境を使いこなそう!

今回は簡単にローカル環境を構築できる「Local」のインストール方法と基本的な使い方を解説しました。

ローカル環境を使えば、テストサイトとして使ったり、新しいテーマやプラグインを安全に試すこともできます。
何より、失敗しても大丈夫というのが嬉しいところ。
テストをしたい時などは、ぜひ「Local」を試してみてくださいね!

WordPressの保守・セキュリティ対策なら『wp.support』 無料の資料DLはこちら

wp.support資料

WordPressのバージョンアップやセキュリティ対策にお悩みではないですか?

面倒な保守・運用作業は全て任せて、コア事業に集中してください。
大手・上場企業100社以上のWebサイトの安全を守る、WordPressのプロフェッショナル集団が、あなたのWordPressサイトを守ります!

【対応範囲】
・WordPress、プラグインのバージョンアップ ・セキュリティ対策 ・継続的なバックアップ ・緊急時の復旧対応 ・技術サポート・電話/メールサポート無制限 etc...

WordPressに関することなら何でもご相談ください!

『wp.support』資料をダウンロードする