WordPressで技術ブログを運営しつつ、練習がてら作ったツール系アプリも同じサーバーで公開したい！
そんなケチな目標を掲げ、ConoHa VPSを契約して本番環境を構築した記録です。
前回はNginxリバースプロキシ設定から、Dockerコンテナの起動まで実施しました。
今回はいよいよ最終回！
WordPressのセットアップからGitHubのデプロイ、そしてサイトの立ち上げまでを追っていきます。
前回の記事はこちら。
前提環境
| ConoHa VPS | Ubuntu 24.04 LTS / メモリ2GB / SSD 100GB / Dockerプリインストール |
| ローカルPC → VPS | SSH鍵認証（ed25519）、ポート2222 |
| VPSログインユーザー | user |
| WordPressテーマ | Cocoon（親テーマ）+ cocoon-child-master（子テーマ＋自作） |
前回までのあらすじ
WordPressのセットアップ
WP初期インストール
Dockerコンテナが無事に起動したので、さっそくブラウザでhttps://www.hibitsuiki.comにアクセスし、WordPressの初期設定を行いました。
初回アクセスはこんな感じの画面です（日本語選択済）。
【ユーザー名について】
管理画面のユーザー名となると、よくadminが使われがちです。
しかしadminは攻撃者が最初に試すユーザー名でもあります。
ブルートフォース攻撃のリスクを下げるためにも、ぜひオリジナルの名前にしましょう。
Cocoonテーマのインストール
Cocoon公式サイト（https://wp-cocoon.com/downloads/）から親テーマ・子テーマをダウンロードし、WP管理画面からインストールします。
方法はローカル環境と全く一緒です。
こちらの記事を参考にどうぞ。
子テーマのGit管理
実は筆者、Git管理対象のディレクトリを見誤っていたんです。
せっかくローカル環境も用意したし、テーマをいじる予定ならバージョン管理したいじゃないですか。
というかソースに手を加える＝Gitで管理するという考えが根付いているので、Wordpressもそうしたかったんですよね。
最初の構成（問題あり）
hibitsuiki-repository/
└── wordpress/
└── wp-content/
└── themes/
└── cocoon-child-master/ ← ここだけ管理したいのに…。この構成だと、VPSの子テーマディレクトリに直接git cloneできませんでした。
余分な空っぽのディレクトリ（上位の階層）が邪魔をしていたんです。
再構成
hibitsuiki-repository/ ← リポジトリのルート = 子テーマの中身
├── style.css
├── functions.php
└── その他自作ファイルcocoon-child-master/ 配下のみをローカル環境→GitHubにpushすることで、以下の手順でgit cloneに成功しました。
# ローカルで子テーマディレクトリに移動
$ cd ~/workspace/hibitsuiki/wordpress/wp-content/themes/cocoon-child-master
# 既存のgit管理（上位ディレクトリ）を削除
$ rm -rf ~/workspace/hibitsuiki/.git
# 子テーマディレクトリ直下でgit init
$ git init
$ git remote add origin https://github.com/username/repository.git
$ git add .
$ git commit -m "initial commit"
$ git push -u origin main最初のcdコマンドが階層深くてめんどいけどまぁそれくらいは目をつぶろう。
VPSへのデプロイ
前回、データの永続化のために名前付きボリュームをバインドマウントに変更したわけですが。
バインドマウント先（~/apps/hibitsuiki/wordpress/）の所有者がwww-dataだったため、結局userユーザーで直接操作できませんでした。
一歩進んで二歩下がるな本当に。
所有者をuserにしつつ、www-dataもグループ経由で書き込めるようにしちゃいましょう。
# Step1：既存の子テーマディレクトリの所有者をuserに変更（初回のみsudo）
$ sudo chown -R user:user ~/apps/hibitsuiki/wordpress/wp-content/themes/cocoon-child-master
# Step2：www-dataをuserグループに追加（初回のみsudo）
$ sudo usermod -aG user www-data
# Step3：グループ書き込み権限を付与（初回のみsudo）
$ sudo chmod -R g+w ~/apps/hibitsuiki/wordpress/wp-content/themes/cocoon-child-master
# Step4：既存ディレクトリをgitリポジトリ化（sudoなし）
$ cd ~/apps/hibitsuiki/wordpress/wp-content/themes/cocoon-child-master
$ git init
$ git remote add origin https://github.com/username/repository.git
$ git fetch
$ git checkout -f main今後のデプロイ手順はこれだけでOKです。
$ cd ~/apps/hibitsuiki/wordpress/wp-content/themes/cocoon-child-master
$ git pull origin mainGitHub認証について
GitHubはパスワード認証が廃止されていますので、代わりにPersonal Access Token（PAT）を使います。
PATの発行はこちらにアクセス。
最近のGitHubはFine-grainedを推奨していますが、ツールやサービスによってはClassicしか対応していない場合もあります。
用途に合わせて使い分けましょう。
各項目を入力＆トークン生成
| 項目 | 内容 |
|---|---|
| Note | トークンの用途名（conoha_vpsとかわかるような名前） |
| Expiration | 有効期限（90日にしました。No expirationは非推奨） |
| Select scopes | 今回は「repo」を選択 |
適宜入力・選択出来たら「Generate token」をクリックします。
よく使うスコープ
| スコープ | 用途 |
|---|---|
repo | プライベート含む全リポジトリ操作 |
public_repo | パブリックリポジトリのみ |
workflow | GitHub Actions |
read:org | 組織情報の読み取り |
gist | Gistの作成・編集 |
delete_repo | リポジトリ削除（慎重に） |
トークンをコピー
ghp_ から始まる文字列が表示されます。
画面を閉じると二度と見られないので必ず！！！！すぐに！！！！コピーしておいてくださいね！！！！
git操作時にパスワードを求められたら、PATを入力しましょう。
使い方（例）
# git clone時
$ git clone https://<YOUR_TOKEN>@github.com/username/repo.gitまとめ
ここまでの工程を全てクリアし、ようやくローカル環境で開発していたWordpress・ツール群を本番公開するまでに至りました。
いや～もう相変わらず環境構築が一番むずい。
特に解決に時間がかかったトラブルを解決策とともにまとめてみましょう。
| トラブル | 原因 | 解決策 |
|---|---|---|
| DNS反映されない問題 | ネームサーバーとAレコードの登録場所が不一致 | ネームサーバーをConoHaに統一 |
| SSH鍵認証できない問題 | authorized_keysが存在しなかった | .ssh/ディレクトリとauthorized_keysを手動作成 |
| パスワード認証が無効化されてない問題 | 50-cloud-init.confが設定を上書き | 50-cloud-init.confを直接修正 |
| git pullできない問題 | バインドマウント先の所有者がwww-data | chown + usermod + chmodで解決 |
初学者丸出しでお恥ずかしいですが、いつかの誰かのためになれたらヨシ！
ではまた次回！
