Wordpressなどのツールは便利ですが、ローカルであらかた確認してからサーバーにアップすれば制作もスピードアップします。

MAMPでローカル開発できるだけでもすばらしいのですが、Windowsから見れたら便利だなーと思ってつぶやいたら方法教えてもらえた！

MAMPとVMWare FusionとMacを使ってより効率的にWordpressサイトを制作しよう！

実現したいこと：

  • 管理するサイト毎に異なるURLで確認
  • Windows（バーチャルマシン）でもMacでも確認（これは同じネットワーク内にあるWindowsマシンでも可能な気がする）

/private/etc/hostsの設定

不可視ディレクトリです。僕はxFoldersで探しました。ルート権限でないと書き込みできないのでターミナルで

cd /private/etc/
sudo chmod 666 hosts

として書き込みできるようにします。中を見ると

127.0.0.1    localhost

とあるので、これに倣って

127.0.0.1    hogehoge.localhost

などを追加します。編集し終わったら権限を戻します。

/Application/MAMP/conf/apache/httpd.confの設定

MAMPディレクトリの中です。まずポートの設定。Windowsからも複数サイトを別々に確認したいので必要なサイトの分だけポート番号を設定します。

Listen 8888

という所があるので

Listen 8001

などと追加します。8889はMySQLなので使えません。8000番あたりは空いているようです。ここら辺はあまり詳しくないです。そしてホスト名です。一番最後に

<VirtualHost *:8001>
DocumentRoot "/Applications/MAMP/htdocs/hogehoge"
ServerName hogehoge.localhost
</VirtualHost>

と追加します。

Wordpressの設定

ルートは/Applications/MAMP/htdocs/hogehogeになりますのでここにWordpressなど必要なファイルを置きます。

設定＞一般設定のWordpressのURLとサイトのURLを設定します。当初Windowsで確認しないで進めるなら

  • http://hogehoge.localhost:8001/wp/
  • http://hogehoge.localhost:8001/

などと設定します。Firefoxなどで確認してあらかた出来上がったら、Windowsでも確認できるように変更します。

  • http://x.x.x.x:xxxx/wp/
  • http://x.x.x.x:xxxx/

x.x.x.xはMacのローカルIPです。xxxxは上で設定したポート番号です。Windowsから見る場合はlocalhostでは見えないのでポート番号がたよりです。最初からローカルIP＋ポート番号で設定しといてもいいと思います。IEでこのURLを叩けばバーチャルマシン側から表示確認もWordpressの管理もできます。

サーバーに移動

ローカルでの制作が終わったら、本番に移行しましょう。データベースをエクスポートして、wp-optionsテーブルにある“siteurl”と“home”を本番サーバーのものに変更、本番のデータベースでインポート。wp-config.phpのデータベース接続情報を変更してWordpressディレクトリをアップ。管理画面にアクセスできたら成功！だったかな。本番への移行はちょっとうろ覚えです。

参考