ブログ

【簡単】LocalbyFlyWheelの使い方【WordPressローカル環境】

2020-09-12

Local by FlyWheel

Local by Flywheel(ローカルバイホイール)は、WordPressのローカル開発環境を簡単に構築できるソフトウェア。環境構築が簡単で軽く、しかも無料。WindowsとMacどちらでも使用可能です。

似たようなソフトにMAMPがあります。しかし、Local by Flywheelの方が高速で簡単なので初心者やミニマム思考な方にはおすすめです。

今回は、Local by Flywheelのセットアップから、既存サイトを開発環境へコピーする方法まで使い方を網羅的に解説していきます。

この記事の内容
  • Local by FlyWheelの使い方
  • 新規サイトを作成してWordPressにログイン
  • 既存サイトから開発環境にコピー
  • サイトを本番環境にアップロード

Local by FlyWheelでWordPress開発環境をつくる

Local by Flywheelをインストール

公式ページ「Local by FlyWheel」へアクセスし右上の「DOWNLORD」ボタンからダウンロードします。

LocalbyFlyWheel_001

OSを選択し、メールアドレスを入力し、「Get it Now!」ボタンを押すとダウンロードが始まります。※名前や電話番号は不要。今回は、Windows版をダウンロード。

LocalbyFlyWheel_002

LocalbyFlyWheel_003

完了したら、ダウンロードフォルダにある「local-x.x.x-windows.exe」を実行します。※x.x.xはバージョン

LocalbyFlyWheel_004

インストールが完了すると「Welcome to Local by Flywheel!」と出るので「Let's Go」ボタンを押下します。※初回のみ:Virtual BoxとHost Machineの設定

※Windowsだと「このアプリがデバイスの変更を加えることを許可しますか?」と出るので「はい」を選択します。
※MacだとPCユーザーのパスワードを要求されます。

設定が完了すると以下のような画面になります。(※私の画面なので、既にサイトが入ってます。)

LocalbyFlyWheel_005

これでインストールは完了し、左下の+ボタンから新しいWordPressサイトを作成できる状態です。

Local by Flywheelで新規サイトを追加

新規サイトを追加するには、左下の+ボタンを押してください。

LocalbyFlyWheel_005

まずはドメインを入力します。「.com」などのTLD(トップレベルドメイン)は「.local」で固定で付与されるため不要です。
※「ADVANCED OPTIONS」からドメイン、インストールフォルダなど任意に変更できます。
ドメインを入力したら右下の「CONTINUE」で次へ進みます。

LocalbyFlyWheel_011

次は開発環境の選択です。Preferred(優先)を選んでおけばよいです。PHPバージョン等を変更したい場合は、Custom(カスタム)で構築してください。

Custom(カスタム)で変更できる部分
・PHPバージョン
・Webサーバー(Apache・Nginx)
・データベース(MySQL・MariaDB)

右下の「CONTINUE」で次へ進みます。
LocalbyFlyWheel_012

WordPress管理画面のログインアカウントを設定します。ユーザー名とパスワードを入力します。※メールアドレスはデフォルトのままでOKです。後で変更できます。
入力したら右下の「ADD SITE」でインストールを開始します。

LocalbyFlyWheel_013

インストールが完了すると以下の画面になり、WordPressバージョンが表示されれば作成完了です。

LocalbyFlyWheel_014

Local by Flywheelの使い方・初期設定

Local by Flywheelの主な操作方法について解説していきます。

まずは「ADMIN」ボタンから管理画面へアクセスします。
※ブラウザは既定のブラウザで起動するので、ブラウザの拡張機能を使いたい場合は、予め「Google Chrome」をデフォルトにしておくと便利です。

インストール時に設定したユーザー名/パスワードを入力してログインします。

LocalbyFlyWheel_021

初期設定:日本語化

さて、最初にやるべき設定は日本語化です。WordPressはデフォルトが英語になっています。
このままだと読みづらいですし、日本語サイトをつくるなら変えておきましょう。

変更ポイント
・言語設定
・タイムゾーン
・マルチバイト対応

LocalbyFlyWheelの開発サイトを日本語化する方法はこちらで解説しています。

主な操作方法

初期設定が終わったら、Local by Flywheelの画面に戻って操作方法を確認していきましょう。

