*

【保存版】WordPressのサイトをmacのローカル環境にコピーして動かす方法

公開日: : 最終更新日:2015/02/07 Web技術・ノウハウ, Wordpress , , ,

wordpress_on_mac

WordPerssで作った既に公開中のWebサイトについて、サイトを丸ごとローカル環境に持ってきて動作させたいときがあります。

例えば、

  • 「新しい機能を実装したいけれど、稼働中のサイトにいきなり適用するのは怖い」
  • 「サイトのデザインを色々と変えながら、しっくりくるものを選んで本番サイトに適用したい」

といったケースです。

ローカル環境でなら何を試しても、どんな失敗をしてもサイトを見る人に迷惑がかかることはありませんよね。思う存分トライアンドエラーを繰り返してから本番のリモートサーバに適用する、というやり方ができます。

このように便利なローカル環境ですが「作りたくても作り方がわからない!」という場合もあるのではないでしょうか?

そこで今回は、リモートサーバ上のWordPressサイトをmac上で再現する方法をご紹介します(※)。自分のmac上に開発環境を作ってみたい人は是非参考にしてみてください。

※macを使いますが、基本的な考え方はWindowsでも同じです。

 

事前準備:FTPソフト、MAMPのインストール

作業を始める前に、以下を揃えてください。

  • FileZillaなどのFTPソフト
  • MAMP(Free版で大丈夫です)

それぞれダウンロードしてmacにインストール〜初期設定まで済ませているという前提で、以下の話を進めます。

なおこの記事では MAMP 3.0 を使っていますが、旧バージョンのMAMP 2.0を使っても問題ありません。要はphpmyadminが使えれば良いということです。新たにMAMPをインストールする場合は、2014.6現在の最新版であるMAMP3.0を使うと良いでしょう。

※MAMP3.0のインストール〜初期設定の手順についてはこちらの「ねこみみすくーる」さんのページでわかりやすく解説されています。

 

FTPソフトでサーバのファイル一式をダウンロード

ローカル側にディレクトリ作成

まずローカルマシン側の「/Applications/MAMP/htdocs/」の下にWordPressファイル一式を入れるディレクトリ(フォルダ)を作ります。ディレクトリ名はどう付けても自由ですが、ドメイン名の一部を使うなどわかりやすいものにしましょう。

ここでは「/Applications/MAMP/htdocs/」の下に「yukari」ディレクトリを作成しています。

FTPでダウンロード

今度はFTPでリモートサーバにアクセスし、WordPressのファイル一式すべてを上記のディレクトリ内にダウンロードします。

リモートサーバからWordPressファイル一式ダウンロード

ダウンロードが完了するまでにしばらく時間がかかりますので、その間に以下の工程を進めましょう。

 

ローカルのphpmyadminでデータベースを作成

MAMPを立ち上げ「サーバを起動」をクリックしてからスタートページを開きます。

スタートページからphpmyadminを開き、データベースを新規作成します。このデータベース名も特に決まりはありませんが、上述のディレクトリ名と同じにしておいた方がわかりやすいでしょう。

DB作成

ここでは「yukari」というデータベースを作成しています。

 

ダウンロードしたwp-config.phpを編集

FTPでダウンロードしたファイルの中から「wp-config.php」を探してテキストエディタで開きます。リモートサーバのユーザー名・パスワードなどが記載されている部分を、ローカル側のサーバ、つまりMAMPの設定情報(※)に合わせて書き換えます。

※DBユーザー名、パスワード、ホスト名はMAMPのスタートページに表示されています。

基本的には以下のようになるでしょう。

  • 「DB名」→ ローカルのphpmyadminで作ったデータベース名
  • 「DBユーザー名」→ root
  • 「パスワード」→ root
  • 「MYSQLのホスト名」→ localhost

140623-0035

修正が終わったら上書き保存してファイルを閉じます。

 

リモートサーバのphpmyadminからSQLファイルをダンプ

phpmyadminを使ってサイトのDBデータをダンプ(出力)します。

レンタルサーバなどのWordPressサイトを稼働させているリモート側サーバの管理画面にログインしてください。ログインしたらphpmyadminを開き、以下の手順でデータを出力します。

① 出力するDBを選択

データを出力したいWordPressサイトのデータベースを選択し、「エクスポート」タブを開きます。

140624-0009

② オプションをチェック

以下の赤で囲んだオプションにもチェックを入れます。

140624-0010

③ ファイルに保存をチェック

「ファイルに保存する」のチェックボックスをONにします。

140624-0011

あとは実行ボタンを押してSQLファイル(○○.sql)をダウンロードして、ローカルのどこかに置いておけばOKです。

 

【例】スターサーバープラスの場合

以下はネットオウルのスタードメインでドメインを取ると無料で付いてくるスターサーバープラス(※)のphpmyadminです。

※)この制度は廃止されたようです。現在、新たにスタードメインを申し込んでもスターサーバープラスは付いてきません。中々便利だったので惜しいですね。

リモートサーバのDBをダンプ

 

 

