Zenn
🔥

【WordPress/Docker】開発環境を構築

2023/04/24に公開
Docker
WordPress
tech

前提

Dockerの環境構築が終わっていること。
コンテナ名やパスワード等は適宣、置き換えてください。

環境

  • Windows 10 Pro
  • Docker v4.12.0
  • WordPress v6.1
  • PHP v7.4
  • apache
  • MySQL v8.0.18

ディレクトリ構造

wordpress-blog
├─docker
│  ├─mysql
│  │  ├─costom.cnf
│  │  ├─Dockerfile
│  └─wordpress
│     ├─Dockerfile
│  └─.env
│  └─docker-compose.yml
└─web

準備

docker/docker-compose.yml
version: "3.8"
services:
  wordpress_web:
    build:
      context: ../
      dockerfile: ./docker/wordpress/Dockerfile
    image: wordpress_web
    container_name: wordpress_web
    ports:
      - "8080:80"
      - "443:443"
    volumes:
      - ../web:/var/www/html
    links:
      - wordpress_db
  wordpress_db:
    build:
      context: ../
      dockerfile: ./docker/mysql/Dockerfile
    image: wordpress_db
    container_name: wordpress_db
    environment:
      MYSQL_ROOT_PASSWORD: rootpass
      MYSQL_DATABASE: wordpress
      MYSQL_USER: useruser
      MYSQL_PASSWORD: passpass
    ports:
      - "3306:3306"
    volumes:
      - ../docker/mysql/custom.cnf:/etc/mysql/conf.d/custom.cnf
      - wordpress_db_data:/var/lib/mysql
volumes:
  wordpress_db_data:
docker/.env
COMPOSE_PROJECT_NAME=wordpress

# syntax=docker/dockerfile:1
FROM php:7.4-apache

RUN apt-get update
RUN apt-get install -y libfreetype6-dev libjpeg62-turbo-dev libpng-dev libzip-dev zip libicu-dev
RUN docker-php-ext-install pdo pdo_mysql mysqli iconv gd

# syntax=docker/dockerfile:1
FROM mysql:8.0.18

# When your application needs to interact with UTF-8.
ENV LANG C.UTF-8

[mysql]
default-character-set=utf8mb4
[mysqld]
character-set-server=utf8mb4
collation-server=utf8mb4_general_ci
max_allowed_packet=32M
[client]
default-character-set=utf8mb4

WordPressのインストール

wordpress ダウンロードページ

ダウンロードしたWordPressのzipファイルを解凍し、「Web」ディレクトリにコピーしておく。

コピー後のディレクトリ構造は以下のようになっています。

wordpress-blog
├─docker
│  ├─mysql
│  │  ├─costom.cnf
│  │  ├─Dockerfile
│  └─wordpress
│     ├─Dockerfile
└─web
    ├─wp-admin
    ├─wp-content
    ├─wp-include
省略

Docker 立ち上げ

powershellなどで、wordpress-blog/dockerのディレクトリにcdコマンドで移動し、下記コマンドを実行。

docker compose up --build

Dockerのビルドが終わったら、

http://localhost:8080

にブラウザにアクセスすると、WordPressのセットアップの画面になります。

docker-compose.ymlで設定したものを入れましょう。

情報に間違いなければ次の画面へ進みますので、インストールを実行します。

WordPressのログイン画面の設定になります。
好きなものでいいですが、ログインに必要になりますので、忘れずにメモしておきましょう。

先程、設定したログイン情報でログインすると無事にWordPressの管理画面になりました。

よく使うコマンド

コマンド 内容
docker-compose up コンテナを作成して、起動します。オプションで-dをつけることでバックグラウンドで実行することができます。
docker-compose start サービスを開始します。これは既にコンテナがある状態でなければなりません。
docker-compose stop サービスを停止します。
docker-compose build サービス（wordpress_web,wordpress_db）のビルドを実行します。
docker ps コンテナの一覧を表示します.
docker exec -it コンテナ名 sh コンテナへ入る。
docker ps でコンテナ名 （Namesのとこ）調べることができる。
mysql -u root -p mysqlにrootで接続。

※パスワードは、docker-compose.ymlの「MYSQL_ROOT_PASSWORD: rootpass」のところ。

プラグインをインストールする時にFTP情報を求められる場合の対処法

Dockerで構築した後、プラグインなどをインストールしようとすると、FTPの情報を求められることがあります。

対処法

wp-config.php　のファイルに、

define('FS_METHOD','direct');

を追記します。（私は一番下に追記しました）
画面を更新して、再度チャレンジしてみると無事プラグインをインストールできました。

すでにあるWordPressの環境を作りたいなら「All-in-One WP Migration」のプラグインがおすすめ

