サーバー上にあるWordPressサイトの完全コピーをローカルに構築する手順!

wordpress-local-copy-eye-catch WordPress

久しぶりの投稿です。この2週間は転職活動やプログラミング、マーケティングの勉強などに時間をかけていたため、ブログの更新がおろそかになってしまいました。

それはともかくとして、今回は、「サーバー上にあるWordPressサイトの完全コピーをローカルに構築する手順」を紹介します。

以前、「XAMPPを使ってWordPressのローカル環境を構築する方法」という記事を書きました。その記事で紹介している方法だと、ローカルにWordPressサイトを構築できますが、あくまでそれは「まっさらなWordPressサイト」です。

しかし、今回紹介する方法は自分のサイトの「完全コピー」ができます。そのため、実際にコンテンツがある状態なのでテーマのアップデートやプラグインの導入、カスタマイズをするにあたり、よりイメージがつかみやすくなると思います。

なお、他の方のブログと比べてみるとかなり詳細に手順を書いたつもりです。

前職でSEとしてはじめてのプロジェクトに参加して環境構築を行ったときに、参考として与えられた資料はあまり詳しく書かれていませんでした。そのため、環境構築やプログラミングの初心者であった私は、本当に自分がしている作業があっているのか心配になることがありました。

その経験から、私のブログでは環境構築やプログラミング初心者が不安や心配を感じてしまわぬよう、時間に余裕があるときはなるべく他のブログよりも詳細に書いております。

参考にした記事

主に下記記事を参考にしました。

今回の作業に必要な環境

手順を紹介する前に、今回の作業で必要な環境、ツールを簡単にまとめます。

  • WordPress:BackWPupがインストールされていて、バックアップを取っていること。
  • XAMPP:MAMPでも手順はさほど変わらないです。
  • 「UTF-8 の BOM なし (UTF-8N)」 に対応したテキストエディタ。例)サクラエディタ

なお、私はWindowsユーザーのためMacユーザーの方には少し分かりづらい記事になってしまっているので、その点はご了承ください。

大まかな流れ

今回の手順の大まかな流れは下記のとおりです。

  • BackWPupで取ったバックアップをダウンロード
  • ローカル用のデータベースの作成、テーブルのインポート
  • 設定ファイル(wp-config.php)の変更
  • テーブルのドメイン名をローカル用に置換
  • 「.htaccess」をローカル用に合わせる
  • ローカルに作成したWordPressのコピーサイトにログインできるか確認

手順

前置きが長くなってしまいました。それでは、実際に手順を紹介します。

BackWPUpで取ったバックアップをダウンロード

WordPressのダッシュ―ボードの管理メニューから「BackWPup」の「バックアップ」を選択。

「BackWPup」の「バックアップ」

バックアップの一覧が表示されるので最新のバックアップを「ダウンロード」する。

BackWPupの「ダウンロード」リンク

バックアップしたファイルをローカルのWordPressフォルダに移動

エクスプローラーを開き、XAMPPの「htdocs」配下(C直下にXAMPPをインストールしている場合は「C:\xampp\htdocs」)に「wordpress_local」というフォルダを作成。(次の手順でこのフォルダの中に、ダウンロードしたファイルを入れます。)

ここは各人の好みでお願いします。フォルダは作らなくてもできます。

「htdocs」の中に「wordpress_local」というフォルダを作成

先ほどダウンロードしたバックアップを解凍。

ダウンロードしたバックアップを解凍

解答したフォルダの名前を変更します。今回はサーバーのサイトの名前を用いて「wp_local_morikun_taiyaki」としてみました。

解答したフォルダの名前を「wp_local_morikun_taiyaki」に変更

名前を変更したフォルダを、先ほど作成したフォルダ「C:\xampp\htdocs\wordpress_local」の中に移動します。(移動後のパスは「C:\xampp\htdocs\wordpress_local\morikun-taiyaki-local」です。)

「wp_local_morikun_taiyaki」を「C:\xampp\htdocs\wordpress_local」の中に移動

データベースの作成

XAMPPのコントロールパネルを開き、「MariaDB(MySQL)」と「Apache」を起動。

「MariaDB(MySQL)」と「Apache」を起動する

「phpMyAdmin」画面を開きます。データベースを作成するため、画面上部のメニューの「データベース」をクリック。