ローカルのphpmyadminで作ったDBにリモートサーバのダンプファイルをインポート

ローカル側のphpmyadminを開き、前段でダンプ(出力)したSQLファイルを取り込みます。

phpmyadminの「インポート」タブを開いて、「アップロードファイル」でサーバからダンプしたSQLファイルを選んで「実行」ボタンを押します。

ダンプファイルの取り込み

ローカルのデータベースに、リモートサーバのテーブルとデータがインポートされました。

ローカルへのダンプファイル取り込み完了

 

DBに取り込んだデータのURLをローカル環境用に変換

WordPressは投稿ページや各種設定情報をデータベース上に保存していますが、このデータの中にはURLを含むものもあります。このようなURLはドメイン名(○○.comなど)を含むもので、そのままではローカル環境では使えません。ローカル環境で正しく動作させるためには、DBデータ中のURLをローカル環境用のものに置換する必要があるということです。

自力でURLを置き換えるのは大変ですので、以下のサイトで公開されている無料(※)のURL変換ツールを使います。

※)GPL V3 ライセンスです。今回の使用目的なら特に意識する必要はありません。

DATABASE SEARCH AND REPLACE SCRIPT IN PHP

DATABASE SEARCH AND REPLACE SCRIPT IN PHP

変換ツールは現在β版のバージョン3.0.0と、旧版のバージョン2.1.0がダウンロードできるようになっています。

URL変換ツールダウンロード

特に理由がなければ、最新版のV3.0.0 BETAを使えば良いでしょう。

以下、ツールを使ってURLを変換するまでの手順です。

バージョン3.0.0(Search-Replace-DB-master)を使う場合

上記のサイトで「DOWNLOAD V 3.0.0 BETA」をクリックして、Search-Replace-DB-master.zipをダウンロードします。ファイルを解凍し、「Search-Replace-DB-master」ディレクトリをwp-config.phpと同じ階層に置いてください。

次にブラウザから「http://localhost:8888/ディレクトリ名/Search-Replace-DB-master/」にアクセスします。以下のような設定画面が表示されますので、変換前・変換後のURL、DBユーザー名・パスワード・ホストを設定してください。

※ページが表示されずダウンロードのダイアログが開いてしまうときは、ルートディレクトリの.htaccessファイルを削除してください。

140623-0036

最初は「dry run」をクリックします。これはテスト実行で、「もし変換処理を実行したらどうなるか?」がわかります。dry run の場合、実際にはURL変換は行われていません。

テスト実行で問題がなければ、「live run」で本番実行です。これで実際にURL変換処理が行われます。

 

【補足】バージョン2.1.0(searchreplacedb2.php)を使う場合

もしバージョン3.0.0の方法がうまくいかない場合、こちらの方法を試してみてください。

→ バージョン3.0.0で問題なければこちらをクリックして次の工程へ

上述のサイトで「V 2.1.0 STABLE」をクリックして、searchreplacedb21.zipをダウンロードします。 このファイルを解凍すると「searchreplacedb2.php」というファイルが現れますので、これをwp-config.phpのある階層に置いてください。

ブラウザから「http://localhost:8888/ディレクトリ名/searchreplacedb2.php/」にアクセスし、以下の手順でURL変換を行います。

※ページが表示されずダウンロードのダイアログが開いてしまうときは、ルートディレクトリの.htaccessファイルを削除してください。

 

【STEP1】DB接続用の情報をwp-config.phpから読み込むようセット

まず、1ページ目はそのままの状態で「submit」ボタンを押します。

【STEP1】searchreplacedb2.php

【STEP2】DBアクセス用情報の設定

次にローカルのDBへアクセスするための情報をセットします。STEP1でチェックを入れてあるため、wp-config.phpの値が読み込まれているはずです。

【STEP2】searchreplacedb2.php

【STEP3】URL変換対象のDBテーブル指定

URL変換処理を行う対象のテーブルを指定します。通常はそのままで構いません。「Continue」ボタンを押して次へ進みます。

【STEP3】searchreplacedb2.php

【STEP4】変換するURLの文字列設定

変換する対象のURLと、変換後のURLを設定します。

【STEP4】searchreplacedb2.php

間違いが無いか確認して、「Submit Search string」ボタンを押せば変換処理が実行されます。

 

変換されたURLのチェック

意図したとおりにURLが置き換えられたか確認します。

ローカルのphpmyadminを開き、URL変換をしたDBの「wp-options」テーブルを選択してください。そのまま「表示」タブをクリックし、1行目のデータ「site_url」のURLがローカル環境用のものになっているか確認しましょう。

変換されたURLのチェック

URLが変換されないとき

ありがちな凡ミスは、URL変換ツールで変換前URLに”www”が必要なケースなのに付け忘れるパターンです。その場合には、前項のSTEP4からやり直しましょう。

 

パーマリンク更新(.htaccessの更新)

ブラウザから「localhost:8888/ディレクトリ名/wp-login.php」にアクセスします。

ローカル環境のWordPressにログインし、管理画面の「パーマリンク設定」を開いてそのまま「変更を保存」をクリックしてください。これで.htaccessファイルがローカル環境用に更新されます。