※SiteGurdのプラグインをインストールしている場合は、無効化しておいた方がいいです。

コピー元のWordPressに「All-in-One WP Migration」のプラグインをインストールし、データをエクスポート。開発環境のWordPressにも、「All-in-One WP Migration」を使ってデータをインポートする。

作業は、プラグインをインストールして、有効化していれば、管理画面の左ツールバーに出ています。

「サイトの最大アップロードサイズを超過しています: 2 MB」　が出たときの対処法

web/.htaccess　のファイルを編集します。
end wordpressの下に追記しました。

# END WordPress

php_value memory_limit 30G
php_value post_max_size 20G
php_value upload_max_filesize 10G

画面を更新し、再度アップロードを試していると無事に成功しました。

SiteGurdのプラグインでエラーが出てログインできなくなった場合の対処法

SiteGurdでエラーが出てログインできません。

データベースから無効化するのは、大変そうなので、
wp-content/plugins/sitegurd
のディレクトリ名を適当に変更してあげます。
ログイン画面を更新すると無事にログインすることができました。

パーマリンクを変更すると、404エラーでページが表示されないときの対処法

固定ページを自分で決めたURLにしたく、パーマリンクの設定を変えました。

すると、うまくページが表示されなくなってしまいました。。。

.htaccess
apache2.conf
の順で確認していきます。
.htaccessを見てみると、

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

こちらはきちんと設定が反映されています。（ここに何も記載されていなかったら権限が原因？）
条件が 「RewriteEngine On」の時に～となっているので、こちらがOFFになっているなどの原因がありそうです。

apache.confのAllowOverrideを変更

Dockerのコンテナの中に入りコマンドを入力していきます。
私の環境のコンテナ名はwordpress_webでした。

docker exec -it wordpress_web sh

rewriteのモジュールがちゃんとあるか確認。

ls -l /usr/lib/apache2/modules/mod_rewrite.so
-rw-r--r-- 1 root root 67624 Apr  3 22:22 
/usr/lib/apache2/modules/mod_rewrite.so

apache2.confの編集。ファイルの場所は、/etc/apache2/apache2.conf

変更前

<Directory /var/www/>                              
    Options Indexes FollowSymLinks
    AllowOverride None
    Require all granted                               
</Directory>

変更後

<Directory /var/www/>                                                               
    Options Indexes FollowSymLinks 
    AllowOverride All             
    Require all granted                     
</Directory>

apacheの再起動

service apache2 restart

ここまで設定しても、まだエラーが解消されません。
調べてみると、httpdのファイルを編集する記事が多くでてくるのですが、私の環境だとhttpdファイルが見当たりません。

どうやら、Devian系かRedHat系で変わるようです。

/etc/debian_versionとあるので、私の環境はDevian系でした。

コマンドでモジュールを有効化します。

# a2enmod を実行
a2enmod

>>Your choices are: access_compat actions alias allowmethods asis auth_basic auth_digest auth_form authn_anon authn_core authn_dbd authn_dbm authn_file authn_socache authnz_fcgi 
authnz_ldap authz_core authz_dbd authz_dbm authz_groupfile authz_host authz_owner authz_user autoindex brotli buffer cache cache_disk cache_socache cern_meta cgi cgid charset_lite data dav dav_fs dav_lock dbd deflate dialup dir dump_io echo env expires ext_filter file_cache filter headers heartbeat heartmonitor http2 ident imagemap include info lbmethod_bybusyness lbmethod_byrequests lbmethod_bytraffic lbmethod_heartbeat ldap log_debug log_forensic lua macro md mime mime_magic mpm_event mpm_prefork mpm_worker negotiation php7 proxy proxy_ajp proxy_balancer proxy_connect proxy_express proxy_fcgi proxy_fdpass proxy_ftp proxy_hcheck proxy_html proxy_http proxy_http2 proxy_scgi proxy_uwsgi proxy_wstunnel ratelimit reflector remoteip reqtimeout request rewrite sed session session_cookie session_crypto session_dbd setenvif slotmem_plain slotmem_shm socache_dbm socache_memcache socache_redis socache_shmcb speling ssl status substitute suexec unique_id userdir usertrack vhost_alias xml2enc
Which module(s) do you want to enable (wildcards ok)?

a2enmodコマンドを打つと、色々出てきました。

どれを有効化したいんだい？っと聞いてきているので、rewriteを入力します。

apache2を再起動します。

service apache2 restart

少しタイムラグありましたが、無事にパーマリンクの設定ができました。

参考

図解! Dockerのツボとコツがゼッタイにわかる本
Docker&仮想サーバー完全入門　Webクリエイター＆エンジニアの作業がはかどる開発環境構築ガイド

Discussion