Wordpressのローカル環境を構築したい時の選択肢

・MAMP
・XAMMP
・Local by flywheel
・Docker
・Wocker
おそらく一番簡単なのは3つめのLocal by flywheelだと思います。
私の場合は前者3つが手持ちのPC(MacOS13)で使えなかったので、Dockerでできる方法を調べました。

Dockerとは？

PCの中にコンテナと呼ばれる仮想環境を構築できるシステム。
チーム開発で違うPCを使っていても、全く同じ開発環境を用意できるので便利。
さらに詳しく知りたい方は、かめさんのDocker超入門①〜Dockerってなに？〜【初心者向け】でまず勉強するといいと思います。

Dockerによるローカル環境を構築

最初、初心者｜Docker-ComposeでWordPressとMySQLとphpMyAdminのローカル環境の構築を参考に、wordpressのローカル環境を構築した所、管理画面にはアクセスできるが、イメージ画像や背景色を変えても解決しないという問題が発生した。

そこでQ&Aサイトで質問した所、丁寧に解説していただいたのでそれを記録として残す。

①プロジェクトファイルの中にymlファイルを作成

terminal.

$ touch docker-compose.yml

ymlファイルに以下をコピペ

docker-compose.yml


version: '3.7'

networks:
  wordpress:
    ipam:
      config:
        - subnet: 172.25.0.0/16

services:

  # here is out mysql database
  db:
    image: mysql:5.7
    volumes:
      - ./db:/var/lib/mysql:delegated
      # - ./docker/db-dumps:/docker-entrypoint-initdb.d:delegated
    ports:
      - "3306:3306"
    restart: always
    environment:
      MYSQL_ROOT_PASSWORD: somewordpress
      MYSQL_DATABASE: wordpress
      MYSQL_USER: wordpress
      MYSQL_PASSWORD: wordpress
    networks:
      - wordpress

  # here is our wordpress server
  wordpress:
    depends_on:
      - db
    image: wordpress:latest
    volumes:
      # our persistent local data re routing
      - .:/var/www/html/wp-content/themes/testing:delegated
      - ./plugins:/var/www/html/wp-content/plugins
      - ./uploads:/var/www/html/wp-content/uploads
      - ./uploads.ini:/usr/local/etc/php/conf.d/uploads.ini
    ports:
      - "80:80"
    restart: always
    networks:
      - wordpress
    environment:
      # our local dev environment
      WORDPRESS_DEBUG: 1
      DEVELOPMENT: 1
      # docker wp config settings
      WORDPRESS_DB_HOST: db:3306
      WORDPRESS_DB_USER: wordpress
      WORDPRESS_DB_PASSWORD: wordpress
      WORDPRESS_DB_NAME: wordpress
      WORDPRESS_AUTH_KEY: 5f6ede1b94d25a2294e29eeba929a8c80a5ac0fb
      WORDPRESS_SECURE_KEY: 5f6ede1b94d25a2294e29eeba929a8c80a5ac0fb
      WORDPRESS_LOGGED_IN_KEY: 5f6ede1b94d25a2294e29eeba929a8c80a5ac0fb
      WORDPRESS_NONCE_KEY: 5f6ede1b94d25a2294e29eeba929a8c80a5ac0fb
      WORDPRESS_SECURE_AUTH_SALT: 5f6ede1b94d25a2294e29eeba929a8c80a5ac0fb
      WORDPRESS_LOGGED_IN_SALT: 5f6ede1b94d25a2294e29eeba929a8c80a5ac0fb
      WORDPRESS_NONCE_SALT: 5f6ede1b94d25a2294e29eeba929a8c80a5ac0fb
      WORDPRESS_CONFIG_EXTRA: |

        /* Development parameters */
        define('WP_CACHE', false);
        define('ENVIRONMENT', 'local');
        define('WP_DEBUG', true);

        /* Configure mail server */
        define('WORDPRESS_SMTP_AUTH', false);
        define('WORDPRESS_SMTP_SECURE', '');
        define('WORDPRESS_SMTP_HOST', 'mailhog');
        define('WORDPRESS_SMTP_PORT', '1025');
        define('WORDPRESS_SMTP_USERNAME', null);
        define('WORDPRESS_SMTP_PASSWORD', null);
        define('WORDPRESS_SMTP_FROM', 'whoever@example.com');
        define('WORDPRESS_SMTP_FROM_NAME', 'Whoever');

        /* add any more custom wp-config defines here */

  # here is our mail hog server
  mailhog:
    image: mailhog/mailhog:latest
    ports:
      - "8025:8025"
    networks:
      - wordpress

docker-composeをアップ

terminal.

$ docker-compose up -d

(この時点でもlocalhost:80につなげば管理画面にアクセスできる)

uploads.ini ファイルを作成・編集

正常に動いていたらuploads.iniフォルダができているので、その中にuploads.iniというファイルを新規作成し、以下を追記して保存

uploads.ini

file_uploads = On
memory_limit = 2000M
upload_max_filesize = 2000M
post_max_size = 2000M
max_execution_time = 600

もし自作のテーマを入れたい場合

この時点で自作したテーマのphpファイルを挿入しておく。

http://localhost:80 にアクセス。wordpressの管理画面が表示されてればok。