※.htaccessファイルはルートディレクトリにあります。(wp-config.phpがある階層)

この作業をしないと.htaccessがローカル環境に合わないため、投稿ページなどを開こうとしたときに「Not Found」と表示されてしまいますのでご注意ください。

 

以下はパーマリンクを更新する前(左)と後(右)の.htaccessの違いを比較したものです。

htaccessの比較

「RewriteBase」と「RewriteRule」のパスが変更されていることがわかりますね。

 

以上でローカル環境の構築完了です。お疲れさまでした!

 

まとめ

ここまでローカル環境でWordPressを動かす方法をご説明してきましたが、いかがでしたでしょうか?

このような作業は頻繁に行うことはないと思いますが、それだけにいざやろうとすると「どうやるんだっけ?」となりがちですよね。必要なときが来たら、改めて読み返していただければと思います。# 私自身もそうするつもりです。

もしこの手順を試してもうまくいかなかったところなどあればお知らせください。

以上、「WordPressのサイトをmacのローカル環境にコピーして動かす方法」でした。

PR

関連記事

Rubyで小数点第2位以下を切り捨てる方法

Rubyには標準で便利なメソッドがたくさん用意されています。数値の取り扱いについてもNumericク

記事を読む

Intuitive Custom Post Order

ドラッグ&ドロップだけ!『Intuitive Custom Post Order』は投稿一覧のページ並び順をスイスイ変更できるプラグイン

WordPressの投稿一覧の各投稿ページをカンタンに並べ替えできるプラグイン『Intuitiv

記事を読む

Simple Custom CSS

『Simple Custom CSS』はテーマをいじらずちょっとCSSを編集したいときに便利なプラグイン

CSSだけ編集したいけれどWordPressのテーマを直接編集するのは避けたい、かといって子テーマを

記事を読む

Code Snippets プラグイン

これでテーマの更新も怖くない!『Code Snippets』はfunctions.phpを編集できるWordPressプラグイン

WordPressのfunctions.phpファイルを直接編集せずにカスタマイズできるプラグイ

記事を読む

brewでmacのOpenSSLをバージョンアップ

macでローカル環境のopensslをバージョンアップする手順 〜 brewで更新→rbenvでrubyを再インストール 〜

先日自社の運営サイトのSSL証明書の更新作業をしたのですが、ローカル環境として使っているmacで

記事を読む

WordCamp2014tokyo

WordCamp2014 Tokyo に行ってきました。

もう一週間ほど経ってしまいましたが、先週末に初めてのWordCamp(WordCamp Toky

記事を読む

Active Preview ボタン

『Active Preview』で編集内容をリアルタイムプレビュー

最近使ってみたWordPressプラグイン『Active Preview』が便利だったのでご紹介しま

記事を読む

Crayon Syntax Highlighter

【入れるだけ】投稿記事中のコードをキレイに表示!『Crayon Syntax Highlighter』はシンタックスハイライトをかけるプラグイン

WordPressの投稿記事中のコードをキレイに表示できるプラグイン「Crayon Syntax

記事を読む

Revision Control

ムダな履歴データの蓄積をストップ!『Revision Control』で投稿ページ・固定ページの変更履歴をスマートに管理

投稿ページ・固定ページの「変更履歴」を制御するプラグイン『Revision Control』をご

記事を読む

WordPressの子テーマで画像が表示されないときはstylesheet_directoryを使っているか確認する

WordPressの子テーマで画像が表示されないときはstylesheet_directoryを使っているか確認する

先日とあるお客様のWordPressサイトで「画像が表示されない」と相談を受けました。 Wor

記事を読む

PR

コメントを残す

PR

【Git】一つ前のcommitに戻す/他のブランチのcommitを取り込む

久しぶりにRailsでプログラムを書いている関係で、これまた久しぶりに

WordPressの子テーマで画像が表示されないときはstylesheet_directoryを使っているか確認する
WordPressの子テーマで画像が表示されないときはstylesheet_directoryを使っているか確認する

先日とあるお客様のWordPressサイトで「画像が表示されない」

おすすめGoogle拡張リスト
【保存版】情報収集を快適に!Chromeに入れておきたいオススメ拡張(エクステンション)8個

私はChromeをメインブラウザとして使っていますが、その理由のひとつ

Rubyで小数点第2位以下を切り捨てる方法

Rubyには標準で便利なメソッドがたくさん用意されています。数値の取り

BootstrapでWordPressサイトをレスポンシブデザイン化
【やって覚える】BootstrapでWordPressサイトをレスポンシブデザイン化する方法

  先日Googleから「4/21以降、サイトのスマホ

→もっと見る

  • feedlyでフォロー RSS登録ボタン
  • 株式会社YUKARIでは、ホームページリニューアルをメインにWeb制作事業を行っています。既存サイトへのWordPress導入・レスポンシブデザイン化からSEO強化まで何でもご相談ください。 ホームページリニューアルをお考えの方からのお問い合わせをお待ちしております。
PAGE TOP ↑