ローカルにWordPress開発環境を整えてテーマを作成することがあるのですが、単にローカルに環境を作っただけでは記事がなく、テーマのイメージが分かりません。@It_is_Rです。
かといって、testtestを繰り返して記事をつくるのも大変ですし、やっぱり自分のサイトをそのままローカルの開発環境にも反映させたいのでございます。
そんなわけで、今回はDocker Composeを使ったローカル開発環境に、自分のWordPressサイトを反映させる方法を紹介します。
Docker ComposeでローカルにWordPressの環境を整える
ではまず、Docker Composeを使ってローカルにWordPressの環境を整えてみましょう。
まず、好きな場所にフォルダを作り、その中へ移動します。今回は「mysite」というフォルダを作成しました。
$ mkdir mysite $ cd mysite
そこにdocker-compose.ymlというファイルを作成します。
$ vim docker-compose.yml
docker-compose.ymlの中は以下のようにします。
version: '3'
services:
wp:
image: wordpress:latest
ports:
- "80:80"
depends_on:
- mysql
volumes:
- ./wordpress:/var/www/html/
environment:
WORDPRESS_DB_PASSWORD: p4ssw0rd
WORDPRESS_DB_NAME: wp
restart: always
mysql:
image: mysql:5.7
environment:
MYSQL_ROOT_PASSWORD: p4ssw0rd
MYSQL_DATABASE: wp
volumes:
- ./db-data:/docker-entrypoint-initdb.d
restart: always
さらに、次のコマンドを実行します。
$ docker-compose up
しばらくしてからhttp://localhost/を確認すると、WordPressの初期設定の画面が表示されます。
確認できたら、いったんctrl + cでストップします。
自分のサイトをローカルのWordPress環境に反映させる
続いて、自分のサイトをローカルに反映させたいと思います。
必要なデータは自分のサイトの「wp-content」フォルダ、データベース、そしてSearch Replace DB masterです。これらはあらかじめ準備しておいてください。
この「Search Replace DB master」は、後ほどurlを書き換える時に使用します。
こちらからダウンロードしておきましょう。
さて、この状態で現在のディレクトリを確認してみると、「db-data」と「wordpress」というフォルダが増えているのが分かります。
このdb-dataフォルダの中に、自分のWordPressサイトのデータベースファイル(xxxxx.sql)を入れます。
また、wordpressフォルダの中の、wp-contentを自分のサイトのwp-contentに置き換えます。
さらにwordpressフォルダの中に、先ほどダウンロードしたSearch-Replace-DB-masterを入れてください。
このままでは先ほどのコンテナが残っていますのでdownしておきましょう。
$ docker-compose down Stopping mysite_wp_1 ... done Stopping mysite_mysql_1 ... done Removing mysite_wp_1 ... done Removing mysite_mysql_1 ... done Removing network mysite_default
もう一度立ち上げてみましょう。今度はオプションをつけてバックグラウンドで起動してみます。
$ docker-compose up -d Creating mysite_mysql_1 ... done Creating mysite_wp_1 ... done
しばらく待ってみて、もう一度http://localhost/を開いてみます。
すると、自分のサイトがそっくりそのまま見れるようになります。
リンク先を変更する
しかしこのままだと、例えば記事へのリンクをクリックすると、本当のサイトへリンクされてしまいます。
そこで、リンク先をローカルのものに変更しましょう。
http://localhost/Search-Replace-DB-master/を見てみます。
すると次のような画面が表示されます。
search for… : 元のurl
replace width … : 新しいurl
つまり今回は「search for…」の部分に自分のサイトのURL（xxxxx.comなど）を、「replace width…」の部分にlocalhostと入力します。
もしsslを使っている場合は、「search for…」の部分に「https://xxxxx.com」、「replace width…」の部分に「http://localhost」と入力すればいけるみたいです。
そしてまず「dry run」をクリックして、問題がなければ「live run」を押します。
これでURLが変更され、ローカルのページへのリンクに書き換わります。
まとめ
ローカルにWordPress開発環境を整えてテーマを作成するとき、やはり本来のサイトとローカルのサイトは同じものにしたいです。
今回はリモートのWordPressサイトを、Docker Composeを使ったローカルの環境にそのまま反映させる方法を紹介しました。