「phpMyAdmin」画面を開き、メニューの「データベース」をクリック。

画面が開くのでデータベースを作成していきます。

「データベース」画面

  • データベース名:ご自由に命名してください。私は「wp_local_morikuntaiyaki」と命名しました。
  • 照合順序:「utf8_general_ci」

と入力したら「作成」ボタンをクリック。

「データベース名」と「照合順序」を入力し「作成」ボタンをクリック

(このデータベース名は、後の工程で設定ファイル(wp-config.php)に入力します。なので、「Sticky Notes」か何かにメモしておくと良いかと思います。)

データベース名は好みで付けてよいのですが、ハイフン付きのデータベース名をつけたい場合は注意が必要です。詳細は省きますが、「phpMyAdminで作成したハイフン付きのテーブル名でエラーになる」という記事を参考にしてみてください。

データベースが作成され、画面左に表示されるテーブル一覧に追加されます。

データベース作成完了画面

テーブルをインポート

画面左のテーブル一覧から先ほど作成したデータベース名「wp_local_morikun_taiyaki」をクリックして、インポート画面を開きます。

インポート画面

下記の通り入力します。

  • アップロードファイル:解凍したバックアップの中にある「sql」とついてるファイルを選択。
  • ファイルの文字セット:utf-8
  • Partial import(部分インポート):チェックをつける。
  • 「外部キーのチェックを有効にする」:チェックをつける。
  • フォーマット:SQL
  • SQL互換モード:NONE
  • 値がゼロのモノに対してAutoIncrementを使用しない:チェックつける。
  • エンコーディングへの変換:なし

入力したら「実行」ボタンをクリック。

データベースをインポートするための情報を入力

 

データベースをインポートするための情報を入力(見切れてる部分)

インポートが完了すると下記のように表示されます。

インポート完了後に表示される画面

テーブル一覧から「wp_local_morikun_taiyaki」をクリックすると、データが投入されていることが分かります。サーバーのブログと同じ内容が入ってるなぁとざっくり確認してください。

データが投入されていることを確認

設定ファイル(wp-config.php)の変更

続いて「設定ファイル(wp-config.php)」の変更をします。

エクスプローラーから「wp-config.php」をテキストエディタで開きます。ファイルは「C:\xampp\htdocs\wordpress_local\morikun-taiyaki-local」の中にあります。

設定ファイル(wp-config.php)のあるディレクトリ

このとき、必ず 「UTF-8 の BOM なし (UTF-8N)」 に対応したエディタを使ってください。私は普段テキストエディタとして利用している「サクラエディタ」で開きました。

また、変更前にバックアップを必ず取りましょう。

下記箇所を変更します。

編集前の「wp-config.php」ファイル

このように変更してください。

  • データベース名:先ほど作成したデータベースの名前。今回は「wp_local_morikun_taiyaki」
  • ユーザー名:phpMyAdminのログインユーザー名
  • パスワード:phpMyAdminのログインパスワード
  • ホスト名:localhost

変更後は下記のようになります。

編集後の「wp-config.php」ファイル

// ** MySQL 設定 - この情報はホスティング先から入手してください。 ** //
/** WordPress のためのデータベース名 */
define('DB_NAME', 'wp_local_morikun_taiyaki');

/** MySQL データベースのユーザー名 */
define('DB_USER', 'phpMyAdminのログインユーザー名');

/** MySQL データベースのパスワード */
define('DB_PASSWORD', 'phpMyAdminのログインパスワード');

/** MySQL のホスト名 */
define('DB_HOST', 'localhost');

変更が完了したら保存してファイルを閉じてください。

インポートしたテーブルのドメイン名をローカル用に置換

インポートしたテーブルのドメイン名はサーバー上でのドメイン名です。

そこで、「Search Replace DB」というスクリプトを用いてローカル用のドメイン名に置換します。

まずは「Search Replace DB」の公式サイトにアクセスします。

「Search Replace DB」の公式サイトのトップページ

スクロールしていくと、下記のようなフォームが表示されます。

「Search Replace DB」公式サイトの入力フォーム

