前回の記事で、Claude Codeを使って記事作りから自動投稿まで全自動化した話を書きました。今回はその続きで、Claude CodeにSSHでVPSを直接触らせて、WordPressの子テーマ（Simplicity2）の作り直しを任せてみた話です。
結論から言うと、パソコンとVPSの「つなぎ方」さえ準備すれば、あとはほぼ見ているだけで作業が終わりました。途中で僕の勘違いによる大騒ぎもありましたが（笑）、その話も含めて全部書いておきます。
今回やりたかったこと
このブログ（mypc）は、わいひらさんが作った「Simplicity2」というテーマの子テーマで動いています。Simplicity2は、今は大人気の「Cocoon」の前身にあたるテーマで、すでに開発は終わっています。
実は僕、このSimplicity2の親テーマを、もうずっとアップデートしていませんでした。子テーマの中身も、何年も前の親テーマをコピーして作ったままです。
そこで今回、この機会にSimplicity2の親テーマを最新版（2.9.1）にアップデートしておきました。昼間には手作業で子テーマの大そうじもして、いらないファイルはかなり片付けています。
ただ、どうしても残さないといけないファイルが4つあり、それが昔の親テーマをコピーして作った古い中身のままでした。親を最新にしたのに、子テーマ側が古いままでは意味がありません。そこで、この4つを「最新の親＋自分で足した部分」で作り直すことにしました。
| ファイル | 自分で足していた部分 |
|---|---|
| list.php | 記事一覧の上下にピックアップとランキング |
| entry-body.php | タグ表示、お気に入りボタン、人気記事、広告など6か所 |
| entry-card.php | 大きいサムネイル、カテゴリー名ラベル、PV数表示 |
| related-entry-card.php | 関連記事の大きいサムネイルとカテゴリー名ラベル |
これを手作業でやると、また何十回もコマンドを打つことになります。そこで今回はClaude Codeに丸ごとお願いしてみました。
事前準備：パスワード無しでVPSに入れるようにする
Claude CodeはパソコンのPowerShellの中で動くので、VPSを触らせるには「sshコマンドでVPSに入る」必要があります。ところが、パスワードを聞かれるとClaude Codeはそこで止まってしまいます。そこで「SSH鍵」を使って、パスワード無しで入れるようにしました。作業は最初の1回だけです。
1. パソコン側で鍵を作る
PowerShellで次のコマンドを打って、質問が3回出るので全部そのままEnterを押します。
ssh-keygen -t ed25519
ここで僕は早速やらかしました。VPSにログインしたままの画面で打ってしまったんです。鍵はパソコン側で作らないと意味がありません。見分け方は、画面の左が「[root@〜]#」ならVPS、「PS C:\Users\〜>」ならパソコンです。いったんCtrl + Cで止めて、exitでVPSから抜けてからやり直しました。
2. 作った鍵をVPSに登録する
次のコマンドで、パソコンの鍵をVPSに送ります。「ポート番号」と「サーバーのアドレス」は自分の環境に合わせて書き換えます（アドレスはIPアドレスの代わりに、そのVPSで動いているサイトのドメイン名でもOKでした）。
type $env:USERPROFILE\.ssh\id_ed25519.pub | ssh -p ポート番号 root@サーバーのアドレス "mkdir -p ~/.ssh; cat >> ~/.ssh/authorized_keys; chmod 600 ~/.ssh/authorized_keys"
初めて接続するときに英語で「続けますか？」と聞かれます。ここで「y」だけ打ったら怒られました。「yes」と3文字全部打つ必要があります。そのあといつものパスワードを入れて、何も表示されずに戻ってくれば登録完了です。
3. 接続設定（config）を作る
毎回長いコマンドを打たなくていいように、「conoha」という短い名前で接続できる設定を作ります。最初はメモ帳で作ろうとしたのですが、ポップアップが出てスクショを撮ろうとしたら消えてしまいました（笑）。なので、コマンド1発で作る方法に切り替えました。
Set-Content -Path $env:USERPROFILE\.ssh\config -Encoding ascii -Value "Host conoha`n HostName サーバーのアドレス`n Port ポート番号`n User root"
4. パスワード無しで入れるか確認
ssh conoha
パスワードを聞かれずにVPSの画面になれば準備完了です。同じVPSで動いている他のサイトも、この「conoha」1つで全部触れるようになりました。
Claude Codeの起動で気をつけたこと
1. 専用の作業フォルダで起動する
最初、PowerShellを開いたそのままの場所（ユーザーフォルダ）でclaudeと打ったら、「このフォルダを信頼しますか？」と聞かれました。ユーザーフォルダだと、デスクトップやドキュメントまで全部Claude Codeが触れる状態になります。そこで一度No, exitで抜けて、作業用のフォルダを作ってから起動し直しました。
mkdir C:\work\theme-cleanup -Force; cd C:\work\theme-cleanup; claude
作業自体はVPSの上でやるので、このフォルダは空っぽのままで大丈夫です。
2. 「auto mode」から「manual mode」に切り替える
起動したら、画面の一番下に黄色い字で「auto mode on」と出ていました。これはClaude Codeがコマンドを自動で判断して実行するモードです。今回はファイルの置き換えがあるので、Shift + Tabを何回か押して「manual mode on」に切り替え、コマンドのたびに自分で許可する形にしました。
3. 日本語が打てないときは英語でOK
なぜかClaude Codeの入力欄で日本語入力ができませんでした。でも英語でも普通に通じます。「続けて」は「continue」でOKでした。長い日本語の指示は、別の場所で書いたものをコピーしてCtrl + Vで貼り付ければ大丈夫です。
Claude Codeに渡した指示文
実際に渡した指示文はこんな感じです。ポイントは「1ファイル終わるごとに止まって、私のOKを待つ」というルールを入れたことです。これで全自動で突っ走られることがなく、表示を確認しながら進められます。
ssh conoha でVPSに接続して、WordPressの子テーマの残りファイルを新しい親テーマ（Simplicity2）に合わせて作り直してください。 ルール： 1. 最初に新旧の親の style.css の Version を比べる 2. 子テーマ丸ごとを /root/ に tar.gz でバックアップする 3. 新しい親のファイルをベースに、自作部分だけを同じ位置に入れ直して作り直す 4. 元のファイルは /root/ に避難させてから置き換える 5. 変更後は必ず php -l で文法チェックする 6. 1ファイル終わるごとに止まって、ブラウザで何を確認すればいいか教えてから、私のOKを待つ 7. 作成したファイルの持ち主は httpd:www にする
実際の作業の流れ
1. いきなり「古い親テーマが見つからない」
最初にClaude Codeが「比較用の古いSimplicity2がありません」と言ってきました。実は僕、最新版にアップデートしたときに、古い親テーマはもう消してしまっていたんです。
でも大丈夫でした。昼間の手作業で「どこが自分で足した部分か」はもう分かっていたので、そのリストを文章でClaude Codeに渡しました。すると、それを手がかりに最新のSimplicity2と比べて作業を進めてくれました。
2. まずバックアップ
ルールどおり、最初に子テーマ丸ごとのバックアップを取ってくれました。これがあるので、最悪サイトが真っ白になっても元に戻せます。
3. 1ファイルずつ作り直し
1ファイル終わるごとに、Claude Codeが「ブラウザでここを確認してください」と具体的に教えてくれます。例えばlist.phpのときはこんな感じでした。
- トップページで、一番下のページ送りのさらに下にランキングが出ること
- カテゴリーページで、見出しの直下にピックアップが出ること
- 2ページ目に移動できること
- 画面が真っ白になったり、途中で表示が切れたりしていないこと
確認して問題なければ「OK」と返すだけ。確認するときはシークレットウィンドウ（Ctrl + Shift + N）で見るのがコツです。KUSANAGIのキャッシュで古い表示が出ることがあるからです。
4. ついでにバグも直った
entry-card.phpの中で、サムネイルのサイズ指定が「$thumb320」という中身の無い変数になっていました。本当は「’thumb320’」という文字で書くべきところです。つまり、今まで自分で指定したつもりのサイズが効いていなかったんです。これもClaude Codeが直してくれて、トップページのサムネイルが本来の320×180になりました。
フッター事件（僕の勘違い）
作業の途中で、フッターを見て「あれ？ ConoHa VPSのバナーがタグの下に落ちて、右の列が空っぽになってる！ Simplicity2を最新にしたせいか？」と気づきました。慌ててClaude Codeに調べてもらうと、ウィジェットの配置をしっかり調べて、バナーを右の列に移動してくれました。
ところが…よくよく思い出したら、もともと自分でそういう配置にしていたんです（笑）。左にタグとVPSのバナー、真ん中にConoHa WING、右は空っぽ。これが正解でした。
でも助かったのは、Claude Codeがウィジェットを動かす前に配置をバックアップしてくれていたことです。「勘違いでした、元に戻して」とお願いするだけで元どおりになりました。バックアップ大事ですね。
最後に後片付け
作業中、Claude Codeは調査用の小さなスクリプトやファイルをVPSにいくつも置いていました。最後に「一時ファイルだけ消して、バックアップは残して」とお願いすると、何を消して何を残したかを一覧で報告してくれました。
| 残ったバックアップ | 中身 |
|---|---|
| 子テーマ丸ごとの tar.gz | 作業前の子テーマ全体 |
| theme-rebuild フォルダ | 作り直した4ファイルの「元」と「新」 |
| ウィジェット配置の json | フッター事件の前の配置 |
数日様子を見て問題なければ、これも消す予定です。
「Yes」を押していいか迷ったときの見分け方
manual modeにすると、Claude Codeはコマンドのたびに「実行していい？」と聞いてきます。全部英語なので最初は戸惑いましたが、コマンドの下に1行だけある英語の説明文を見れば、だいたい判断できます。
| 説明文に出てくる単語 | 意味 | 判断 |
|---|---|---|
| Show、Check、Diff、List、Search、Read | 見るだけ | Yesで大丈夫 |
| Back up | バックアップを取る | Yesで大丈夫 |
| Replace、Move、Delete、Write、Create、Update、Fix | ファイルを変える | 何をするのか読んでから |
正直なところ、最初にバックアップを取るルールにしておけば、全部Yesでも大きな事故にはなりにくいです。僕も途中からは全部Yesで進めました。そのかわり、止まったタイミングでのブラウザ確認だけはしっかりやる。これだけ守れば大丈夫でした。
パソコンには何が残るの？
作業が終わってから、「パソコンにもmdファイルとか作られてるのかな？」と気になって調べてみました。結果はこんな感じです。
| 場所 | 中身 |
|---|---|
| C:\work\theme-cleanup | 空っぽのまま（作業は全部VPSの上でやったため） |
| C:\Users\ユーザー名\AppData\Local\Temp\claude\ | 調査用に作った一時的なスクリプト |
| C:\Users\ユーザー名\.claude\projects\ | 今回の会話の記録（jsonlという形式） |
mdファイルは作られていませんでしたが、会話の記録はちゃんと残っていました。これが意外と便利そうなんです。
1. 続きから再開できる
同じ作業フォルダで次のコマンドを打つと、前回の会話の続きから始められます。
claude --continue
過去の会話の一覧から選びたいときは、こちらです。
claude --resume
例えば「昨日の子テーマの件で、別のサイトも同じようにやって」みたいに、一から説明し直さずに頼めるのがありがたいです。
2. 何をやったか後から確認できる
どんなコマンドを実行したかが全部残っているので、「あのときどうやったっけ？」をClaude Codeに聞けば、記録から探して答えてくれます。僕みたいにすぐ忘れるおっさんには助かります（笑）。
3. ブログ記事の材料になる
「前回の作業を記事用にまとめて」と頼めば、記録をもとに書いてくれます。作業するだけで記事のネタ帳ができあがるので、ブログを書いている人にはかなりうれしい機能です。
ちなみに、作業内容をmdファイルで残しておきたいときは、Claude Codeに「作業内容をmdファイルにまとめて」と頼めば、作業フォルダに作ってくれます。
まとめ
- ずっと放置していたSimplicity2の親テーマを、この機会に最新版（2.9.1）にアップデートした
- 子テーマの残り4ファイルは、最新のSimplicity2をベースにClaude Codeが作り直してくれた
- SSH鍵を作って、パスワード無しでVPSに入れるようにすれば、Claude CodeからVPSを直接触れる
- Claude Codeは専用の作業フォルダで起動し、manual modeに切り替える
- 指示文に「最初にバックアップ」「1ファイルごとに止まる」を入れておくと安心
- 確認はシークレットウィンドウで
- 勘違いしても、バックアップがあれば一言で元に戻せる（笑）
- 会話の記録がパソコンに残るので、続きから再開したり、記事のネタにしたりできる
昼間に手作業でやった大そうじは何時間もかかりましたが、今回のClaude Codeの作業は、準備を入れても1時間ちょっと。しかも僕がやったのは、ほぼ「Yes」を押すことと、ブラウザで表示を見ることだけでした。何年も放置していたSimplicity2もやっと最新になって、気分もスッキリです。おっさんでも、ここまでできる時代になったんだなとしみじみ思います。
正直慣れるまではかなり時間かかりますｗ
慣れるまでがキモ。。。
とは言えあまり使うことないかな？？
コメント