実践チュートリアル
モックアップと原稿を受け取ったところから始めて、Movable Type のサイトを公開し、運用マニュアルを渡すところまでを、 Claude Code に mtb を使わせて進めます。使うのは mtb だけで、mtb Pro は使いません。
題材は、架空の不動産テック企業「ファイブユナイテッド(Five United)」のコーポレートサイトです。 サービス・物件・お知らせ・プレスリリース・マガジンのページから成る、48ページの中規模のサイトです。

頼む文 4回
実行は合わせて
約1時間

流れ




本文に載せたプロンプトと出力は、実際に Claude Code に頼んだときの記録から引用しています。 AI の出力は毎回変わるので、同じ手順でもまったく同じにはなりません。どのくらい変わるかはもう一度通すとにまとめました。
途中の成果物は、付録でそのまま見られます。
| 見られるもの | |
|---|---|
| 着手前 | 付録A モックアップ(デザイン会社から受け取った静的な HTML という想定) |
| 3-1 のあと | 付録B 設計書 |
| 3-3 のあと | 付録C 運用マニュアル |
| 完成したサイト | five-united-demo.mtbcli.com(MT が書き出したサイトそのもの) |
準備
1. Movable Type
Movable Type 9.3 を用意します。サイトは無くて構いません(3-2 で作成します)。追加のプラグインも不要です。
使うのはシステム管理者のアカウントです。mtb のサインインには、そのユーザーの Webサービスパスワードを使います (管理画面へのサインインに使うパスワードとは別のものです)。管理画面の「ユーザー情報の編集」の右側にある「Webサービスパスワード」から発行します。

MT 9 では、発行したときにしか表示されません。 控えていなければ、[パスワードを削除]してから発行し直してください。 詳しくは認証。
2. mtb と Claude Code
Claude Code が使えることを前提にします。mtb はインストールスクリプトで導入します。
curl -fsSL https://bin.ideamans.com/install/mtb.sh | bash -s -- --install-dir ~/.local/bin
mtb --versionmtb version 0.1.0ほかのインストール方法はインストール。
3. 作業フォルダとキット
チュートリアルの材料(モックアップ・原稿・写真・要件メモ)を、作業フォルダに展開します。 ブラウザから落とすなら five-united-kit.zip(17MB)です。
curl -fsSLO https://www.mtbcli.com/downloads/five-united-kit.zip
unzip five-united-kit.zip && mv five-united-kit five-united
cd five-united| 中身 | |
|---|---|
requirements.md | 要件メモ。依頼主が書いた「何をしたいか」で、CMS でどう管理するかは書いていない |
mockup/ | モックアップ(48ページの静的 HTML)。npx serve mockup で見られる |
content/ | 公開時に登録する原稿(YAML と Markdown)と写真 |
BRAND.md | 架空の会社の設定 |
4. Claude Code のプラグイン
mtb の使い方と、MT で CMS を構築するための知識をまとめたプラグインを、この作業フォルダにだけインストールします。
claude plugin marketplace add ideamans/claude-public-plugins --scope project
claude plugin install mtb@ideamans-plugins --scope project✔ Successfully added marketplace: ideamans-plugins (declared in project settings)
✔ Successfully installed plugin: mtb@ideamans-plugins (scope: project).claude/settings.json に記録されるので、このフォルダで claude を起動するとスキルが読み込まれます。 中身は Claude Code プラグイン。
5. mtb を MT につなぐ
接続先に名前を付けて登録し、サインインします。この手順は人間が行います(パスワードを Claude Code に渡さないため)。
mtb profile add five-united --base-url https://<あなたのMT>/mt/mt-data-api.cgi
mtb auth login --username <ユーザー名>パスワードを聞かれたら、Webサービスパスワードを入力します。続いて、接続できたかを確かめます。
mtb auth status
mtb sites listプロファイル: five-united
エンドポイント: http://localhost:8090/mt/mt-data-api.cgi/v7
ユーザー: admin
セッション: あり
アクセストークン: 2026-11-06T11:06:40+09:00 まで有効(残り 57m8s)
{"items":[],"totalResults":0}サイトが0件なのは、まだ何も作っていないからです。
パスワードは保存されません。 保存されるのはセッションで、有効期限が切れたら mtb が取得し直します。 Claude Code はこのサインイン済みの mtb を使います。
6. Claude Code を起動して確かめる
作業フォルダで claude を起動します。初めてのフォルダでは、このフォルダを信頼するかを聞かれます。 [Yes, I trust this folder]を選ぶと、手順4でインストールしたプラグインのスキルが読み込まれます。
claude
試しに「MT にあるサイトと、それぞれの記事の数を教えて」と頼んでみます。Claude Code がスキル(mtb-usage)を読み、 mtb で MT に問い合わせて答えれば、準備は完了です(次の画面は、チュートリアルを終えたあとの MT で頼んだときのものです)。

画面の下の「auto mode on」は、Claude Code の既定の権限のモードです。危険の少ない操作(この例では mtb での読み取り)は Claude Code が判断して実行し、危ない操作は止めます。毎回確かめたいときは Shift+Tab でモードを切り替えます。
準備はここまでです。3-1 設計書を作るへ進みます。