WordPressのテスト環境は、本番サイトに影響を与えずに新機能やデザイン変更、プラグインの検証、更新テストなどを安全に行える開発環境です。
本記事では、初心者でも簡単にWordPressのテスト環境をサブドメインで構築し、安全に開発・検証した後、本番サイトへスムーズに移行する方法を解説します。サイトの品質と安定性を保ちたいWordPress初心者の方に最適な内容です。
WordPressテスト環境の種類
WordPressの開発やテストを行うためのテスト環境には様々な種類があります。初心者向けに主なテスト環境の種類とそれぞれのメリットを紹介します。
ローカル開発環境
Local（旧Local by Flywheel）
Local（旧Local by Flywheel）は、WP Engineが提供しているWordPressの開発・テスト環境を簡単に構築できるツールです。クリック操作だけでWordPressサイトを作成でき、複数サイト管理、ライブリンク共有、SSL対応などの機能を備えています。初心者でも使いやすいUI設計で、無料で利用可能です。
XAMPP/MAMP
XAMPP/MAMPは、Windows/Mac向けのオープンソースのローカル開発環境パッケージです。Apache、MySQL、PHP、Perlなどを一括インストールでき、WordPressなどのWebサイト開発に必要な環境を簡単に構築できます。
サーバーの設定を管理画面から調整できる無料ツールですが、初めて使う場合には操作に少し時間がかかることがあります。
wp-env
wp-envは、WordPress のローカル開発環境を簡単にセットアップできるWordPress公式ツールで、プラグインやテーマの開発向けに設計されています。
wp-envを利用するには、DockerとNode.jsが必要です。Docker を利用して環境を構築するため、セットアップがシンプルで、リセットも簡単、環境を汚さずに開発ができます。Node.js / npm、Dockerの基礎知識、コマンドラインでの操作が必要なため初心者には少し敷居が高いです。
オンラインのテスト環境
ステージングサイト
レンタルサーバーでは、技術的な知識不要で、簡単安全にテストできる環境が提供されている場合があります。
国内サーバーでは、CPIサーバーのスマートリリース、さくらのレンタルサーバに「Snapshot」、海外サーバーでは、KinstaやWP Engineなどにもワンクリックステージング機能が提供されています。
このようなステージング機能付きサーバーなら、技術的な知識がなくても、本番環境に最も近い状態で、かつ安全にテスト環境を構築できます。
参考: テストサイト・ステージング環境が簡単設置できるレンタルサーバー
サブディレクトリ/サブドメインでのテスト環境
サブドメイン/サブディレクトリを利用したテスト環境は、追加コスト不要で本番サイトと同じサーバー上に構築できる利点があります。柔軟なURL設定が可能で、本番環境と環境差異がなくでテストすることができます。
| サブドメイン | test.example.com | 別サイトのように独立して管理可能 |
|---|---|---|
| サブディレクトリ | example.com/test | メインサイトの一部として管理するのに適している |
簡易的テストならサブディレクトリでOKですが、サイト単位の本格的なテストならサブドメインを利用する方がおすすめです。
サブドメインの方が、本番サイトと切り離せるため影響を防げ、アクセス制限も簡単です。またディレクトリ構造が独立し、URLの相対パスも本番と同じ設定で検証できるため、動作確認がスムーズに行えます。
本記事では、サブドメインでのテスト環境を取り上げています。
Xserverでサブドメインテスト環境の作り方
Xserver（エックスサーバー）でサブドメインを利用してWordPressのテスト環境を作る流れを解説します。
- サブドメイン作成
- WordPressサイトコピーでテスト環境にコピー
- アクセス制限を設定
【Xserver】1. サブドメインの設定
まずはドメインにサブドメインを設定します。エックスサーバーのサーバーパネルにログインして操作します。サブドメインを設定する流れは以下の通りです。
- Xserverサーバーパネルへログイン
- 「ドメイン」メニュー内の「サブドメイン設定」をクリック
- 「サブドメインを追加」ボタンをクリック
- サブドメイン名を入力し（例：サブドメイン名「
test」）、ドキュメントルートを選んで「追加する」ボタンをクリック
- サブドメイン名
サブドメイン名は以下の内容を守れば基本的に好きな文字を設定可能です。
- ドキュメントルート
ドキュメントルートとはサブドメインのデータアップロード先です。
エックスサーバーでは当該ドメインのpublic_html内にサブドメイン用のディレクトリが作成されます。そのディレクトリ名を選ぶことができます。基本的に管理しやすい方、お好みで良いと思います。
- 無料独自SSLを利用する」
「無料独自SSLを利用する」にチェックが入っているのでそのままにします。
サブドメインが有効になるまで最大で1時間程かかります。サブドメインが有効になると「反映待ち」から「正常」に変わります。
サブドメイン有効前にブラウザからアクセスすると、「無効なURLです。」と表示されます。
サブドメインが有効になると、エックスサーバーの初期画面が表示されます。
サブドメインでのみアクセス可能にする.htaccess設定
Xserverの仕様では、ドメインのルートディレクトリ（public_html）にサブドメインのディレクトリが作成されます。
そのためhttps://test.example.com/の場合、https://example.com/test.example.com/でもアクセスが可能な状態です。
このままではSEO上よくないので、サブドメイン名（https://test.example.com/）からだけでアクセスできるようするため、.htaccessを編集して設定します。
ドメイン名/サブドメイン名（https://example.com/test.example.com/）のアクセスを拒否する.htaccess
SetEnvIf Host "^test.example.com$" host
order deny,allow
deny from all
allow from env=host1行目の「test.example.com」は作成したサブドメインに書き換えます。この.htaccessはサブドメインのディレクトリ（/example.com/public_html/test.example.com/）に設置します。
.htaccess設置後、https://example.com/test.example.com/へアクセスすると403エラーになります。
参考記事www有り無し統一してhttps化する .htaccessのスマートな書き方
【Xserver】2.WordPressサイトコピーでデータをまるごとコピーする
Xserver（エックスサーバー）には「WordPressサイトコピー」、「WordPress簡単移行」という機能があるのでWordPressデータの移行はとても簡単に行うことができます。
| WordPress簡単移行 | 他社からエックスサーバーへWordPressを移行するツール |
|---|---|
| WordPressサイトコピー | 同じエックスサーバー内の別ドメインにWordPressサイトをコピーするツール データ全体コピーのほか、テンプレートのみのコピーも可能 |
「WordPress簡単移行」を使って同じサーバー内でデータ移行することができますが、データ量が多いと失敗することも多かったです。（※wp-contentの容量が2GB以上だとエラーになる）
WordPressサイトコピー機能がリリースされて、サーバー内のデータコピーがより早く、簡単になりました。
WordPressサイトコピーの流れ
- サーバーパネル「WordPress」>「WordPress簡単インストール」をクリック
- コピーするWordPressの「詳細」ボタンをクリック
- WordPressの情報が開くので下部にある「コピー」ボタンをクリック
- さらに入力欄が開くので、
コピー対象：全て
コピー先URL: サブドメイン
を選択 - 「コピーする」
- 「コピーが完了しました」とメッセージが表示されれば完了
WordPress簡単インストールにWordPressがない場合は手動で追加する
他社から移転したり、手動でインストールしたWordPressは、「WordPress簡単インストール」に表示されません。その場合は、手動でWordPressを追加します。
- 「WordPressを追加」ボタンをクリック
- 追加形式：「手動インストールしたWordPressを一覧で管理」を選択
対象ドメイン：追加するドメインを選択
WordPressインストールパス：WordPressをインストールしたディレクトリ
ドメイン直下（ルートディレクトリ）にインストールしている場合は空欄のまま - 「追加する」ボタンをクリック
【Xserver】3.サブドメインのアクセス制限
最後にサブドメインはテスト環境なので検索エンジンにインデックスされないようアクセス制限をかけておきます。
アクセス制限は、手動でやる場合は.htaccess, .htpasswdを設置してベーシック認証を設定しますが、エックスーサーバーではサーバーパネルから設定可能です。
Xserver サーバーパネル：ホームページ＞アクセス制限
サブドメインのアクセス制限をONにして、ユーザー設定をします。
ロリポップでサブドメインテスト環境を作る手順
ロリポップ！サーバーでサブドメインを使ってテスト環境を作る場合も、基本的にエックスサーバーと同じように管理画面から簡単に作成できます。
- サブドメイン作成
- サブドメインのSSL設定
- 本番WordPressデータをサブドメインテスト環境にコピー
- アクセス制限を設定
【ロリポップ】1. サブドメイン設定
- ロリポップユーザー画面にログイン
- 「サーバーの管理・設定」>「サブドメイン設定」を選択
- 「サブドメイン設定」画面で「新規作成」ボタンをクリック
- 「サブドメイン設定」：サブドメイン名・ドメイン名・公開アップロードフォルダを入力して「作成」ボタンをクリック
「公開アップロードフォルダ」は、わかりやすいようにtest.example.com（サブドメイン＋ドメイン名）を入力していますがtestだけでもOKです。
複数ドメインのサブドメインを作成する場合は、「サブドメイン＋ドメイン名」がよいです。
ここに入力した名前でサーバーのルートディレクトリにフォルダが作成されます。
【ロリポップ】2.サブドメインのSSL設定
Xserverではサブドメイン設定と同時にSSLも設定できますが、ロリポップではサブドメインのSSLは別途設定する必要があります。
- ロリポップユーザー画面「セキュリティ」 > 「独自SSL証明書導入」
- 下の方にある「独自SSL（無料）」までスクロール
- 「SSL保護されていないドメイン」タブ：サブドメイン名にチェックを入れて「独自SSL（無料）を設定する」ボタンをクリック
- 5分ぐらいでSSLが有効になります
【ロリポップ】3.WordPress簡単引越しでテスト環境へコピー
- 「サイト作成ツール」>「WordPress簡単引っ越し」をクリック
- 「引っ越し元」に「本番WordPress」情報を入力
- 「引っ越し先」に作成したサブドメインをプルダウンから選択
- 早ければ数分でデータ引っ越し完了
注意点としては、画面にも表示されていますが引っ越し元のWordPressにセキュリティ系プラグイン（SiteGuard WP Plugin, All in one Security and Firewall, Wordfenseなど）が入っていると引っ越しエラーとなるため、一時的に無効にしておく必要があります。
ロリポップ！WordPress簡単引っ越しを使うと、引っ越し元・引っ越し先のWordPressに「Lolipop Migrator」プラグインがインストールされます。
データ移行が完了したらプラグインは不要なので削除しておきましょう。
ロリポップ: WordPress（ワードプレス）簡単引っ越しの利用方法
【ロリポップ】4.アクセス制限
最後にテスト環境が公開状態にならないようにサブドメインにアクセス制限をかけます。ロリポップでは管理画面から、.htaccessによるBasic認証（アクセス制限）が設定できます。
既に.htaccessが存在している場合に、ここからアクセス制限を設定してしまうと、設定が上書きされてしまいます。
特殊な設定（リダイレクト、キャッシュプラグイン、セキュリティプラグインを利用している）がある場合は、先にバックアップを取ってから設定しましょう。
- 「セキュリティ」>「アクセス制限」をクリック
- 「新規作成」ボタンをクリック
- 「.htaccess設置ディレクトリ」はサブドメインのディレクトリ
「設定したドメインのディレクトリから入力できます。」をクリックすると、ドメインを選択できます。 - 「認証フォームタイトル」ログインウィンドウに表示される文字列。「Login」とか「Member Login」など。日本語を設定すると文字化けしてしまう場合があるため英語表記が無難です。
- 「ユーザ１」アカウント・パスワードを入力
WordPressが生成する.htaccess
# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress手動でのアクセス制限
手動で.htaccess、.htpasswdを設置することも可能です。
以下の内容を.htaccessに記述します。
AuthUserFile [.htpasswd]を設置したディレクトリのフルパス
AuthGroupFile /dev/null
AuthName "Login"
AuthType Basic
require valid-userフルパスは「ユーザー設定」>「アカウント情報」から確認できます。
例：/home/users/0/ロリポップドメイン-固有の文字列/web/
パスワード生成ページでパスワードを生成します。（要ログイン）
生成した文字列をテキストファイルにコピぺし、.htpasswdを作成します。
.htpasswdをアップロードします。注意するのは、.htaccessで指定した.htpasswdのパスと同じ場所にアップロードすることです。
違う場所に設置してしまうと、アクセス制限が有効にならないか、永久にログインできません。
WordPressプラグインを使ったデータ移行
サーバー側でWordPress移行機能がない場合は手動またはWordPressプラグインを使ったデータ移行を行います。
WordPress移行プラグインのおすすめ
関連記事: WordPressをサーバー移行する方法。プラグイン・手動でやる手順
WordPressのテスト環境を作るまとめ
サブドメインを使用したWordPressテスト環境（例：test.example.com）は、本番サイトと同じサーバー上に構築できる効率的な方法です。追加費用なしで利用できることが大きなメリットです。
注意点としては共有リソースを使用するため大規模テストには注意が必要です。本番サイトと一元管理できますが、テスト環境の問題が本番に影響する可能性があり、検索エンジンへの対策も必要です。
マニュアルでの設定は、ある程度の知識が求められます。しかしエックスサーバーやロリポップ！ではドメイン設定からWordPressのデータ移行までサーバーパネルで操作が可能なので、設定が簡単です。
テストからリリースまでできるステージング機能付きサーバー
XserverではWordPress簡単移行やサイトコピー機能があるため、テスト環境を作成するの簡単ですが、本番へのリリースを自動ですることはできません。テストした後の本番環境へのリリース機能はないため、手動での移行作業が必要になります。
本番環境→テスト環境、またテスト→本番リリースまでもっと手軽にやりたい場合はCPI、さくらのレンタルサーバなら可能です。
CPIにはスマートリリース、さくらのレンタルサーバには「Snapshot」という機能があります。以下の記事ではスマートリリースとSnapshotを紹介しています。
Xserverでできることをもっと知りたいならこちらの記事もおすすめです:
中小企業におすすめの法人向けレンタルサーバー比較：
