ブログ運営

【WordPress】テーマ変更を安全に行う方法【XAMPPを使ったローカル環境の構築方法解説】

しばらくブログ運営を続けてきたけど、テーマを変更したいな・・・
でも記事が増えてきたから、テーマ変更の間どうしよう・・・

今回は、そのような悩みを解決します。

その方法ですが、ローカル環境に同じWordpressの環境を作って、そこでテストをするという方法です。

私はエンジニアなので、普段から開発を行う場合は、ローカル環境で動作確認をして、それを本番で使うという流れで行っています。
(正確には、更にその間にテスト環境でのテストが入りますが)

そのため、テーマ変更の場合も同じ方法で行えば、元のブログに影響を与えるリスクを最小限に抑えながらテーマ変更を行うことができます。

テーマ変更のときだけでなく、デザインをいじってみたいときや、プラグインの動作を確認したいときにも役に立ちます。

テーマを変更するリスク

WordPressでしばらくブログを運営していて、テーマを変更したくなった場合、

記事数が少なければ問題ありませんが、50記事・100記事と増えてきてからテーマを変更しようとすると、1記事1記事確認して非常に時間がかかってしまいます。

そして、変更作業をしている間は記事を非公開にしない限り、過去のテーマに合わせて作った記事が公開されたままになってしまいます。

例えば、今使っているテーマで使えていたショートコードが、新しいテーマで使えなかった場合

[ショートコード]

のように文字で表示されてしまいます。

この状態の記事を見られてしまうのは非常に恥ずかしいですし、SEO的に問題が発生する可能性のある箇所もあるかもしれません。

そんな問題を解決するのがローカル環境での動作確認です。

ローカル環境でテストするメリット

ローカル環境でテストするメリット
テーマ変更を行っている間も、ブログ更新は通常通りに行うことができる点が最大のメリットです。

また、ローカル環境で何か失敗があっても、すぐに消して作り直すことができるのも便利です。
実際に動いているブログで失敗してしまったら、取り返しのつかないことになってしまう可能性がありますしね。

本来であれば、テーマ変更をしたら一気に記事を新しいテーマ用へと修正する必要がありますが、ローカル環境であれば自分のペースで行うことができるのもメリットです。

 

ローカル環境を構築する方法

では、具体的にローカル環境を構築する方法について解説していきます。

今回はXAMPPというパッケージを使用します。

XAMPPとは、WebサーバのApache、データベースのMySQL、プログラミング言語であるPHPPerlが入ったパッケージです。
PHPを使ったアプリケーション開発によく使われます。

 

XAMPPを使うメリット

ローカル環境を構築する方法は、XAMPPを使う以外にも方法はあります。

有名なのはLocal by Flywheelですかね。

では、なぜあえてXAMPPを使うのかと言いますと、

  • 設定がしやすい
  • 情報量が多い

この2点の理由です。

本記事の後半で解説してますが、例えばブログのデータをコピーしたいとき、ファイルサイズの制限に引っかかることがあります。
その制限もXAMPPであれば、簡単に設定を変更することができます。

また、元々Webアプリケーションの開発で使われているものなので、情報量が多く何かトラブルが発生した場合でも、調べればすぐに解決方法を見つけることができるのも強いです。

XAMPPをダウンロードする

XAMPPの公式ページのダウンロードリンクから、自分の環境に合ったインストーラーをダウンロードします。

今回は、Windows10を使って解説していきますので、Windows用のインストーラーを選択します。
PHPのバージョンは最新の7.3のものを使います。

インストーラーダウンロード

XAMPPをインストールする

インストーラーをダウンロードしたら、起動させてインストールを行います。

インストーラーが起動すると、このようなウィンドウが表示されますので、OKをクリックします。

インストール手順1
 

NEXTをクリックして進めます。

インストール手順2
 

次にセットアップする内容の選択です。

今回はWordpressを使うだけなので、そのための最低限必要なものだけを選択してインストールします。

ApacheMySQLPHPphpMyAdminの4つにチェックが入っていることを確認して、NEXTをクリックします。
(その他のチェックは全て外しても大丈夫です。)

インストール手順3
 

インストール場所の選択です。
好きな場所を選んでNEXTをクリックします。

インストール手順4
 

ここのチェックは外してNEXTをクリックします。

インストール手順5
 

NEXTをクリックするとインストールが始まります。

インストール手順6
 

インストールが完了したら、チェックを付けたままFinishをクリックします。
すると、自動でXAMPPが起動します。

インストール手順7
 

XAMPPが起動すると、言語選択画面が出てきます。
日本語はないので、英語を選択してSAVEをクリックします。

インストール手順8
 

XAMPPが起動します。
これがXAMPPのコントロールパネルです。

インストール手順9

WordPressをインストールするための準備

こちらのWordpress公式サイトのダウンロードページから、Wordpressをダウンロードします。

ワードプレスのダウンロード
 

zipファイルがダウンロードされるので、ダウンロードが完了したら、まずはzipファイルを解凍します。
解凍すると、wordpressというフォルダができて、その中に多くのファイルが入っているかと思います。
そのwordpressフォルダを、XAMPPをインストールしたフォルダの中にあるhtdocsという名前のフォルダ内に移動します。

例えば、XAMPPを「C:\xampp」にインストールしたとすると、
C:\xampp\htdocs\wordpress」このようなフォルダ構成となっていればOKです。

 

