Siteon でできること
Siteon は、できあがった静的サイト（HTML）を公開し、動かし続けるための土台です。AI が作れるのはサイトの見た目までで、その後に残る公開・更新・問い合わせ・運用を引き受けます。サイトをどう作ったかは問いません。AI に作らせた HTML でも、手で書いた HTML でも同じように使えます。
土台は4つの柱でできています。必要なものから使えます。
- 置く — ホスティング — ビルドしたフォルダを
siteon deployで公開し、配信の前に CMS の値を埋め込みます。siteon rollbackで前の版に戻せます。いまのホスティングに置いたままでも使えます。Free プラン でも<名前>.siteun.comで公開でき（「Made with Siteon」のバッジつき）、独自ドメインとバッジの非表示は有料プラン（月500円から）です。独自ドメインでの公開は準備中です 近日 - 直す — お店の人が直せる箇所（CMS） — 営業時間・お知らせ・写真など、HTML に印を付けた箇所を、お店の人が管理画面から直せます
- 受ける — お問い合わせフォーム — 送信の受付・保存、お店へのメールと Slack の通知、お客様へのお礼メール（自動返信）。広告から来た人の流入元（
utm_*など）の記録、GTM の読み込み、送信をコンバージョンとして数えるイベント、Zapier・Make・CRM へ送る Webhook（有料プラン）もここに含みます - 任せる — AI エージェントからの操作 — CLI・MCP サーバー・API キーで、サイトの作成・schema の反映・テスト送信・公開・お問い合わせの確認まで、エージェントに任せられます（CLI と MCP）
登録・支払い・API キーの発行・書き出し・退会まで、管理画面とコマンドでご自身で進められます。困ったときは、このドキュメントの よくあるエラーと対処 で症状から引けます。
サイト側で JavaScript は書きません。hidden 項目を足す必要もありません。script を1行入れて、HTML に属性を付けるだけです。
CMS が止まってもサイトは止まりません。 値が届かないときは、HTML に書いた静的な文言がそのまま表示されます。だから HTML の文言は、それだけ読んで意味が通る内容にしておきます。
5分で動かす
1. サイトを登録して、サイト ID を受け取る
メールアドレスを入れると、ログイン用のリンクが届きます。開くとFree プランでサイトが1つ作られ、サイト ID（例: hanaya）が決まります。開発用・プレビュー用のドメイン（localhost や *.pages.dev など）と、Siteon のホスティングのサブドメイン（<名前>.siteun.com）で動かせます。詳しくは プランと上限。
2. script を1行入れる
</body> の直前か、<head> に defer 付きで入れます。data-site にサイト ID を書きます。
<script src="https://cdn.siteon.dev/sitekit.js" data-site="hanaya" defer></script>3. 属性を付ける
フォームは、<form> に data-sitekit-form を付けるだけです。送信処理は script が行います。
<form data-sitekit-form="contact">
<label>お名前 <input name="name" required></label>
<label>メール <input type="email" name="email" required></label>
<label>お問い合わせ内容 <textarea name="message"></textarea></label>
<!-- ボット対策。人には見えない場所に置く（必須） -->
<input type="text" name="_hp" tabindex="-1" autocomplete="off"
style="position:absolute;left:-9999px" aria-hidden="true">
<button type="submit">送信する</button>
</form>
<div data-sitekit-success role="status" aria-live="polite" hidden>お問い合わせありがとうございました。</div>
<div data-sitekit-error role="status" aria-live="polite" hidden></div>お店の人に直してもらう箇所には data-cms を付けます。中の文言は、値が届かないときにそのまま出る既定の文言です。
<dl>
<dt>営業日</dt>
<dd data-cms="hours.days">月〜土</dd>
<dt>時間</dt>
<dd data-cms="hours.time">10:00 - 18:00</dd>
</dl>4. schema.json で「何を直せるか」「どんなフォームか」を決める
上の HTML に合わせると、こう書きます。forms[].key がフォームの data-sitekit-form の値と、fields[].key が入力の name と一致している必要があります。
{
"locales": ["ja"],
"groups": [
{ "key": "hours", "label": "営業時間", "fields": [
{ "key": "days", "label": "営業日", "type": "text" },
{ "key": "time", "label": "時間", "type": "text" }
] }
],
"forms": [
{ "key": "contact", "label": "お問い合わせ", "fields": [
{ "key": "name", "label": "お名前", "type": "text", "required": true },
{ "key": "email", "label": "メールアドレス", "type": "email", "required": true },
{ "key": "message", "label": "お問い合わせ内容", "type": "textarea" }
] }
]
}書き方の全体は schema.json の書き方。schema.json の反映は、CLI の siteon schema push か MCP の update_schema で行えます（CLI・MCP・API キー）。2つ目からのサイトは、管理画面の「サイトを追加」か siteon sites create で作ります。
5. 公開する
ビルドしたフォルダをそのまま公開できます。
siteon hosting enable --site hanaya # 初回だけ
siteon deploy ./dist --site hanaya # https://hanaya.siteun.com/ に公開いまのホスティング（Cloudflare Pages など）に置いたまま使うこともできます。違いは ホスティングと配信 にあります。
6. 管理画面で確かめる
管理画面 にログインすると、schema.json に書いた項目が入力欄として並びます。値を直して公開すると、Siteon のホスティングなら 15 秒以内、中継や data-embed なら最長1分でサイトに反映されます（サイトの再デプロイは要りません）。フォームから送ったお問い合わせも、管理画面の一覧に届きます。
用語
| 用語 | 意味 |
|---|---|
| サイト ID | サイトごとの識別子。script の data-site、API の URL に入る |
| schema.json | お店の人が直せる項目と、フォームの項目を宣言するファイル |
| 公開 JSON | 公開中の内容をまとめた JSON。中継や data-embed がこれを読んで HTML に埋める |
| 中継 | Cloudflare Pages の Pages Functions。配信前に公開 JSON の値を HTML に埋め込む |
| deploy | ビルドしたフォルダを Siteon のホスティングに公開すること。公開した1回分を「版」と呼ぶ |
| 主言語 | schema.json の locales の先頭。お店の人が入力する言語で、翻訳が無いときの表示にも使う |
次に読む
- script タグ — 属性の一覧と、script だけで動くもの
- 直せる箇所の印（CMS） — テキスト・写真・お知らせの一覧・多言語
- フォーム — 表示・通知・自動返信・コンバージョンの計測・テスト送信
- Webhook — お問い合わせを Zapier・Make・CRM へ署名付きで送る
- 日程調整 近日 — 商談・面談の 1 対 1 の予約。Google カレンダー・Meet と連携
- AI エージェントに渡す — Claude Code や Cursor にそのまま貼れる指示文