基礎知識 2023.07.26

【図解】Local(旧Local by Flywheel)でWordPressローカル環境を手軽に構築

この記事を書いた人

土井 純也

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

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

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

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

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

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

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

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

この記事では「Local(旧Local by Flywheel)」のインストールからローカル環境構築までの手順を、図解でわかりやすく解説していきます!

WordPressでデザイン・機能を変更する場合、直接本番環境で作業すると表示が崩れる可能性や、プラグインなどの機能が動作しなくなるリスクがあります。そこで、このようなトラブルを回避する目的でローカル環境が利用されます。

ローカル環境を構築するツールはいくつかありますが、今回は「Local」を使った方法を紹介します。「Local」はサーバーの知識が不要で、設定手順も比較的かんたんなのが特徴です。特に初心者の方におすすめのツールです。

もし、より開発者向けの機能が充実している「Local」の元になったツールである「Docker」を利用したい、という場合は以下の記事を参考にしてください。
【初心者向け】Dockerとは?概要とWordPress環境を構築する方法

ローカル環境とは?

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

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

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

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

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

WordPressでローカル環境を構築するメリット

WordPressでローカル環境を構築することで、事前にテストを行って問題がないかどうか確認してから本番環境にアップできます。またWebサーバー上にテスト環境を構築するよりもローカル環境のほうが運用が容易です。

ローカル環境を構築するメリットは以下のとおりです。

Webサイトの検証・テストができる

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

また、WordPressで年に数回リリースされるメジャーアップデートや、バグやセキュリティ欠陥(脆弱性)を修正したマイナーアップデート、テーマやプラグインのアップデートなど、各種アップデートのバージョンアップ時には互換性によるトラブルが生じるリスクがあります。

もし公開されているWebサイトでそのような不具合が生じてしまうと、ユーザーに不信感や悪い印象を与えてしまう可能性がある上、不具合が長引いてしまえば結果的に事業における大きな機会損失を招く可能性もあります。

このような事態を防ぐためには、ローカル環境でのテストが役立ちます。ローカル環境で事前にカスタマイズや編集をおこない、エラーや不具合が発生しないことを確認したうえで、本番環境にアップロードしていけば無用のトラブルを回避することができます。

サーバー環境よりも運用が簡単

WordPressの検証などをおこなうテスト環境は、本番環境と同一のWebサーバー上に構築することも可能です。しかし更新の度にファイルをFTPでアップロードする必要があり、テストや確認のため頻繁にファイルを更新したい場合には時間や手間がネックになります。

それに対してFTPソフト不要でファイルを扱えるローカル環境は、サーバー環境よりも運用が容易で効率的です。

WordPress開発者のプロがLocalをオススメする4つの理由

プロがLocalをオススメする4つの理由
Localは、かんたんにWordPressのローカル環境を構築できるツールです。同種のツールとしてはXAMPP(ザンプ)やMAMP(マンプ)が有名ですが、開発者向けで専門知識が必要なため初心者向けではありません。Localは以下の4つの理由から、サーバー設定に不慣れな方にもおすすめです。

無料で利用できる

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

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

Localなら、複数のWordPressをローカル環境に作成できます。

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

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

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

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

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

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

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

起動・動作ともに快適

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

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

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

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

Dockerについて詳しくはこちら

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

Localのインストールは、「アプリケーションをダウンロードする」→「ローカルPCにインストールする」という手順でおこないます。

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

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

最初にLocalの公式サイトにアクセスして、
左下にある「DOWNLOAD FOR FREE」というボタンをクリックします。
「Local」をダウンロード

「Mac」「Windows」「Linax」から、インストール先PCのOSを選択します。
インストール先PCのOSを選択

下の入力項目は「Work Email」(仕事で使うメールアドレス)だけ入力すればOKです。
下の入力項目は「Work Email」

入力を完了して「GET IT NOW!」ボタンをクリックすれば、Localのダウンロードが開始されます。

今回はWindows版を例に見ていきますが、Mac版でも手順はほぼ同じです。

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

Localのアイコン(exeファイル)をダブルクリックすると、インストールが始まります。インストーラーの指示に沿ってインストールします。
「Local」をインストール

「Localを実行」にチェックを入れた状態でインストールを完了すると、Localが起動します。

ローカル環境の初期設定をおこなう

Localの初期設定は、「アカウントを作成する」→「サイト名やサーバー条件を設定する」→「WordPressに入るアカウントを設定する」という手順で行います。

アカウントを設定する