これで必要なファイルの準備はできたので、実際にWordpressをインストールしていきます。

XAMPPのコントロールパネルの、ApacheMySQLのStartボタンをクリックします。

XAMPPを起動
 

これで、Webサーバとデータベースが起動されましたので、ブラウザを開いてアクセスしてみましょう。

URLは、http://localhost/wordpressです。

今後ローカル環境を使いたい場合は、XAMPPコントロールパネルのApacheとMySQLの2箇所のStartボタンをクリックして、上記URLにアクセスすることで使えます。

 

ブラウザでアクセスすると、このようにWordpressのセットアップ画面が表示されます。

ワードプレスのインストール
 

通常のセットアップを同じように進めていきます。

ワードプレスのインストール2
 

すると、このようにデータベースの情報を入力する画面が表示されます。
それぞれの項目は、上記のように、

データベース名: wordpress
ユーザー名: root
パスワード: 空白
データベースのホスト名: localhost
テーブルの接頭辞: wp_ (デフォルトのままでOK)

このように入力します。

しかし、まだデータベースの設定はしていないため、送信ボタンをクリックするとエラーが出ます。

そのため、この画面をそのままにして、先にデータベースの設定を行っていきます。

データベースの設定

先ほどのXAMPPのコントロールパネルの、MySQLのAdminをクリックします。


 

すると、ブラウザでこのようなphpMyAdminの画面が開きますので、データベースをクリックします。

SQL管理画面1
 

データベース名をwordpressとして、作成ボタンをクリックします。

SQL管理画面2
 

これでデータベースの準備が完了しました。

データベースは今後操作することは基本的にないので、phpMyAdminのウインドウは閉じてもOKです。

WordPressをインストールする

ワードプレスのインストール2

こちらの画面に戻って、送信ボタンをクリックします。

そのまま進めていくと、ブログの必要情報を入力する画面が表示されます。

ここの情報は、後からブログの情報で上書きされるので、最初のログイン時のみ必要となる情報です。
そのため、全て適当に入力しても大丈夫です。

ワードプレスのインストール3

パスワード確認検索エンジンでの表示の箇所にチェックマークを付けて、インストールを実行します。

これで、ローカル環境でWordpressを使うことができるようになりました。

All-in-One WP Migrationを使ってブログをコピーする

All-in-One WP Migration」というプラグインを使うことで、今実際に動いているブログを、先ほど作ったローカル環境にコピーすることができます。

まず、今動いているブログにAll-in-One WP Migrationをインストールします。

All-in-One WP Migrationインストール
 

インストールが完了したら、有効化させます。
すると、左のメニューにAll-in-One WP Migrationが表示されますので、エクスポートをクリックします。

エクスポート
 

エクスポート先をクリックすると、メニューが展開されますので、その中のファイルをクリックします。

エクスポート2
 

すると、エクスポートが始まるので、完了したらファイルを任意の場所に保存します。

次に、ローカル環境側のWordpressで同じようにAll-in-One WP Migrationをインストールし、今度はインポートをクリックします。

そして、同じようにインポート元をクリックするとメニューが展開されるので、ファイルを選択し、先ほどエクスポートのときに保存したファイルを選択してインポートを実行します。

インポートが完了したら、実際に動いているブログのユーザー名とパスワードを使って、ローカル環境にログインができるようになります。

インポート時にエラーが出る場合の対処方法

エクスポートしたファイルサイズが小さい場合は、これだけで問題なくローカル環境が使えるようになるのですが、画像ファイルや記事数が多い場合は、ファイルサイズの制限でエラーが出ることがあります。

そんな場合は、Webサーバ側で扱うことができるファイルサイズの上限を変更することで、解決できます。

WordPressの入っているフォルダ(今回の例だとC:\xampp\htdocs\wordpress)内の.htaccessというファイルをメモ帳などで開きます。

開きましたら、</IfModule>と書かれている行の下に、

php_value upload_max_filesize 12800M
php_value post_max_size 12800M
php_value memory_limit 256M
php_value max_execution_time 300
php_value max_input_time 300

 

と追記して、保存します。

その後、XAMPPのコントロールパネルから、Apacheを一度停止させて、その後また起動させます。

Apacheの再起動
Stopをクリックした後、再度Startをクリックします。
 

すると、インポートメニューのファイルサイズが増えているはずです。

インポートのファイルサイズ
 

XAMPPを使ったWordpressのローカル環境構築方法まとめ

XAMPPを使って、ローカルにWordpress環境を構築する方法について解説してきました。

XAMPPを使っての構築は、初心者にはハードルが高いかと思われますが、実はそんなことなく、この解説通りの手順で進めれば簡単に構築することができます。

  • テーマを変更したい
  • 新しいデザインを試してみたい
  • プラグインの動きを試してみたい

など、動いているブログではしづらいことも、ローカル環境があれば気軽に試すことができるので、ぜひ構築して試してみてください。

楽天カードで日々の生活をお得に!

買い物をしたときだけでなく、毎月々のスマホ代や電気代などの固定費の支払いでも楽天ポイントが貯まります!

貯まった楽天ポイントは、楽天ショップだけでなく全国の様々なお店で使うこともできますし、クレジットカードの支払いにも使うことができます。

CMでお馴染みの楽天カード、まだお持ちでない方は、これを機に作ってみてはいかがでしょうか?

>>無料で楽天カードに申し込む