ドキュメント編集と公開サイトの編集

サイトの編集

チャットパッチ、インラインテキスト編集、デザインプリセット、色変更、バージョン履歴について。

3つの編集方法

Draftlyは3つの異なる編集モードを提供します:

1.チャット編集(外科的パッチ) — 変更したいことを入力。AIがその要素のみを変更。編集ごと0.5クレジット。
2.インラインテキスト編集 — プレビューの任意のテキストをクリックして直接編集。完全無料。
3.コードエディター — コードタブを開いてHTMLを直接編集。完全なコントロール、無料。

デザインの変更にはチャット編集を使用。コピーの調整にはインライン編集を使用。チャットで対応できない構造的な変更にはコードエディターを使用。

チャット編集(外科的パッチ)

チャット編集は主要な反復ツールです。生成後にチャットで入力すると、AIが: 1. リクエストを分析 2. 最小限のHTML/CSSパッチセット(0〜8操作)を生成 3. プレビューにライブ適用 4. 0.5クレジットを消費

チャット編集でできること: - 任意のCSS色、グラデーション、変数を変更 - 任意のテキストを書き換え — 見出し、本文テキスト、ボタンラベル - セクションを再構成 — グリッド列、リスト対カード - セクション内の要素を追加または削除 - フォント、スペーシング、パディング、ボーダースタイルを変更 - ページ末尾に新しいセクションを挿入

フル再生成をトリガーするもの: - 完全な構造的再設計(レイアウトアーキテクチャを変更) - 画像または動画パイプラインの再実行が必要なリクエスト - ターゲットパッチとして表現するには広すぎる変更

フル再生成前に明確な警告が表示されます。クレジットコストを確認してキャンセルできます。

インラインテキスト編集

サイトプレビューの任意の表示テキストをクリックして編集してください。編集可能なオーバーレイが表示されます — 新しいテキストを入力してEnterを押すか他の場所をクリックして確定します。

インライン編集可能なもの: - ヒーロー見出しとサブライン - ナビゲーションリンクラベル - セクション見出しと本文 - ボタンラベル - フッタータグラインと連絡先情報

インライン編集はプロジェクトに自動的に保存されます。再公開するとライブサイトに反映されます。

インライン編集は完全無料 — クレジット消費なし。

デザインプリセット

デザインプリセットはコンテンツやHTML構造に触れることなく、サイトの視覚的な特徴全体を瞬時に変換するワンクリックのスタイル変換です。

ビルダー左パネルの筆アイコンからプリセットパネルを開いてください。

プリセットカテゴリー: - 業種 — レストラン、SaaS、ポートフォリオ、エージェンシー、ヘルスケア、フィットネス、不動産、ビューティー - カラーパレット — ダーク、ライト、ムーディー、バイブラント、ミニマル、ラグジュアリー、エンバー、オーシャン、フォレスト - タイポグラフィセット — モダンサンズ、クラシックセリフ、ジオメトリック、モノスペース、エディトリアル - レイアウト密度 — エアリー(余白多め)、スタンダード、コンパクト

プリセットの適用: 任意のプリセットをクリック — 右パネルのプレビューがライブ更新されます。別のものをクリックして比較。確定するには適用をクリック。

プリセットはCSS変数とフォント選択を変更します — HTMLの構造ではありません。完全無料、クレジット消費なし。

色の変更

サイトの色は <style> ブロックのCSS変数として保存されています:

--bg — ページ背景
--accent — プライマリアクセント / CTAカラー
--text — 本文テキスト
--heading — 見出しの色
--border — ボーダー / 区切り線の色

色を変更する3つの方法: - チャット:「プライマリアクセントを#FF6B35に変更する」または「背景を深いネイビーにする」 - デザインプリセット:協調したカラーパレットを選択 — すべての変数を一度に変更 - コードエディター:コードタブで :root のCSS変数を直接編集

チャットでの色変更は0.5クレジット。プリセットとコードの変更は無料。

バージョン履歴

すべてのフル再生成とメジャー編集は履歴タブに保存されたバージョンチェックポイントを作成します。

ロールバックするには: 1. ビルダーの履歴タブを開く 2. 任意の以前のバージョンをクリックして右パネルでプレビュー 3. 復元をクリックして現在のバージョンにする

ロールバックは無料 — クレジットを消費せずに保存したHTMLを復元します。

履歴チェックポイントはFirestoreに保存され、ブラウザのリフレッシュ、デバイスの切り替え、セッションのログアウト後も存続します。