Shifter Github Plugin/Theme Installer を使って自作テーマ・プラグインをアップデートしよう #JP_Getshifter

Shifter Advent Calendar 2019 2日目です。この記事では2019年9月にリリースされた Shifter Github Plugin/Theme Installer プラグインを使った自作のWordPressテーマ・プラグインの更新を紹介します。

Shifter Github Plugin/Theme Installer プラグイン とは

Shifterではユーザーに対しサーバーへのアクセス権を提供していません
このため一般的なサーバーとは異なり、自作のテーマやプラグインをShifter上のWordPressにインストールしようと思った場合、zipファイルのアップロードが必要でした。またこの方法は初回のみであれば手間ではないのですが、アップロード済みのテーマ・プラグインのファイルを差し替え(更新)する場合はいちいちテーマやプラグインを削除してzipファイルをアップロードする必要があり、テーマ・プラグイン開発者からすると大変面倒です。
この「面倒」を解消するためにリリースされたのが「Shifter Github Plugin/Theme Installer」です

Shifter Github Plugin/Theme Installer プラグインを公開しました

Shifter Github Plugin/Theme Installer を使ってGitHubのリポジトリにある自作のテーマやプラグインを登録るすと、ShifterのWordPressでも手軽にインストール・アップデートできます。

登録自体はGitHubのリポジトリのURLを入力するだけです。後述しますが、リリース用パッケージを作ることでWordPressダッシュボードからテーマ・プラグインを更新することもできます。

自作のテーマ・プラグインを更新したい時

Shifter Github Plugin/Theme Installer を使って登録した自作のテーマ・プラグインを更新したい場合はGitHubリポジトリでリリースパッケージが作られていて、かつWordPressにインストールされてるテーマ・プラグインよりも新しいバージョンナンバーである必要があります。
*インストールのみであればリリースパッケージがあればいいですが、ダッシュボードから更新する場合はバージョン番号も新しくなってる必要があります。

CodeタブのReleasesをクリックすると出ます

リリースパッケージですが、tagを作って自分でzipを用意すればGitHubのページ上でマニュアルで作成することもできます。

ただし、都度zipファイルを用意するのは大変面倒ですので、Shifter Github Plugin/Theme Installer で紹介されてるようにGitHub Actionsを使って自動でリリースパッケージを作ってみましょう。

GitHub Actions を使ったリリースパッケージの作成

GitHub Actionsは2019年11月に正式リリースされてるので、どのユーザーでも使えるようになっていると思います。自分のリポジトリで「Actions」タブが出ているか確認しましょう。

サンプルワークフローをテーマ・プラグインのリポジトリに含める

Shifterですでにプラグインとテーマのサンプルを用意しています。

プラグインのサンプル
https://github.com/getshifter/shifter-github-hosting-plugin-sample

テーマのサンプル
https://github.com/getshifter/shifter-github-hosting-theme-sample

それぞれのリポジトリにある .github/workflows/release.yml を自分のテーマ・プラグインのリポジトリにコピーしておきましょう。

release.yml の書き換え

コピーした release.yml の中身を自分のテーマ・テーマプラグインに合わせて書き換えます。同時にテーマの style.css プラグインファイルなどバージョン番号が記載されてる部分の書き換えも必要となります。
ここではテーマを例に説明します。

composer と npm の設定

リリースパッケージのビルドに composer や npm を使う場合は

    # - name: composer install
    #   run: composer install

    # - name: npm clean install
    #   run: npm ci

これらのコメントアウトを外しましょう

バージョン番号の自動付与

GitHubアクションで style.css のバージョン番号をgitのタグ名に置き換えします。
style.css のバージョン部分は Version: {release version} としておきましょう。

PACKAGE_NAME の変更

PACKAGE_NAME: "shifter-github-hosting-theme-sample" が2箇所あるので shifter-github-hosting-theme-sample を自分のテーマ(プラグイン)のリポジトリ名にしましょう

FILES_TO_ARCIVE は適宜変更

FILES_TO_ARCIVE の部分はリポジトリ内にあるどのファイル(ディレクトリ)をリリースパッケージに含めるか、という設定です。サンプル以外のディレクトリやファイルを追加(削除)したい場合は適宜変更しましょう。

FILES_TO_ARCIVE: "*.php *.md *.css *.txt *.png LICENSE phpcs.xml.dist inc/ js/ languages/ layouts/ template-parts/"

ここまでで自分用のrelease.ymlの編集は終わりです。

タグ=リリースバージョンとしてpushしよう

ここまで準備できて、コミットもOKとなったら

$ git tag 1.1.0
$ git push origin 1.1.0

で、タグ=リリースバージョンとしてpushしましょう。
GitHubのリポジトリにタグがpushされると GitHub Actions が動作します。成功・失敗・ログもリポジトリのActionsから閲覧できます。

WordPressでテーマ・プラグインの更新

リリースパッケージが作成されたらダッシュボード>更新にアクセスしましょう(Shifterは再起動しなくでも良い)

gitのタグ=バージョン番号を新しく(大きく)しておけば更新があることが表示されます。

アイキャッチ画像は作成してないテーマなので空欄(バグではない)

あとは通常のテーマやプラグインと同じく更新することが可能です。

なお、テーマの場合は子テーマでも問題なく動作します(子テーマの場合最低限style.cssがあれば良い)
この記事を書くにあたって作成したTwenty Fifteen の子テーマのサンプルリポジトリはこちらになります。

https://github.com/gatespace/twentyfifteen-child

それでは良きShifterライフを!
現場からは以上です。