下記の通り入力してください。

  • I accept this script can be a security risk:チェックをつける。
  • I understand that this script must not be left in a public facing web server:チェックをつける。
  • I am a developer and I know what I’m doing!:チェックをつける。
  • Name*:自分の名前
  • Organisation Name:組織名を入力したい場合は入力してください。
  • Email*:メアドを入力
  • Would you like to receive our newsletter?:ニュースレターを受け取りたい場合はチェックを。年間12通以下だし、少し気になるのでチェックを入れてみました(笑)

入力したら「SUBMIT」ボタンをクリック。すると、フォームに入力したメールアドレス宛にダウンロードリンクが記載されたメールが届きます。

入力フォームに必要事項を入力

 

 

「Search Replace DB」公式サイト入力フォームの「SUBMIT」ボタン

メールを開きます。

「Search Replace DB」のダウンロードリンクが記載されているメール

英語だとわかりにくい場合、「メッセージを翻訳」をクリックすると日本語に変換できます。

「Search Replace DB」のダウンロードリンクが記載されているメール(翻訳後)

「ダウンロード検索はDBのV 3.1.0を交換してくださいここ 。」の「ここ」をクリックして「Search Replace DB」をダウンロードします。

ダウンロードした「Search Replace DB」を解凍し、「C:\xampp\htdocs\wordpress_local\morikun-taiyaki-local」の中に移動します。

「Search Replace DB」を「morikun-taiyaki-local」の中に移動

ブラウザに「C:\xampp\htdocs\wordpress_local\morikun-taiyaki-local/Search-Replace-DB-master/」と入力して開くと下記画面が表示されます。

「Search Replace DB」を開いたときの画面

「接続エラー」が表示された場合。

「詳細設定」をクリック。

接続エラー画面

「localhostにアクセスする(安全ではありません)」をクリックすると、「Search Replace DB」の設定画面が開きます。

「詳細設定」をクリック後

「Search Replace DB」の設定画面を開いたとき、「Warning」が表示される場合の対応方法は本記事の最後のほうに記載の『「Search Replace DB」の設定画面で「Warning」が表示される場合』で解説してあります。

下記の通り入力します。

  • replace:サーバー上のサイトのURL
  • with:ローカルサイトのURL
  • database:先ほど「wp-config.php」に入力した情報が自動で入力されています。内容が正しいか確認してください。
  • tables:all tables

「Search Replace DB」に必要事項を入力

入力が完了したら「dry run」ボタンをクリックします。

「Search Replace DB」の「dry run」ボタン

置換する項目を確認します。

置換する項目を確認

確認が済んだら、「live run」ボタンをクリックして実行します。

「Search Replace DB」の「live run」ボタン

「準備OKですか?」とポップアップが表示されるので、「OK」ボタンをクリックします。

「Search Replace DB」の確認ポップアップ

置換が完了したら結果が表示されます。

置換後の画面

置換が完了したら必ず「delete me」ボタンをクリックします。

「delete me」ボタン

「live run」ボタンと同様に「本当に削除しますか?」というポップアップが表示されるので「OK」ボタンをクリックします。

削除していいか確認するメッセージ

削除が完了したら下記のように表示されるので、エクスプローラーを開いてちゃんと削除されてるか確認してください。

削除後の画面

この通り、フォルダの中から削除されています。

「Search Replace DB」がフォルダから削除されている。

「.htaccess」をローカル用に合わせる

「.htaccess」をローカル用に変更します。(「.htaccess」ファイルは「C:\xampp\htdocs\wordpress_local\morikun-taiyaki-local」の中にあります。)

「.htaccess」ファイルのあるディレクトリ

設定ファイルの変更と同様に、ファイルを更新する前には必ずバックアップを取りましょう。

下記箇所を変更します。

編集前の「.htaccess」ファイル

変更内容は2つで、

  • RewriteBase /最初の工程で作成したフォルダ/名前変更したバックアップフォルダ/
  • RewriteRule . /最初の工程で作成したフォルダ/名前変更したバックアップフォルダ/index.php [L]

と変更します。

変更後は下記のようになります。

編集後の「.htaccess」ファイル

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /wordpress_local/morikun-taiyaki-local/
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /wordpress_local/morikun-taiyaki-local/index.php [L]
</IfModule>

変更が完了したら保存してファイルを閉じてください。

「.htaccess(ドットエイチティーアクセス)」とは:サーバーのディレクトリごとの設定情報を記載しているファイルです。特定のファイルやディレクトリのアクセスを禁止したり、HTTP 404(Not Found:未検出)エラーページのカスタマイズをすることができます。

