Zenn
Open18

WordPress.comでGitHubデプロイメントを試す

WordPress
ちあきちあき

リポジトリを接続をクリックすると、GitHubの接続画面

リポジトリを限定する。今回はham.works用のWordPressリポジトリ。

ちあきちあき

リポジトリ接続。ブランチはmainのまま。

Destination directory: The server folder you want to deploy the files. For plugins, it will be /wp-content/plugins/my-plugin-name. For themes, it will be /wp-content/themes/my-theme-name. For a partial site deployment (i.e., multiple plugins or themes), you can use /wp-content. The contents of a repository will be merged with the existing contents of the WordPress site on the specified directory.

とのことなので、移動先ディレクトリは/wp-contentを指定してみます。
自動デプロイメントは一旦オフのままにします。あとで多分変えられるでしょ。多分。

ちあきちあき

ビルド関係とか含まれないからこれ高度なデプロイしないとだめだな？

ちあきちあき

実はあんまりGitHub Actions書いたことなくてわかんない……(´・ω・｀)
これは知ってる人に聞きながらつくることにするので一回休憩

ちあきちあき

とりあえず動かしてみる(｀・ω・´)
どうせまだ公開されてないんだから壊したところでやり直せばいい！！！！

ちあきちあき
wpcom.yml
name: Publish Website

on:
    push:
        branches:
            - main
    workflow_dispatch:
jobs:
    Build-Artifact-Action:
        name: Build-Artifact-Action
        runs-on: ubuntu-latest
        steps:
            - uses: actions/checkout@master
            - uses: php-actions/composer@v6
            - uses: actions/setup-node@v4
              with:
                  node-version: '18'
                  cache: 'npm'
            - run: npm install
            - run: npm run build
            - name: Upload the artifact
              uses: actions/upload-artifact@v4
              with:
                  name: wpcom
                  path: |
                      .
                      !style.css
                      !node_modules
                      !README.md
                      !.editorconfig
                      !.eslintignore
                      !.eslintrc
                      !.prettierrc.js
                      !.stylelintrc.json
                      !.wp-env.json
                      !composer.json
                      !composer.lock
                      !package.json
                      !package-lock.json
                      !tailwind.base.config.js
                      !tsconfig.json
                      !.git
                      !.gitignore

これを実行してみる

ちあきちあき

デプロイは wp-content配下だけでいいのでpathを調整する

wpcom.yml
name: Deploy to wp.com

on:
    push:
        branches:
            - add/deploy-to-wpcom
    workflow_dispatch:
jobs:
    Build-Artifact-Action:
        name: Build-Artifact-Action
        runs-on: ubuntu-latest
        steps:
            - uses: actions/checkout@master
            - uses: php-actions/composer@v6
            - uses: actions/setup-node@v4
              with:
                  node-version: '18'
                  cache: 'npm'
            - run: npm install
            - run: npm run build
            - name: Upload the artifact
              uses: actions/upload-artifact@v4
              with:
                  dev: no
                  name: wpcom
                  path: |
                      ./wp-content/**
                      !**/node_modules/**
                      !**/package.json
                      !**/postcss.config.js
                      !**/tailwind.config.js
                      !**/webpack.config.js

だいぶんスッキリ。

ちあきちあき

このpathにしたら、wordpress.com側の設定画面の「移動先ディレクトリ」は/wp-contentにしておく。じゃないとルートに展開される