当ブログ「ultimate-ez.com」もオープンから5ヶ月を迎え、早くも現状のデザインに飽きて来ました。
このブログの運営目的の一つが、本業であるWebディレクターとしての仕事における実験場としての活用。
そのくせ、最近は「映画の感想記事」のアップにはまってしまって、実験場としてはうまく運用できていませんでした。
ただ、ここいらで、ぼちぼち「とりあえず作ってみました」感あふれるデザインから、一歩進んだ良い感じのデザインにしたいところ。
でも、“テンプレート作ってデザイン改修”ってなかなか大事なわけで。いきなり本番サイトで走らせるわけにはいかないもので。
それならば、デザイン改修のためだけのコピーサイトを、ローカル環境に構築していろいろといじり倒しながら新テンプレを作ってみることにしました。
そんなわけで、現状ロリポップのレンタルサーバーで運用している「ultimate-ez.com」をまるっとローカル環境へコピーしたわけですが、、、
これが、地味ながらも意外に大変な作業で。。。
今後同じような作業をやることもあるだろうな〜ってことで、「wordpress環境をローカル環境にコピーするためにやったこと」を、備忘録として残しておきたいと思います。
まずはwordpress関連ファイルをまるっとコピー
これは特に何も考えること無く、サーバーの「wordpress関連のファイル」を全コピー。
僕が使っているサーバーは「ultimate-ez.com」だけが置いてあるので、「ルート配下のファイル全部」をコピー。
ローカルの環境は「MAMP」なので、コピー先は「アプリケーション>MAMP>htdocs」です。
※MAMPの環境を、いろいろ別の目的でも使うのであれば、htdocsの中に任意のフォルダを作って、そこにコピーしてください。
ファイルのコピーはもちろんFTPで。
ちなみに、僕は、よくわからず背伸びしてそこそこお高いMacアプリを買ってしまったんですが、こいつの使いこなし方も勉強しなくちゃな〜。。。
データベースのコピー
データベースのコピーは、単なるコピペというわけにはいかないので、ちょっとめんどくさい!
ロリポップサーバーでの場合は以下の手順が必要です。
1. コピー元のDBをエクスポート
1-1. ロリポップのマイページへログイン。
1-2. 「WEBツール」から「データベース」を選択。
1-3. 「サーバー名」「ユーザー名」を確認。
1-4. 「パスワード確認」をクリックして、「パスワード」を確認。
1-5. 「phpMyAdminを開く」をクリック。
1-6. 先ほど確認した「ユーザー名」「データベース名」「パスワード」を入力。「サーバーの選択」から「サーバー名」を選択。
1-7. 「実行する」をクリック。
1-8. 左カラムから、1-6で確認した「データベース名」のデータベースを選択。
・テーブル:全選択
・生成オプション−追加コマンド:[DROP TABLE / VIEW …コマンドの追加]にチェック
※空のDBにコピーしますが念のためDROPコマンドを追加しておきます。
◆あとは全て「デフォルト設定」のまま。
1-11. 「実行する」をクリック。
⇛ダウンロードフォルダに「<データベース名>.sql」のファイルが生成される。
2. ローカル環境へDBをインポート
2-1. ローカル環境の「phpMyAdmin」を開く
※MAMP環境だと「http://localhost:8888/MAMP/?language=Japanese」から「phpMyAdmin」タブを選択。
2-2. 左カラムから任意のDBを選択。既存DBのを使わない場合は、新DBを作成
※既存DBを使う場合、「テーブル名」の整合性が取れなくなる可能性があるため、DB内の全テーブルを削除しておくのが安全。
2-3. 「インポート」タブを選択。アップロードファイルとして、1-11でダウンロードした「<データベース名>.sql」を選択。
2-4. 「実行」をクリック。
これでDBのコピーは完了です!!
あとは細かい環境設定!
1. DBのオプションを変更(2箇所)。
1-1. 「wp_options」というテーブルの「site url」のoption_value「siteurl」を、サイトのURLから、ローカル環境のURL(http://localhost:8888/wordpress/)に置き換え。
1-2. 「wp_options」というテーブルの「site url」のoption_value「home」を、元サイトのURLから、ローカル環境のURL(http://localhost:8888/wordpress/)に置き換え。
1-3. 「wp-config.php」を以下のように修正する。
[php] /** WordPress のデータベース名 */define(‘WP_CACHE’, true); //Added by WP-Cache Manager
define(‘DB_NAME’, ‘◆◆◆◆◆◆◆◆◆’);
/** MySQL のユーザー名 */
define(‘DB_USER’, ‘◆◆◆◆’);
/** MySQL のパスワード */
define(‘DB_PASSWORD’, ‘◆◆◆◆’);
/** MySQL のホスト名 (ほとんどの場合変更する必要はありません。) */
define(‘DB_HOST’, ‘◆◆◆◆◆◆◆◆◆’);
/** データベーステーブルのキャラクターセット (ほとんどの場合変更する必要はありません。) */
define(‘DB_CHARSET’, ‘utf8’);
/** データベースの照合順序 (ほとんどの場合変更する必要はありません。) */
define(‘DB_COLLATE’, ”);
[/php]
変えるべきは「DB_NAME」「DB_USER」「DB_PASSWORD」「DB_HOST」。
「DB_NAME」こそ任意ですが、それ以外の値はデフォルトのままであれば「root」「root」「localhost」
と、これで完了のはず!
以下のローカル環境に、コピー元と同じデザイン&同じ中身のサイトが構築されるはずです。
http://localhost:8888
ちなみに、「広告」や「アクセス解析ツール」は、ローカル環境では外しておくのがベターのようです。
特に「広告」は、誰も見ることのないローカル環境に配信しているわけですから、ペナルティを食らう可能性すらありますので要注意!!
というわけで、wordpress環境のローカルへのコピーの手順でした。
さて、ここから「新テンプレ」をちまちまと作っていくことにしましょう。
一番やりたいのは、「wp-touch」というプラグインで対応していたスマホ最適化。
これを自作でガッチリとやりたい!
具体的には2012年のWebのトレンドだった「レスポンシブデザイン」へ挑戦したいと思います。
ちょうど「WebDesigning」っていう雑誌が「レスポンシブ」についての特集を組んでいるので、まずはがっつりと読み込んでから「新テンプレ」を作りたいと思います。
ひとまずは、3月中のデザイン変更を目標に!!
マイナビ
コメントを残す