WordPressのテストサイトは完全ローカルで行うBitNamiや2分で導入できるInstantWordpPress、誰にも見せずサブドメインでテストページを構築・テストブログにファイルを移行する方法、ほか場面によってテストする方法があります。
- ブログ初心者にテストで成功したファイルを、本番環境に移行する工程・やり方
- PHP・.htaccessファイルの致命的な記載ミスで、サーバー内部で処理できずブログが真っ白になるHTTP500エラーを本番でださない為にテストサイトを構築する
2のエラーが出るタイミングを知ってれば、テストサイトの活用法が変わります。1のテストした内容を本番環境へ移行（採用）のしかたを紹介しますね。
※初心者向けに書いてますが、FTPソフトの使い方・ファイルの導入方法が不安な場合は各リンク先をチェックしてくださぁい＾＾
テスト環境から本番環境へ移行する、簡単な方法
テストでカスタマイズが成功したファイルを本番サイトへ移行するシンプルで簡単な方法です。場合によって2パターン考えられます
- WordPressの管理画面で編集
- FTPソフトを使って転送
テストする内容は、細かい事から絶対的に重要なことがあります。
- カスタマイザーでテーマのヘッダー詳細の変更テスト
- テンプレートファイルの編集テスト
- 新規でテンプレートファイルを導入、編集テスト
1.２はテスト環境の管理画面で編集したものが成功すれば、本番環境にコピーペーストなどすればOK！
3は、FTPソフトを使って転送・導入すればOKです。FTPソフトでファイルを導入するとき大事なことがあるので、見てみましょう。
テスト環境で編集したファイルを本番に！FTPソフトで導入する
テストサイトで編集したファイルのみをFTPソフトで、本番にアップします。テーマファイルを全てアップすると、編集してない部分を上書き保存してしまうから。
例えばサブドメインのテスト環境でしたら、編集したファイルのみ、FTPソフトでバックアップしてローカル（PC）に保存し、それを本番環境の該当の場所へアップロード：復元します。
ローカル（PC上）環境でWordPressを構築しているBitNamiの場合も同じ（後述）。
バックアップから復元するにはテストサイトに、目次3：本番環境のデータを移行する コレを初めに行っていることが大事です。
LINKWordPressのサブドメインでテスト環境を作る手順
functions.phpなどは、同じ記載があると1撃でブログが飛び真っ白になったり内部サーバーエラーとしてhttp500エラーが出ます。（その他、後述）
本番で出す前にテストサイトで同じ（または極力似た）環境を作るのが大事で、成功したら本番に導入するとリスクが少ないです。
ロリポップでは、サブドメインのテスト環境のファイルを本番環境に移行するのは簡単にできます。テスト環境ファイルをコピーして、本番環境に移行するのにWeb上にあるサーバーFTPで簡単に操作できるので♪
LINK外出先で使えるロリポップFTP！ファイル編集やアップロード・ダウンロード・ファイル転送ができて便利な使い方
次は、WordPressの本体ファイルまでのパスを説明と、よく使うwp-content内のファイルやカスタマイズする可能性のあるファイルのパスをローカルWordPressのBitNamiで説明しますね。
BitNamiのテスト環境から本番へ。WordPressが入っている場所
BitNamiなどもサブドメインと全く同じ方法ですが、ファイルまでのパスがややこしい＞＜
と思ってしまいがちです。WordPressが入っている場所までのパス（フォルダ）が多いだけなので、どこにブログが入っているか分れば簡単です＾＾
C:\Bitnami\wordpress-4.6.1-5\apps\wordpress\htdocs
- Cドライブ
- Bitnamiフォルダ
- wordpress-4.7.2フォルダ
- appsフォルダ
- wordpressフォルダ
- htdocsフォルダ
このパスの中にいつもよく見るWordPressの本体ファイルが詰まってます。
WordPress本体ファイルのカスタマイズするファイルの場所説明
WordPressの本体ファイルがどこにあるのか。それを知っていれば本番へ移行するとき困りません。コレを知っていればハードルがグン！と下がるのでファイル内説明を簡単にしますね。
スマホでは見にくいですね…。階層（ディレクトリ）が大事なので、階層化させて書きますね。
- wp-adminフォルダ
- wp-contentフォルダ
- plugins
- 導入しているプラグイン
- フォルダたち
- themes
- 導入しているテーマ親テーマ
- 子テーマフォルダなど
- uploads
- アップロードした画像
- plugins
- wp-includesフォルダ
- wp-config.phpファイル
このような階層（ディレクトリ）でWordPressの本体ファイルが入ってます。ピンク部分はカスタマイズする機会が多いです。
wp-config.phpは、データベース情報が入っているのでブログの引っ越しやデータベース情報の確認では必須。でも一部のカスタマイズでたまに使う程度です。
- wp-content/themes/導入しているテーマ親テーマ・子テーマフォルダ/
この先の階層にカスタマイズしたいファイルが詰まってます。
親テーマにはファイルがあるけど、子テーマにないときは導入する
子テーマに無いファイルは、親テーマの中にあるから、FTPソフトを使ってテスト環境に導入してください。
ファイルによってHTML（PHPファイル）やCSS読み込み順序は変わるけど、どちらも読み込んでるので、親テーマの更新で上書きして消えないよう子テーマに導入してください。
- wp-content/themes/親テーマフォルダ/この階層にファイルが沢山ある/
親テーマ内ファイルを探して、テスト環境の子テーマに導入します。
- テストサイトと本番環境のパスを合わせることが大事！
wp-content/themes/子テーマフォルダ/この階層のファイル/
- カスタマイズが成功したら、本番環境へアップする
※上述どおり、サブドメインでテスト環境があるなら、ファイルをFTPソフトなどでバックアップ。
※BitNamiなどローカル環境ならPC（FTPソフトの左）側、ファイルまでのパスをたどってファイルを指定する。
その後、あなたが使っている本番環境のテーマ内など、サーバー（FTPソフトの右）側のパスも合わせアップロード！
LINK簡易的バックアップ！初心者用WordPressファイル内説明と、5秒で復元する方法
本番でエラーを出したくない！テスト環境でテストしたいファイルとは？
テスト環境でエラーを出しても、誰にも見られないので安心です。どのファイルを触るとエラーが出るか、知っておきたいトコロです。
- HTMLを触ってもエラーは出ないけど、表示がおかしくなる。
HTMLはブログを表示する骨組みで、そこに間違って書くと、書いた文字がそのままブログに表示されて、ブサイクになりますｗ
- PHPの記載が間違ったら、画面が表示されない500エラーが出る
- ファイルによって500エラーの（真っ白になる）範囲が違う
single.phpでのエラーなら、投稿ページ画面
page.phpでのエラーなら、固定ページ画面
functions.phpでのエラーなら、管理画面・ブログ全て真っ白！
PHPファイルは全て、テスト環境でテストしておきたいですね＾＾； その中でもPHPコード、<?から始まるコードを触るなら、テストは必須！書き方とか間違えて更新したら、ブログが真っ白になるので。
- 文字コードによって、文字化け・HTTP 500 Internal Server Error内部サーバーエラーが出る
テスト環境で成功しても.htaccess、wp-config.phpファイルなど、アップロードするとき文字コードをUTF-8にしてたら、ブログが表示されない内部サーバーエラーが必ず出ます！
テキストエディタでUTF-8（bomなし･n）に設定してください。FTPソフトでアップする時、間違うと一瞬でエラーが出ます。注意してくださいね。
LINKWordPressのUTF-8Nbomとは！文字コード・改行コードについて
文字化けするのは、英数字のみ使えるアスキーという文字コードを使っているからです。このリンク先で触れてるので、気になる方はチェックしてくださいね。
CSSファイルを編集するときは、小さなカスタマイズだとテスト環境でのテストは個人的にはしません。※ブログの表示を思いっきり変えたいときは、別。HTMLを装飾するのはCSSなので、2カラムだったのが、1カラムになる場合も普通にあるから。
CSSをテストしたいとき、便利な方法
CSSは管理画面の投稿の下書きで表示テストを行うために、HTMLをダッシュボード投稿一覧のテキストエディタにタグを書いてテストを行います。
CSSの変更は外観より、テーマの編集でCSSを直接書かなくても、EdgeやFireFox・Chromeの拡張機能要素の検証でスタイルの変更をPC上から確認でるからです。
プレビューで実際のブログを表示してキチンと表示できて満足いく結果が出るまで、要素の検証でリアルタイムで表示を確認しながらCSSの編集。良い感じになったら、編集したコードをコピーして、管理画面のCSSに追記。簡単に表示テストができます。
初心者のうちは、どのようにスタイルが変化するか実際、目で見てCSSを変更できるのでオススメ！詳細な方法は、下記リンクで確かめてください。実際やっている工程を乗せたページも紹介してますが、はっきり言って…ムチャクチャ便利！！
LINK要素の検証の使い方！初心者がカスタマイズできる方法！HTMLとCSS入門編
プラグインでエラーが出た原因を調べたいとき
本番環境でエラーを出したけど、その原因が分からない時試すのがテスト環境です。
- なぜか突然プラグインでエラーが出たか
- 何かのプラグインやカスタマイズ・テーマとの相性を調べたいときなど
テストサイトを使ってエラーの原因を調べるときは極力、環境をあわせたいのでエラーが出たサイトのサブドメイン・テスト環境で調べるのがオススメです。
※アップデートでエラーが出た場合は、プラグインを旧バージョンを戻すなどは本番環境で済ませて置く。テーマのカスタマイザーなどの設定が原因で競合していないかも確認を。
エラーを出したプラグイン・テーマとの相性を確認する方法
- テスト環境は使用テーマはまず親テーマを使用し、エラーが出たプラグインだけ導入して同じ設定でエラーが出るか調べます。
- エラーが出たら、別のテーマやデフォルトのテーマで試す
- 出なければ、子テーマ側でカスタマイズした内容か、別プラグインと競合の可能性を考える
- 本番環境のプラグインをFTPソフトでダウンロードし、テスト環境に導入・有効化・設定する
- エラーがでたら、1つずつプラグインを停止（場合によっては削除）。どのプラグインが原因か突き止める
- 出なければ、子テーマのカスタマイズとの競合を考慮し、FTPソフトで本番環境の子テーマフォルダをダウンロードし、テスト環境にアップロードし確認
- テーマ側にキャッシュの設定があるなら変更したり、PHPのバージョンを変更（できるサーバーは変更）する
- PHPのバージョンでの変更でエラーから復活した場合
- テーマ・WordPressのバージョン、すべてのプラグインを本番環境と合わす
- 全てエラーがでなければ、本番環境も同じように変更する
このようにテスト環境で原因をつきとめます。
エラーから復活しないとき、代替策でテストする
どうしてもエラーが出てしまう場合は、別のプラグインを入れてエラーが出ないか確認するのもテスト環境が便利です。
ほか、プラグインの代わりにカスタマイズをし、エラーが出ないか確認するのもテスト環境ですると、2次災害が防げるのでオススメです。
さいごに
実際のブログでの表示ミス・ファイルの記載ミス・文字コードのミスなどにも気付いて本番環境でエラーを極力出さないために、テスト環境があります。だからテストブログを他の人には見せたくないので、その設定もチェックしてください。
LINKWordPressのサブドメインでテスト環境を作る手順！&ちょっとした知恵的なの
今回WordPressの本体ファイル（FTPで転送できるデータ）をメインで書きましたけど、WordPressの設定や記事などを一括で扱ってるデータベース、と言うものも存在します。
2つそろって初めてWordPressが表示されます。1つ欠けるとたちまちブログが表示されません（おかしな表示になったり）。
そうならない為にバックアップは必要です。手動で２つともバックアップする方法は、下記。
LINK初心者向け！WordPressのバックアップ方法、記事をエクスポートする手順
記事や設定関連を保存しているデータベースのバックアップはおろそかになりがちですが、手動でするよりはるかにバックアップと復元が簡単です。
LINKWordPressデータベースのバックアップ！エクスポート詳細設定方法を、初心者がメチャクチャわかるよう説明
エラーは出てしまうものだけど、バックアップがあれば復元作業は5秒以内！ムチャクチャ簡単なので、2種類のバックアップはとってください。
LINK簡易的バックアップ！初心者用WordPressファイル内説明と、5秒で復元する方法
wp-config.phpと.htaccessこのファイルも。コレがあれば、外部攻撃を受けてブログを手放さないといけない場合、復元できますから。
WordPressは攻撃の標的でもあるので、簡単にセキュリティが行えるプラグインは、本番環境で、メチャクチャおすすめします！
LINK簡単にセキュリティ対策ができる！SiteGuard WP Pluginの設定方法と詳細
リンクだらけになっちゃった＞＜
でもどれも大事なことです。色んな使い方があるので一概に言えませんが、プログラムは繊細なのでエラーが出る事を考慮して、テストサイトを活用してください❦
それでも本番環境でエラーが出てしまったときは、バックアップファイルからの復元が大事です＾＾
それでは、かうたっくでした。
Comments