WordPressのテーマを自動デプロイする

WordPressのテーマをGithubにPushするだけで、デプロイできるとのことで試してみた。
コードを書いてからの手間暇が凄く軽減され、予想以上に楽で快適。
5行ほどCSSを変更しただけでも、数クリックで10分以内に本番用WordPressに適用できる。

参考サイト
Github から WordPress のテーマを自動更新するとめちゃくちゃ快適だった。
toro_unit

今回は@Toro_Unitさんの記事の後半、自動デプロイを自サイトに設定した際の手順を紹介します。

自動デプロイに必要な環境

たった二つである。

  1. Githubリポジトリ
  2. WordPressプラグイン:WP-Pusher

Githubでは「Webhooks」という仕組みがあり、リポジトリに変更があった際に、指定のWebサイトへ通知を送ってくれる。
WordPress側でプラグインを入れておいて、その通知を受け取ってテーマを取得&更新する仕組み。
実際の処理としては、Githubが何のリポジトリにどういうコミットがあったか、json形式でPostを投げている。
テーマだけでなくプラグインなどにも使える模様。

WP-Pusherをインストール

WP-Pusherは基本的に、有料で提供されている。
「Pricing」や「Buy Now」が大きく表示されていると思う。
ただし、オープンソースかつ公開プロジェクトに限って無償使用が可能。
Pricingの下の方とかに

For open source code, in public repositories, WP Pusher is 100% free to use. Download it here.

とかあるので、その辺からメールアドレスを入力する画面へ飛ぶ。
そうすると、ダウンロード用アドレスを送ってくれる。
メール記載のアドレスからZipをダウンロードして展開、WordPressへアップロードしてインストール。
有効化したらWP Pusherがダッシュボードに出る。
wp-pusher01
WP-Pusher > Install themeへ移動してリポジトリとか入力する。この辺はTro_Unitさんの記事通り
有料ライセンスならプライベートリポジトリにも使えるのだろうけども、グレーアウトしている。
ちなみにPHP5.4.x以下だとPHPの文法エラーで有効化できなかった。現在PHP5.4系はEOLでサポート終了のため、レンタルサーバーで最新版に変更。さくらインターネットのレンタルサーバーなら「標準のPHP」でOKでしょう。というか、そんな便利システムがあるのに、何故かPHP5.3固定にしていた。

Theme was successfully installed. Go ahead and activate it.

完了したらWP-Pusher > Themesへ移動。
「テーマがインストール済み」とエラーが出たら、一旦該当テーマを削除してインストールするか、Dry runボックスにチェックを入れるんだと思う。(当方では未検証)

Githubの設定

wp-pusher02
WP-Pusher > Themes
ここのPush-to-Deploy:URLへGithubは通知を投げる。
トークンとかあれこれ含めてWP-Pusherが生成してくれている。
これをGithubの方へ登録する。
wp-pusher03
テーマを管理しているリポジトリの
Settings > Webhooks & services > add webhooks
Payload URLにPush-to-Deploy:URLを貼り付けて、保存。

URLはWordPressインストールディレクトリでなく、サイトのルートを指定。
 https://autumnsky.jp/?wppusher-hook&token=xxx
上記のようなURL形式とすること。

設定は以上である。
ここではまってしまったのだが、デフォルトではWordPressのインストールディレクトリを取得することがある。
当サイトではWordPress本体はwordpressディレクトリに配置しているため、

Push-to-Deploy:URL
https://autumnsky.jp/wordpress?wppusher-hook&wppusher-hook&token=xxxx

WP-PusherによるデフォルトがWordPressディレクトリとなり、そのまま貼り付けてもGithubでエラーとなっていた。

Push後の通知状況の確認

それでは、Pushしてみてください。Gitクライアントでは何も起きません。
なので、PushしたらGithubから状況を確認する。
Webhooksに登録したサイトURLが出ている。
他にも登録すればここに表示されるはず。
wp-pusher04
URLをクリックで設定と最新の通知状況が確認できる。
チェックマークはおそらく最新の1件の状況。
先の設定画面の下にRecent Deliveriesがある。
Githubから通知が成功していれば、緑のチェックマークがつく。
Recent Deliveriesの3件のうち、一番下が不成功
(先の宛先URL間違いの時のログ)
wp-pusher05
 
以上である。
私のテーマ作成はWockerというWordPress用仮想化環境をローカルで走らせながら、PHP/CSSを書いている(プリプロセッサはStylus、バージョン管理は当然Git)。従来の方法ではFTPでレンタルサーバーに接続してアップロードとなるが、これは面倒な上に間違えやすそうだ。
自動化しておくと、コードを書いた後が楽で確実なのでちょっとした更新もすぐに反映できる。また、レスポンシブレイアウトの確認も実機から本番用をすぐに見られる。
自動化最高かよ… な気分になれる、メリットしかない。