テスト環境と本番のブログを丸ごとそろえる ― 記事の番号まで同じにして、反映はスクリプト1本に

by ojiji · 2026年11月3日

このブログは、家のサーバーに置いた「テスト環境」で直して見た目を確かめてから、AWS の「本番」に反映しています。今回、別の AI（Codex）に全記事のアイキャッチ（記事の一覧に出る画像）を作り直してもらい、カテゴリーやタグも整理しました。これを本番に出すにあたって、テスト環境と本番を丸ごと同じにし、記事の番号（ID）までそろえるやり方に切り替えました。

これまでの記事：公開サービスを家から AWS へ移した話、家のサーバーに AI 用の仮想マシンを作る。

1. これまでのやり方と、困っていたこと

必要なところだけ写す方法と、丸ごとコピーする方法を比べた図 — テスト環境と本番のそろえ方

これまでは、テスト環境で書いた記事を1本ずつ本番に写していました。本文と画像を書き出し、本番で登録し直す方法です。ただ、本番では記事や画像の番号がテスト環境とずれるため、写すたびに次の付け替えが必要でした。

本文の中の画像の番号と URL を、本番のものに置き換える
記事どうしのリンク（「前の記事」など）を、本番の記事に向け直す
同じ記事でも、テスト環境と本番で番号が違うので、記録を見るたびに読み替える

今回はアイキャッチが28枚、カテゴリーとタグの付け替えが全記事、本文の手直しが13本と、範囲が広くなりました。1つずつ写すと、写し漏れが出やすくなります。

2. 違いを洗い出す

最初に、テスト環境と本番の両方で、記事・カテゴリー・タグ・メニュー・追加 CSS・テーマの設定・追加プログラムの一覧を JSON に書き出し、突き合わせました。

項目	テスト環境と本番の違い
記事	新しい記事1本、本文の手直し13本、題名の変更1本
カテゴリー	新しい分類に整理（テスト環境 27・本番 15）。全記事の付け替え
タグ	テスト環境にだけあるタグが19
アイキャッチ	全28記事で、新しい共通のデザインに替わっている
書式	ヘッダーのメニュー、追加 CSS、配色の切り替えの追加プログラム
同じもの	プラグインとその版、テーマの版、サイドバー

プラグインやテーマの版が同じだったので、データベースと画像のフォルダをそのまま写しても動く、と判断できました。

3. 本番にしかないものを確かめる

丸ごとコピーすると、本番にしかないものは消えてしまいます。設定を1つずつ比べて、次の3つを見つけました。

Google の連携（Site Kit）と、Search Console の所有確認のコード：本番のサイトで登録したもの。コピーの前に控え、コピーの後に戻す
商品リンクの見本：テスト環境の1記事にだけ、試しに入れているもの。本番では、コピーの後に外す
コメント：テスト環境に試しの書き込みが残っていたので、コピーの前に削除した（控えは取ってある）

この結果、本番の管理画面で直接変えたものは、次のコピーで消えることになります。変更はすべてテスト環境で行う、という決まりにしました。

4. 丸ごとコピーの流れ

本番の控え、書き出し、転送と照合、読み込み、設定を戻す、後始末の6段階を示した図 — 丸ごとコピーの流れ

本番の控え：本番のデータベース全体と画像のフォルダ、本番にしかない設定を保存する。何かあれば、これで元に戻せる
書き出し：テスト環境のデータベースを mysqldump で書き出し、画像と追加プログラムのフォルダを固める
転送と照合：本番に送り、送る前と後でファイルのハッシュ（SHA-256）が同じかを確かめる
読み込み：本番のデータベースに読み込み、テスト環境の URL を本番の URL に置き換える
設定を戻す：控えておいた本番だけの設定を戻す
後始末：テスト環境の中だけで通じるリンクを直し、商品リンクの見本を外し、キャッシュを消す

URL の置き換えで気をつけたこと

WordPress の設定の多くは、PHP の「シリアライズ」という形で保存されています。この形は、文字列の長さも一緒に記録しています（例：s:28:"http://…"）。そのため、URL を単純に置き換えると長さが合わなくなり、設定が丸ごと読めなくなります。そこで、いったん元の形に戻してから置き換え、もう一度詰め直すようにしました。