まずLocalアカウントの作成と、利用規約の同意が必要です。最初に表示される利用規約にチェックし、「I agree」ボタンをクリックします。
アカウントを設定する

初期画面が表示されます。「Create a free acount」ボタンをクリックします。
「Create a free acount」ボタンをクリック

デフォルトブラウザが起動してアカウント作成画面が表示されるので、Google/GitHubアカウントまたはメールアドレスでアカウントを新規作成します。

アカウントを新規作成

アカウント画面右上の「Open Local」ボタンをクリックすると、Localアプリに戻ります。ブラウザは開いたままなので、不要であれば閉じます。
ブラウザは開いたままなので、不要であれば閉じます。

最後にエラーレポート送信の同意画面が表示されます。「同意する/しない」のどちらかを選択して初期設定は完了です。
エラーレポート送信の同意画面
この選択はどちらでも問題ありません。

サイト名を設定する

次はローカル環境で使用するWordPressの初期設定をおこないます。
Localの画面に表示されている「Create a new site」ボタンをクリックします。続いて表示される画面の右下にある「Continue」をクリックします。
サイト名を設定する

サイト名を設定する

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

なお、入力欄の下にある「Advanced option」をクリックすると、ドメイン名やWordPressを設置するフォルダの場所等を設定できます。特別な設定が必要でなければ、デフォルトのままで構いません。

サーバー・データベースを設定する

次にサーバーやデータベースの設定を行います。
特に指定がない場合は、「Preferred」のままで大丈夫です。「Continue」ボタンをクリックします。
サーバー・データベースをの設定する

本番環境のサイトと同じ条件に指定したい場合は、「Custom」をクリックすれば以下の項目を設定できます。(※2023年4月時点)

  • phpのバージョン(初期設定は8.1.9)
  • Webサーバーの種類(初期設定はnginx)
  • MySQLのバージョン(初期設定は8.0.16)

WordPressを設定する

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

なお、入力欄の下にある「Advanced options」をクリックすると、マルチサイトの設定ができます。「サブディレクトリ」、「サブドメイン」どちらも対応可能なので、必要に応じて設定します。

入力完了後、右下にある「Add Site」ボタンをクリックします。

設定が完了したことを確認する

おめでとうございます!
以下の画面が表示されれば、ローカル環境構築は完了です!
スムーズにいけば、初めての方でも10分前後で簡単にローカル環境を作ることができます。