サイト名を右クリックするとメニューから色々できることが分かる。英語ですが、簡単なので読めるはず。

LocalbyFlyWheel_025

主に使うメニュー
・View Site:サイトを表示
・Admin Dashboard:管理画面を表示
・Show Folder:インストールフォルダを参照
・Restart/Stop/Start:リスタート/停止/開始
・Delete:サイトを削除

VSCodeなどのエディターで開く際は、「Show Folder」からアクセスしてフォルダを開けば、簡単にソース修正が可能です。変更&保存すると即時反映してくれるので楽です。

Local by Flywheelに既存サイトをコピー

既存サイトをリニューアルする際には、本番環境を残しつつ、もう一つ同じ環境を構築する必要があります。

今回は、プラグインを使って簡単にコピーしてみましょう。

All in One WP Migrationでサイトをエクスポート

まずは、コピー元のサイトにログインして、サイト情報をエクスポートします。

「プラグイン」⇒「新規追加」から「All in One WP Migration」を検索してインストール&有効化します。

インストールしたら「All in One WP Migration」⇒「エクスポート」からサイトをエクスポートします。

「エクスポート先」をクリックして「ファイル」を選択

LocalbyFlyWheel_031

「ファイル名.wordpress」ファイルが作成されるので、これをLocal by Flywheelで構築したサイトにインポートします。

All in One WP Migrationでサイトをインポート

さて、同じようにLocal by Flywheelで構築した開発環境のサイトにログインして、「All in One WP Migration」をインストール&有効化します。

そして、「All in One WP Migration」⇒「インポート」から先程の「ファイル名.wordpress」ファイルを選択してインポートしましょう。

LocalbyFlyWheel_032

アップロード容量制限の拡張

アップロードする際に容量制限がかかる場合は、「All-in-One WP Migration File Extension」を使って容量を拡張できます。

300MBから512MBまで増やすことが可能。

こちらの公式サイトからダウンロードできます。「All-in-One WP Migration File Extension

zipファイル形式のプラグインをインストールするときは、「プラグイン」⇒「プラグインのアップロード」ボタンからインストール&有効化します。

有効化するだけで拡張されます。

LocalbyFlyWheel_033

512MBでは足りない場合は、有料版を使うか、「All in One WP Migration」を使わない方法を検討しましょう。

※無料版のまま、より容量拡張する方法もあるようですが、自己責任でお願いいたします。

Local by Flywheelから本番環境へアップロード

逆に作成または修正したサイトを本番環境にアップロードするには、先ほどとほぼ同じ手順を踏みます。

違うのは、公開用サーバーと独自ドメインが必要な部分です。

本番環境を準備する

サイト公開に必要なものを準備しましょう。
・レンタルサーバー
・独自ドメイン

Web制作案件ならここをどうするかは予め相談しておきましょう。お客様のサーバーにアップロードする場合もありますので。

レンタルサーバー

レンタルサーバーは「エックスサーバー」をおすすめします。

レンタルサーバーでは一番、歴史の深い老舗なので安心ですし、最安値で安定しています。※加えて「独自ドメイン」が永年無料。かなりお得。ただし、キャンペーン中のみ。

Webデザイナー/エンジニアならレンタルサーバーは必須アイテムなので、自分用に持っておくと便利です。

手順で迷ってしまう場合は、「XSERVER(エックスサーバー)でWordPressブログを始める方法」にて画像つきで解説しています。

独自ドメイン

独自ドメインなら「お名前.com」で取りましょう。

さきほどのXSERVERで無料ドメインを取れれば不要ですが、開発案件をやっている時にいつも無料なわけではありませんよね。

独自ドメインを取って、レンタルサーバーと紐付ける方法は覚えておいて損はありません。

お名前.comで独自ドメインを取得してXSERVERに紐付ける方法」について解説しているので興味があればどうぞ。

All in One WP Migrationでエクスポート&インポート

公開用サーバーが準備できたら、さきほど「既存サイトを開発環境にコピー」した時と同じようにするだけです。

・開発環境からエクスポート
・本番環境へインポート

慣れれば簡単ですね。お疲れ様でした~( ´ ▽ ` )ノ

-ブログ
-

© 2021 ReiCodeBlog