Local By Flywheelから本番環境へ移行する際の注意点-既存の静的サイトからWordPressにリニューアルする場合

ぱらげです。

・WordPressサイトへリニューアルする予定だけど、現在使用しているサイトのドメインをそのまま引き継ぎたい
・引き継ぐ予定のドメインでは現在も既存サイトを運用しているため、WordPressの構築や制作はローカル上で行う必要がある
・クライアント先と制作開始の合意をしたが、実際の本番サーバーやドメインなどに関するところまでまだ話が煮詰められていない

このような場合は「Local By Flywheel」(ローカルバイフライホイール)というツールを使って、まずはローカル上でWordPressを構築しましょう。
Local By Flywheelの構築手順については以下の記事がわかりやすいです。
超簡単にローカル環境が構築できるLocalbyFlywheelの使い方

本記事では、ローカル上で制作したWordPressを本番環境に移行する際に知っておいた方がいいことについてご紹介します。
※契約中のサーバー、既存ドメインをそのまま使用する前提となります。

サーバー会社別に移行手順を確認する
WordPressに使用するデータベースの概要を把握しておく
WordPressファイル一式のアップロード先はルートディレクトリ直下
データアップロード時はFTPソフトを使う
Search Replace DBは必ず使う
本番ドメインにアクセスをしてもLocal上のドメインに遷移してしまう場合の対処法
1. hostsファイルのパス
2. hostsファイル修正内容

サーバー会社別に移行手順を確認する

基本的な移行手順はどのサーバー会社でも同じですが、操作をするコントロールパネルやデータファイルを設置するディレクトリ名、データベース情報などが変わってきます。
私の場合、移行に使用するサーバー会社に関する記事がなかなか見つからなかった(少しマイナーな会社だった)ため、実際の移行では以下の記事を参考にさせてもらいました。

ロリポップの場合：
Local By Flywheelから本番環境へ！ローカル環境からロリポップのサーバーにサイトを移行する手順を解説

エックスサーバーの場合：
【WordPress】Local by Flywheelからエックスサーバーに移行する手順

WordPressに使用するデータベースの概要を把握しておく

WordPressではざっくりと以下のようなデータを「データベース」で管理しています。

・記事タイトル
・記事本文
・作成日時・更新日時
・タグ・カテゴリー
・ステータス

WordPressのデータベースについて更に詳しく書かれている記事
今更聞けない｜WordPressに必要なデータベース！どんな役割で使用している？

ローカル上のWordPressは、Local By Flywheelに備わっている仮のデータベースでこれらの情報を管理していますが、サーバー上でも同様にこれらを管理するためのデータベースを作成する必要があります。
その際の事前知識として、WordPressのデータベースではどのようなデータを取り扱い、どのようなテーブルを使用しているのかなどを把握しておくことで、この後の移行作業でよりイメージがわきやすくなるのでおすすめです。

WordPressファイル一式のアップロード先はルートディレクトリ直下

先述したURLでの移行手順にも記載されているアップロードファイル(「public」フォルダ内)は、あくまでpublicフォルダごとではなく、publicフォルダ内のファイル一式をアップロードするという点にご注意ください。

以下の画像のようにpublicフォルダ内に入ってからファイル一式を全選択します。

また、上記で選択したファイルをアップロードする先はルートディレクトリ直下となります。
ルートディレクトリとは一番上のディレクトリのことを意味します。例えば「https://test.com/」というドメインがあった場合、一番右の「/」にあたる階層がルートディレクトリになりますが、
エックスサーバーなど場合は「public_html」がルートディレクトリとして指定されています。

/home/サーバーID/独自ドメイン名/public_html/

↑エックスサーバーでは上記のディレクトリにpublic内データ一式を設置します。

このようにルートディレクトリとなるディレクトリ名称は各サーバー会社によって変わるため、データをアップロードする前に確認しておきましょう。

データアップロード時はFTPソフトを使う

Local By Flywheelからダウンロードしてきたpublic内ファイルをサーバーに設置する際、各サーバー会社が用意しているファイルマネージャーでもアップロードはできますが、複数のファイルやフォルダを一括でアップロードする場合はFTPソフトを使うとスムーズです。

「FileZilla（ファイルジラ）」であればmac、windowsどちらでも対応しているのでおすすめです。

FileZillaのダウンロードとインストールの方法

このソフトからサーバーに接続し、ファイルを一括アップロードします。アップロードは30分〜数時間ほどかかりますので気長に待ちましょう。

Search Replace DBは必ず使う

データベース内では「http://○○○.local」といった具合にローカル上でのドメイン名が残ってしまっています。このため、きちんとファイルアップロードをしても指定ドメインにアクセスをすると、レイアウトが激しく崩れていたりする可能性があります。「Search Replace DB」というツールを使用してデータベース内の「http://○○○.local」となっている部分を「http://○○○.com」など本番環境のドメイン名に置換をしてあげる必要があります。

Search Replace DBダウンロード
https://interconnectit.com/search-and-replace-for-wordpress-databases/

以下の記事で使い方が確認できます。
WordPress Search Replace DB の使い方

これでレイアウト崩れも直るはずです。

本番ドメインにアクセスをしてもLocal上のドメインに遷移してしまう場合の対処法

「本番ドメインにアクセスをするとトップページが正常に表示されるのに、他のページを確認しようとすると以前使用していたLocalのドメインの方に遷移してしまう」
これはLocal By Flywheelを使用した際にhostsファイルに情報が書き加えられているために起こります。Local By Flywheelを使用しているPCからでも本番環境で表示ができるように「hosts」というファイルを修正します。

hostsファイルのパス

windowsの場合：
「C:\Windows\System32\drivers\etc\hosts」

macの場合：
「/private/etc/hosts」

直接ファイルの編集ができないため、デスクトップなどにコピーしてから編集します。

hostsファイル修正内容

StartとEndの間にある情報を削除し、元のhostsファイルを上書きします。
もし認証画面などが出てきたら、そのまま認証し、ファイルを置き換えてください。