function rec($v, $pairs) {
  if (is_string($v)) {
    // シリアライズされた値なら、戻してから置き換えて詰め直す
    return looks_serialized($v) ? serialize(rec(unserialize($v), $pairs)) : strtr($v, $pairs);
  }
  if (is_array($v)) { foreach ($v as $k => $x) $v[$k] = rec($x, $pairs); return $v; }
  return $v;
}
$pairs = [
  'http://（テスト環境）/blog'      => 'https://www.freebear.org',
  'http:\/\/（テスト環境）\/blog'   => 'https:\/\/www.freebear.org',  // JSON の中の書き方
];

置き換えたのは約300か所でした。置き換えの後に、テスト環境の名前がデータベースのどこにも残っていないことを確かめています。

5. 確かめたこと

記事30件の番号・題名・カテゴリー・タグ・アイキャッチが、テスト環境と本番で一致した
カテゴリー・タグ・メニュー・追加 CSS・テーマの設定・ウィジェット・追加プログラムも一致した
本文が違うのは、予定どおりの3本だけ（商品リンクの見本を外した1本、テスト環境の中だけで通じるリンクを直した2本）
トップ・全記事・カテゴリー・画像・本文のリンクの147件を開き、146件が正常に表示された。残りの1件は画像の添付ページで、画像そのものに転送される正常な動き
Search Console の所有確認のタグが、本番に残っている

6. スクリプト1本で反映する

この手順を、Mac から動かす1本のシェルスクリプトにまとめました。テスト環境で確かめたら、これを1回実行するだけで本番がそろいます。

#!/bin/zsh
set -e
# 1 本番の控え（DB・画像・本番だけの設定）
ssh prod-server 'mysqldump … | gzip > 控え/wordpress_db.sql.gz; tar … wp-content'
# 2 テスト環境の書き出し
ssh test-server 'mysqldump … | gzip > /tmp/db.sql.gz; tar … wp-content/uploads wp-content/mu-plugins'
# 3 転送して、ハッシュを照合
scp test-server:/tmp/db.sql.gz … && scp … prod-server:/tmp/
[ "$(shasum -a 256 …)" = "$(ssh prod-server sha256sum …)" ] || exit 1
# 4〜6 読み込み・URL の置き換え・設定を戻す・後始末
ssh prod-server 'zcat … | mysql …; php sr.php; php restore.php; tar -x …; php finish.php'

7. ついでに：右のサイドバーを見やすくした

ページの一番下に移した「タグから探す」の欄 — ページの一番下に移したタグの一覧

本番を見直していて、右のサイドバー（新着記事より下）が、左の記事をスクロールしてもついてこず、見づらいことに気づきました。テーマ（Hueman Pro）の「サイドバーを画面に固定する」設定がオンになっているうえに、カテゴリーとタグ（約100個）でサイドバーが画面よりずっと長くなっていたのが原因です。

サイドバーの固定をやめ、左の記事と一緒にふつうにスクロールするようにした
タグの一覧を、ページの一番下の全幅の欄に移し、見出しを「タグから探す」にした
移した欄が画面より広くなり右端が切れたので、幅を画面に収め、タグが折り返すように CSS を足した

#footer-full-width-widget, #footer-full-width-widget .container-inner, #footer-full-width-widget .widget {
  box-sizing: border-box; width: auto; max-width: 100%;
}
#footer-full-width-widget .container-inner { padding: 10px 20px 20px; }
#footer-full-width-widget .wp-block-tag-cloud {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 2px 12px;
}

この手直しもテスト環境で確かめてから、さきほどのスクリプトで本番に反映しました。

つまずいたところ

テスト環境の中だけで通じるリンク：2本の記事の「前の記事」が /blog/?p=番号 という書き方で、本番ではそのままだと開けなかった。記事の番号がそろったので、/?p=番号 に直すだけで済んだ
コメントの中身：テスト環境の承認済みコメントは、移行前の古いものだと思っていたが、日付を見ると当日の試しの書き込みだった。削除の前に、日付と記事を一覧で確かめておくと安心
タグの欄の幅：全幅の欄に移しただけでは箱が画面より広くなり、パソコンでもスマホでも右端が切れた。画像にして確かめるまで気づかなかった

まとめ

テスト環境と本番を丸ごと同じにして、記事の番号までそろえた
本番にしかない設定は、コピーの前に控えて、コピーの後に戻す
URL の置き換えは、シリアライズされた値を壊さない方法で行う
反映はスクリプト1本。変更はテスト環境だけで行う