WordPressの管理画面を見たい場合は、Localの管理画面から「WP Admin」ボタンをクリックします。サイトURLは「(http://サイト名.local)の後に「/wp-admin」です。

「Open site」ボタンをクリックすると、今立ち上げたサイトがブラウザで確認できます。URLは「http://サイト名.local」です。

設定が完了したことを確認する

サイトのストップ・リスタート

Localでは、サイトを稼働し続けるとCPUに負荷がかかります。そのため、必要のない時はサイトを止めておきましょう。

サイトをストップするには、Localアプリを閉じるか、Localの管理画面右上にある「Stop site」ボタンをクリックします。
サイトのストップ・リスタート

「Local」でWordPressの設定をおこなう

ローカル環境で使用するWordPressの設定は、「言語・タイムゾーン・などの基本設定をおこなう」→「停止/開始などの基本操作やURL共有などの便利な操作を確認する」という手順で行います。

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

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

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

記事投稿時間などに関係するため、一緒に「Timezone(タイムゾーン)」も「Tokyo」に設定します。
管理画面から変更

画面下部の「Save Changes」ボタンをクリックして変更を保存すると、変更が反映されます。

ファイルを直接編集する

single.phpなどのテンプレートファイルを直接編集することもできます。
Localのサイト名の下にある「Go to site folder」をクリックすると、ファイルを保存しているディレクトリが開きます。
ファイルを直接編集する

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

  • Macintosh HD/ユーザ/(ユーザー名)/Local Sites/(サイト名)/app/public/
  • C:\Users\(ユーザー名)\Local Sites\local-test

ここから、phpやcssのファイルをテキストエディターなどを使って編集します。

SSLを設定する

SSLも簡単に設定できます。Localの管理画面上で「SSL」欄の「Trust」をクリックします。少しわかりづらいですが、「TRUST」が「TRUSTED」に変わっていればSSL設定は完了です。
SSLを設定する

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

サイトを追加する

新しいサイトを追加したい場合は、右下の「+」ボタンをクリックします。
サイトを追加する

サイト名の設定画面が開きますので、一つ目のサイトを登録した時と同じ手順で登録します。

サイトを削除する

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

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

【便利機能】サイトを他者と共有する

ローカル環境は、その名のとおり自身のローカルPCにある環境なので、他の人に内容を共有できません。しかしLocalの「Live Link」機能を使うと、ローカル環境上のWebサイトを他者と共有できます。

Live Link機能はログインした状態で利用できます。そのためログインしていない状態の場合は、Localの管理画面左上にある「Log in to Local」をクリックします。デフォルトブラウザが起動しログイン画面が表示されるので、設定済みのアカウント情報を使ってログインします。ログイン後、ブラウザを閉じてLocalへ戻ります。
【便利機能】サイトを他者と共有する

Localの管理画面下部にある「Live Link」欄の「Enable」をクリックします。
「Enable」をクリック

「Live Link」の下矢印をクリックし、共有に必要な情報を確認します。
共有に必要な情報を確認

本番環境をローカル環境に複製する手順

 
すでにWebサーバー上で公開・運用しているWordPressサイトをローカル環境に複製する場合は、「Localでローカル環境を作成する」→「本番環境・データのエクスポート」→「ローカル環境へインポート」という手順でおこないます。

今回は、すでにローカル環境を作成している前提で、本番環境のWordPress内容を複製する手順を解説します。テーマやプラグインなどWordPressサイト本体のデータと、記事などのコンテンツデータを分けて作業します。

WordPressファイルを複製する

まずWordPressサイト本体のデータを、本番環境からダウンロード&ローカル環境へコピーします。

  1. FTPソフト等で稼働中のWordPressのルートディレクトリをすべてダウンロードする
  2. ローカル環境のディレクトリ(C:\Users\(ユーザー名)\Local Sites\(サイト名))以下のファイルを全て削除する
  3. 2で削除したファイルの代わりに、1でダウンロードしたファイルを流し込む

記事等のデータを複製する

次に、データベースに保存している記事等のデータをエクスポート&ローカル環境へコピーします。本番環境のWordPress管理画面に入り、次の手順で記事データをエクスポートします。

  1. WordPress管理画面の[ツール]_[エクスポート]を表示する
  2. 「すべてのコンテンツ」にチェックが入っていることを確認し、「エクスポートファイルをダウンロード」ボタンをクリックする

ローカル環境のWordPress管理画面に入り、次の手順で記事データをインポートします。

  1. WordPress管理画面の[ツール]_[インポート]を表示するWordPressの下にある「今すぐインストール」をクリックする
  2. インストール完了後、インポーターの実行
  3. 先ほどエクスポートしたファイルを選択し、「ファイルをアップロードしてインポート」をクリック

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

リスク回避のためバックアップを取っておくとよい

本番環境からローカル環境へデータを複製する際には、ファイルのバックアップを取っておくと安心です。作業中に誤ってデータを削除してしまったり、トラブルでファイルが破損してしまったりした場合でも、バックアップがあればスムーズに元の状態にも戻せます。

手作業でバックアップを取る方法のほか、「UpdraftPlus WordPress Backup Plugin」のようにバックアップと復元ができるプラグインの導入も検討することをおすすめします。

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

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

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

WordPress保守・運用のパートナーなら「wp.support」にお任せ!

WordPressサイトを運用していて、以下のようなお悩みはありませんか?

  • 管理画面を使いやすくしたいけれど、カスタマイズする時間や技術がない…
  • サイトのUI/UXを改善したいけれど、自社内では難しい…
  • WordPressサイトを高速化したいけれど、ノウハウがない…
  • セキュリティ対策をしたいけれど、知識のある人材がいない…
  • 日々の業務に追われて、バージョンアップなどの保守業務が放置気味…
  • ちょっとしたトラブルを気軽に相談できる相手が欲しい…

「wp.support」は、WordPressのプロフェッショナル集団によるWordPress保守サービスです。
「セキュリティ対策」「バージョンアップ対応」「定期バックアップ」はもちろん、「電話サポートが無制限」なのでカスタマイズの方法やトラブル発生時にも気軽にプロに相談できます。

既に導入済みのお客様からも、
「些細なことでも気軽に相談できるパートナー的な存在」
「困ったら相談していいんだ、と気持ちが楽になった」
と大変ご好評をいただいています。

WordPress保守・運用のパートナーをお探しなら、ぜひお気軽にお問合せください。

>> wp.supportに無料相談する

バージョンアップが面倒だと思ったら WordPress保守・セキュリティ対策は『wp.support』にお任せ!

wp.support資料

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

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

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

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