GitHub のプライベートリポジトリで管理している WordPress テーマをプラグイン (WP Pusher) を使って、インストール/アップデートする。

# ０．はじめに

AWS EC2 [AMIMOTO](https://ja.amimoto-ami.com/) で [WordPress](https://wordpress.com) サイトを構築して、

* [AMIMOTO AMI を使って、WordPress を立ち上げて、接続先を RDS に変更してみる \- Qiita](https://qiita.com/kusokamayarou/items/58d550b82b960c321c3a)

[CloudFront](https://aws.amazon.com/jp/cloudfront/) やら [ALB](https://docs.aws.amazon.com/ja_jp/elasticloadbalancing/latest/application/introduction.html) やら [AWS WAF](https://aws.amazon.com/jp/waf/) を適用したりと…、

* [SSL 化済みの WordPress サイトに CloudFront を適用してみる \- Qiita](https://qiita.com/kusokamayarou/items/21e4bcdaa7c8dd8523ab)
* [CloudFront 適用済みの WordPress サイトに ALB を適用してみる \- Qiita](https://qiita.com/kusokamayarou/items/1229bed12462eee48e68)
* [CloudFront 適用済みの WordPress サイトに ALB を適用後、ALB \- WordPress 間を HTTP\(80番\) で通信させてみる \- Qiita](https://qiita.com/kusokamayarou/items/edffa0f1159f60a2ce82)
* [CloudFront 適用済みの WordPress サイトに AWS WAF も適用してみる \- Qiita](https://qiita.com/kusokamayarou/items/099a97fc0edc493e22fb)
* [CloudFront と AWS WAF 適用済みの WordPress \(AMIMOTO\) サイトで、ウェブモニタリング \(Site24x7 & StatusCake\) からのポーリングをブロックさせない様にしてみる \- Qiita](https://qiita.com/kusokamayarou/items/9b1093c922b6642fc26f)

色々やってまして…、

そろそろ適用しているテーマを [GitHub](https://github.com/) で管理して、[WordPress](https://wordpress.com) のプラグインからインストール/アップデートしたいな、と思いやってみました。

※ [2020.07.13追記]

[Shifter](https://www.getshifter.io/) 移行後の環境での構成は、こちら。

* [Shifter 移行後の WordPress テーマの GitHub を使ったリリース管理とその適用について試してみた。 \- Qiita](https://qiita.com/kusokamayarou/items/7901a93ea788962cce22)

# １．[GitHub](https://github.com/) のサインアップと各種設定

1. 連携用アカウントを作成します。
    * [GitHub へのサインアップ \- GitHub ヘルプ](https://help.github.com/ja/github/getting-started-with-github/signing-up-for-github)
1. 今回は、Organization　の個別リポジトリで [WordPress](https://wordpress.com) テーマを管理したいので、作成します。
    * [新しい Organization をゼロから作成 \- GitHub ヘルプ](https://help.github.com/ja/github/setting-up-and-managing-organizations-and-teams/creating-a-new-organization-from-scratch)
1. 作成した Organization にプライベートリポジトリを作成します。
    * [リポジトリを作成する \- GitHub ヘルプ](https://help.github.com/ja/github/getting-started-with-github/create-a-repo)
1. 作成したプライベートリポジトリに、作成した連携アカウントへの `Write` 権限を追加設定します。
    * [Organization のリポジトリ権限レベル \- GitHub ヘルプ](https://help.github.com/ja/github/setting-up-and-managing-organizations-and-teams/repository-permission-levels-for-an-organization)
    * ![FireShot Capture 292 - Manage access - github.com.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/161939/abc81d0f-8be5-0c48-2105-0d2afc8b0331.png)
1. 作成したプライベートリポジトリに、[WordPress](https://wordpress.com) テーマを登録します。
    * [GitHub からリポジトリをクローンする \- GitHub ヘルプ](https://help.github.com/ja/github/creating-cloning-and-archiving-repositories/cloning-a-repository-from-github)
    * [Git を使用する \- GitHub ヘルプ](https://help.github.com/ja/github/using-git)
    * ![FireShot Capture 293 - genbasupport_genba-support-theme - github.com.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/161939/26b05301-dcd4-4aa2-0315-45673786e6f6.png)
1. 作成した連携アカウントの「Personal access tokens」を作成します。
    * [GitHub「Personal access tokens」の設定方法 \- Qiita](https://qiita.com/kz800/items/497ec70bff3e555dacd0)
    * ![FireShot Capture 301 - Edit personal access token - github.com.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/161939/78476b86-7598-5970-579b-a014b079efe3.png)


# ２．[WP Pusher](https://wppusher.com/) のサインアップと各種設定

今回は、有料の [WP Pusher](https://wppusher.com/) というサービスのプラグインを利用することにしました。色々と調べたり、試したりしたんですが…、使い勝手なども考慮するとコレが一番良かったです。

因みに、パブリックリポジトリだと無料で使えます。

1. [WordPress Git deployments with WP Pusher](https://wppusher.com/#pricing) にアクセスし、加入したいプランの「Buy now」ボタンを押下します。今回は、最終的に連携させるサイトが６以上ありましたので、Agency プランにしました。
    * ![FireShot Capture 294 - WordPress Git deployments with WP Pusher - wppusher.com.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/161939/07deab2c-b7e3-fd42-9094-5d0c00393059.png)
1. 「Checkout」ページが表示されるので、クレジットカードの情報を入力し、「Buy WP Pusher」ボタンを押下します。
    * ![FireShot Capture 296 - WP Pusher - dashboard.wppusher.com.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/161939/97674853-5998-4944-f317-d4ce129a0ad0.png)
1. 決済完了メールが届くので、[ログインページ](https://dashboard.wppusher.com/login) からログインします。
    * ![FireShot Capture 297 - WP Pusher - dashboard.wppusher.com.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/161939/a5206713-86e8-830c-e6d9-1491e3ecde4b.png)
1. ログイン後のページの「Your WP Pusher license key is:」にライセンスキーが表示されるので、コピーしておきます。
    * ![FireShot Capture 298 - WP Pusher - dashboard.wppusher.com.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/161939/82db7911-2ac9-543c-c9ca-c965c541b645.png)
1. [WordPress](https://wordpress.com) にインストールする [WP Pusher](https://wppusher.com/) のプラグインを、「Download WP Pusher (Latest: v3.0.2)」リンクをクリックして、ダウンロードします。
    * ![FireShot Capture 298 - WP Pusher - dashboard.wppusher.com.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/161939/2bde6432-69a6-4c25-e5a4-be5968baf050.png)

# ３．[WordPress](https://wordpress.com) に [WP Pusher](https://wppusher.com/) のプラグインのインストールと各種設定、インストール、アップデート

1. ダウンロードしたプラグインの ZIP ファイルを、[WordPress](https://wordpress.com) にインストールし、有効化します。
    * [ZIP形式で配布されているプラグインの取得と手動インストール \- WordPressの使い方](https://www.adminweb.jp/wordpress/plugin/index2.html#section2)
1. 左側ペインに「WP Pusher」が表示されるので、選択し、「License」タブで以下の項目を入力し、「Activate site license」ボタンを押下し、サイトをアクティベートします。
    * License key : [ライセンスキー]
    * ![FireShot Capture 303 - WP Pusher ‹ 【Shifter 検証用】現場クラウド Conne — WordPress - testgenbasupportcom.local.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/161939/6fb72857-f8cf-0a8c-8323-98860ce5c628.png)
1. 「GitHub」タブを選択後、以下の項目を入力し、「Save GitHub token」ボタンを押下し、プライベートトークンを保存します。
    * GitHub token : [プライベートトークン]
    * ![FireShot Capture 302 - WP Pusher ‹ 【Shifter 検証用】現場クラウド Conne — WordPress - testgenbasupportcom.local.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/161939/0f0473eb-0cb7-a3c3-53e1-a1eb579b7266.png)
    * ※ 上記の手順ではなく、「Obtain a GitHub token」ボタンからでも良いかと。
<br>
1. 「Log」タブを選択後、以下の項目を入力し、「Enable logging」ボタンを押下します。
    * ![FireShot Capture 300 - WP Pusher ‹ 【Shifter 検証用】現場クラウド Conne — WordPress - testgenbasupportcom.local.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/161939/40de062a-fed5-e62c-0cd9-019b0ee98ea7.png)
1. 左側ペインの「WP Pusher」の下の「Install Theme」を選択し、以下の項目を入力し、「Install Theme」ボタンを押下し、テーマをインストールします。
    * Repository host : GitHub
    * Theme repository : [グループ名]/[リポジトリー名]
    * Repository branch : -
        * ※今回は、master を使いますが、適当に。
    * Repository subdirectory : -
        * ※リポジトリのディレクトリ構成に合わせて。
    * Repository is private : ☑︎
    * Push-to-Deploy : -
        * ※今回は、ノーチェックですが、適当に。
    * Link installed theme : -
        * ※既にインストール済みの場合、チェックを入れるみたいです。
    * ![FireShot Capture 304 - Install Theme ‹ 【Shifter 検証用】現場クラウド Conne — WordPress_ - testgenbasupportcom.local.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/161939/a322bfc4-737b-5dc5-fdb3-3c81aa6ab876.png)
1. 左側ペインの「WP Pusher」の下の「Themes」を選択し、インストールしたテーマを確認します。「Update Theme」ボタンを押下することで、テーマがアップデートされます。
    * ![FireShot Capture 306 - WP Pusher Themes ‹ 【Shifter 検証用】現場クラウド Conne — WordPress_ - testgenbasupportcom.local.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/161939/49e8c1bf-13e3-bcf2-d95f-5a6e54d4e15b.png)


# ９９．ハマりポイント

* 今回は結構ハマりました…。

* 今回、[GitHub](https://github.com/) をリポジトリ先のサービスとして利用しましたが…、実は、当初は [GitLab](https://about.gitlab.com/) を利用しようと思っていたんですよね…。

* それで、[GitLab](https://about.gitlab.com/) で利用できる [WordPress](https://wordpress.com) のプラグインを色々調べたり、試したりしてみたんですが…、なかなか使い勝手の良いプラグインが見つからなくて…。で、よくよく考えたら、[GitLab](https://about.gitlab.com/) じゃなくて、[GitHub](https://github.com/) の方がメジャーだし、プラグインもノウハウもたくさんあるし、そっちの方が良いんじゃ無いか？と気付くまでに結構時間が掛かっちゃいました…。
    * [WordPress Git deployments with WP Pusher](https://wppusher.com/wordpress-gitlab)
    * [krafit/wp\-gitlab\-updater: WordPress plugin to get updates for themes and plugins from private GitLab repos — can also be implemented into a plugin or theme\.](https://github.com/krafit/wp-gitlab-updater)
    * [afragen/github\-updater: This WP plugin will update GitHub, Bitbucket, GitLab, and Gitea hosted plugins and themes](https://github.com/afragen/github-updater)
    * [WordPress GitHub Sync – WordPress plugin \| WordPress\.org](https://wordpress.org/plugins/wp-github-sync/)
    * [Revisr – WordPress plugin \| WordPress\.org](https://wordpress.org/plugins/revisr/)
    * [getshifter/shifter\-github](https://github.com/getshifter/shifter-github)

* なので、今回 [WP Pusher](https://wppusher.com/) を使いましたが、改めて [GitHub](https://github.com/) ベースで、色々なプラグインを試してみると、他にも最適なプラグインがある様な気もします。

* 今後、[Shifter](https://www.getshifter.io/) 使おうかなとも思ってるので、素直に [getshifter/shifter\-github](https://github.com/getshifter/shifter-github) を試してみても良いのかも。
    * [Shifter Github Plugin/Theme Installer プラグインを公開しました \- 株式会社デジタルキューブ](https://www.digitalcube.jp/shifter/10479/)
    * [Shifter Github Plugin/Theme Installer を使って自作テーマ・プラグインをアップデートしよう \#JP\_Getshifter \| Gatespace's Blog](https://gatespace.jp/2019/12/02/shifter-github-plugin-theme-installer-use-sample/)

* あと、[GitHub](https://github.com/) そんなに使ってなかったので、使い方がわからず地味に手間取ったりもしてました…。これから、[GitHub](https://github.com/) ちゃんと使っていこうかなと…。

# ＸＸ．まとめ

以上、ご参考になれば ♪♪♪

👋👋👋

---

* ※参考 :
    * [WP PusherでGitで管理しているWordPressテーマをShifterに反映させる \- リモねこ](https://remoneko.life/import-wp-theme-from-git-by-wp-pusher-to-shifter/)
    * [How to Auto\-Sync Your Git Repositories to WordPress](https://torquemag.io/2017/04/auto-sync-git-repositories-wordpress/)