ローカルサイトにアクセスできるか確認

実際にローカルサイトにアクセスできるか確認しましょう。

URLは「http://localhost/最初の工程で作成したフォルダ/名前変更したバックアップフォルダ/」です。私の場合は「http://localhost/wordpress_local/morikun-taiyaki-local/」です。

ローカルサイトにアクセス

続いて、ログイン画面にアクセスできるか確認しましょう。

URLは「http://localhost/最初の工程で作成したフォルダ/名前変更したバックアップフォルダ/wp-admin」です。私の場合は「https://localhost/wordpress_local/morikun-taiyaki-local/wp-admin」です。

ログイン画面にアクセス

無事ログインできたら完了です。

ローカルサイトのダッシュボード

備考

ローカルサイトにログインできたら、サーバー上のサイトと紛らわしいのでパスワードをサーバー上のサイトと違うものに変更しておくと良いです。間違ってサーバー上のサイトを弄ってしまわないためにも。

「Search Replace DB」の設定画面で「Warning」が表示される場合

「Search Replace DB」の設定画面を開いたときに下記のように「Warning」が表示されたので対応法を簡潔に紹介します。

「Search Replace DB」の「Warning」エラー

結論としては「srdb.class.php」ファイルを開いて、エラーメッセージの箇所を修正すればOKです。

エラーメッセージは「 “continue” targeting switch is equivalent to “break”. Did you mean to use “continue 2”? 」です。

テキストエディタでエラー箇所である「861」行目を開いて「continue;」を「continue 2;」とすれば動きます。

修正前

編集前の「srdb.class.php」ファイル

switch( $encoding ) {

// Tables encoded with this work for me only when I set names to utf8. I don't trust this in the wild so I'm going to avoid.
case 'utf16':
case 'utf32':
//$encoding = 'utf8';
$this->add_error( "The table \"{$table}\" is encoded using \"{$encoding}\" which is currently unsupported.", 'results' );
continue;
break;

default:
$this->db_set_charset( $encoding );
break;
}

修正後

編集後の「srdb.class.php」ファイル

switch( $encoding ) {

// Tables encoded with this work for me only when I set names to utf8. I don't trust this in the wild so I'm going to avoid.
case 'utf16':
case 'utf32':
//$encoding = 'utf8';
$this->add_error( "The table \"{$table}\" is encoded using \"{$encoding}\" which is currently unsupported.", 'results' );
continue 2;
break;

default:
$this->db_set_charset( $encoding );
break;
}

あまりいい方法ではない気がしますが、とりあえずこうしてみました。

他の解決策は発見ならず。

上記以外の解決策が無いかといくつか試してみましたが、残念ながら解決にいたらず。参考に備忘録として何をしたかを残しておきます。

「Warning」を無視して続行

「Warning」を無視して、通常の流れ通りに入力後「dry run」をクリック。

「The script encountered an error while running an AJAX request.If you are using your hosts file to map a domain try browsing via the IP address directly.If you are still running into problems we recommend trying the CLI script bundled with this package.See the README for details.」というポップアップが表示されるので断念。

「Warning」を無視して「dry run」をクリック後に表示されるエラーメッセージ

旧バージョンをダウンロード

ダウンロードリンクが記載されたメールから「V 2.1.0を使用します」をクリックして旧バージョンをダウンロード。

「V 2.1.0を使用します」をクリックする

解答した後、フォルダを移動してから、「http://localhost/wordpress_local/morikun-taiyaki-local/searchreplacedb2.php」を開く。

「searchreplacedb2.php」ファイルを移動

画面に従って、「Submit」ボタンをクリック。

「searchreplacedb2.php」の「Submit」ボタン

データベースの詳細を入力して「Submit DB details」をクリック。

「searchreplacedb2.php」の「Submit DB details」ボタン

 

エラーが表示されるので断念。

「searchreplacedb2.php」の「Fatal error」

おわりに

以上が、ローカル環境にコピーサイトを構築する手順です。少し複雑かと思いますが手順通り進めていけば誰でもできるはずです。

この2週間、転職活動のかたわらHTMLやCSSの復習もしていたため、コピーサイトが完成した今、早くサイトのカスタマイズをしたい気持ちで溢れております(笑)

コメント

タイトルとURLをコピーしました