1. TOPTOP
  2. Webサービス

Wockerで開発した子テーマをGitHub経由でさくらのVPSにアップロードする方法

|

Wapuu

Wockerで開発しているWordPressサイトを、さくらのVPSにアップロードして外部に公開したくなってきました。

Atomのremote-ftpを使わない理由

最初、Atomのパッケージである、remote-ftpを使って直接アップロードしようと思いましたが、この方法は上手くいきません。

remote-ftpのページ(新しいタブで開く)に沿って、.ftpconfigファイルを作成して子テーマの直下に格納しておけば、たしかに必要なファイルのアップロードや同期ができます。ですが、同時に公開したくない情報が書き込まれている、.ftpconfig自身もアップロードされてしまいます。

そこで知り合いの方に教えてもらったのが、GitHubを経由して外部サーバーに公開する方法です。

Wocker→ GitHub→さくらのVPSで公開

作業する場所は3つあります。GitHub、ローカル開発環境(Wocker)、外部サーバー(さくらのVPS)です。実際のコマンドラインを交えて説明しますが、人によっては必要なコマンド操作があるかもしれません。

そのへんのところは割り引いて読んで、参考程度に思っていただければ幸いです。なお、ローカル開発環境およびさくらのVPSには、Gitがインストールされている前提でお話をすすめていきます。

1.Gitの共有リポジトリを作成する(GitHubでの作業)

GitHubのトップ画面(新しいタブで開く)から、new repositoryを作成します。名前はすでに作成している子テーマの内容と、同じにしておくと分かりやすいと思います。

2.リモートリポジトリの取得(さくらのVPSでの作業)

$ sudo chmod 775 /var/www/html/wp-content/themes
$ cd /var/www/html/wp-content/themes
$ git clone https://github.com/echizenyayota/リポジトリ名.git
$ sudo chown -R apache:一般ユーザー名 リポジトリ名
$ sudo chmod -R 775 リポジトリ名

さくらのVPSでリモートリポジトリを取得するため、git cloneします。自分の場合、themesの権限は775にしないと、git cloneできませんでした。

そのほか、リモートリポジトリのユーザー名・グループ名・権限を変更しています。ただ環境によってはこの作業は不要かもしれません。

3.子テーマディレクトリの初期化(ローカル環境での作業)

$ git init

ローカル開発環境におけるリポジトリを初期化します。

4..git管理対象外ファイルを設定をする(ローカル環境での作業)

cd /(Wockerのディレクトリ)/data/(コンテナ名)/wp-content/themes/子テーマ
vi .gitignore
.DS_Store

人によっては不必要な作業かもしれません。自分のMacはあえて.DS_Storeを出す設定にしているので、.gitignoreファイルを編集します。

5.ファイルを編集しコミットする(ローカル環境での作業)

$ cd wocker/data/コンテナ名/wp-content/themes/リポジトリ名(子テーマ名)
$ git add .
$ git commit -m"1st commit"

子テーマ内で編集したstyle.cssなどをコミットしておきます。

6.リモートリポジトリを登録(ローカル側の作業)

$ git remote add origin https://github.com/echizenyayota/リポジトリ名.git

ローカル環境で開発した子テーマを、リモートリポジトリとして登録しておきます。

7.リモートリポジトリに送信(ローカル側の作業)

$ git push -u origin master

ローカル開発環境で開発したリポジトリ(ローカルリポジトリ)の内容を、リモートリポジトリにプッシュします(masterブランチにいるものとします)。

8.最新のリモートリポジトリを取得する(さくらのVPS側の作業)

$ git pull origin master

さくらのVPSの中に入り、最新のリモートリポジトリを取得します。以上の作業でローカル開発環境のWordPressサイトを、GitHub経由で外部サーバーに公開する作業が完了しました。

初回以降にローカル開発環境の子テーマの内容を変更した場合、5→7→8の順序で外部サーバーと同期するようにします。

wp-config.phpの除外について

ちなみにアップロードする内容が、子テーマではなく、WordPress全体であれば、4で編集する.gitignoreファイルの内容は変わります。

cd /var/www/html
vi .gitignore
wp-config.php
.DS_Store

ローカル開発環境のデータベース接続情報と、外部サーバーのデータベース接続情報は異なります。wp-config.phpについては、最初からGitHubにプッシュされないように除外しておきます。

〔参考サイト〕