Ihre Website bearbeiten

Draftly bietet Ihnen drei verschiedene Bearbeitungsmodi:

Für Designänderungen nutzen Sie Chat-Bearbeitungen. Für Textanpassungen nutzen Sie die Inline-Bearbeitung. Für strukturelle Änderungen, die über den Chat hinausgehen, nutzen Sie den Code-Editor.

Chat-Bearbeitungen sind das primäre Iterationswerkzeug. Wenn Sie nach der Generierung im Chat tippen, wird die KI: 1. Analysiert Ihre Anfrage 2. Generiert einen minimalen Satz von HTML/CSS-Patches (0–8 Operationen) 3. Wendet diese live in der Vorschau an 4. Zieht 0,5 Credits ab

Was Chat-Bearbeitungen leisten können: - Jede CSS-Farbe, jeden Farbverlauf oder jede Variable ändern - Jeden Text umschreiben — Überschriften, Fließtext, Schaltflächenbeschriftungen - Abschnitte umstrukturieren — Rasterspalten, Liste vs. Karten - Elemente innerhalb von Abschnitten hinzufügen oder entfernen - Schriftarten, Abstände, Polsterungen, Rahmenstile ändern - Einen neuen Abschnitt am Ende der Seite einfügen

Was eine vollständige Neugenerierung auslöst: - Vollständiges strukturelles Redesign (ändert die Layout-Architektur) - Anfragen, die ein erneutes Ausführen der Bild- oder Video-Pipeline erfordern - Änderungen, die zu diffus sind, um als gezielte Patches ausgedrückt zu werden

Eine deutliche Warnung erscheint vor jeder vollständigen Neugenerierung. Sie sehen die Credit-Kosten und können abbrechen.

Klicken Sie auf einen beliebigen sichtbaren Text in der Website-Vorschau, um ihn zu bearbeiten. Ein bearbeitbares Overlay erscheint — geben Sie Ihren neuen Text ein und drücken Sie Enter oder klicken Sie an eine andere Stelle zur Bestätigung.

Was Sie inline bearbeiten können: - Hero-Überschrift und Unterzeile - Navigationslink-Beschriftungen - Abschnittsüberschriften und Fließtext - Schaltflächenbeschriftungen - Footer-Slogan und Kontaktinformationen

Inline-Bearbeitungen werden automatisch in Ihrem Projekt gespeichert. Eine erneute Veröffentlichung wendet sie auf die Live-Website an.

Die Inline-Bearbeitung ist völlig kostenlos — null Credits.

Design-Vorlagen sind Stiltransformationen mit einem Klick, die das gesamte visuelle Erscheinungsbild Ihrer Website ändern, ohne den Inhalt zu beeinflussen.

Öffnen Sie das Vorlagen-Panel über das Pinselsymbol im linken Panel des Builders.

Vorlagen-Kategorien: - Branche — Restaurant, SaaS, Portfolio, Agentur, Gesundheitswesen, Fitness, Immobilien, Schönheit - Farbpaletten — Dunkel, Hell, Stimmungsvoll, Lebendig, Minimalistisch, Luxus, Glut, Ozean, Wald - Typografie-Sets — Moderne Sans, Klassische Serif, Geometrisch, Monospace, Editorial - Layout-Dichte — Luftig (großzügiger Leerraum), Standard, Kompakt

Eine Vorlage anwenden: Klicken Sie auf eine beliebige Vorlage — die Vorschau wird live aktualisiert. Klicken Sie auf eine andere, um zu vergleichen. Anwenden zur Bestätigung.

Vorlagen ändern CSS-Variablen und Schriftarten — nicht die HTML-Struktur. Sie sind völlig kostenlos, es werden keine Credits verbraucht.

Farben auf Ihrer Website werden als CSS-Variablen im <style>-Block gespeichert:

Drei Möglichkeiten, Farben zu ändern: - Chat: „Ändern Sie den primären Akzent auf #FF6B35“ oder „Machen Sie den Hintergrund zu einem tiefen Marineblau“ - Design-Vorlagen: Wählen Sie eine koordinierte Farbpalette — ändert alle Variablen auf einmal - Code-Editor: Bearbeiten Sie :root CSS-Variablen direkt im Tab „Code“

Chat-Farbänderungen kosten 0,5 Credits. Vorlagen- und Code-Änderungen sind kostenlos.

Jede vollständige Neugenerierung und größere Bearbeitung erstellt einen Versions-Checkpoint, der in Ihrem Verlauf-Tab gespeichert wird.

So stellen Sie eine frühere Version wieder her: 1. Öffnen Sie den Verlauf-Tab im Builder 2. Klicken Sie auf eine frühere Version, um sie im rechten Bereich in der Vorschau anzuzeigen 3. Klicken Sie auf Wiederherstellen, um sie zu Ihrer aktuellen Version zu machen

Das Wiederherstellen ist kostenlos — es stellt das gespeicherte HTML wieder her, ohne Credits zu verbrauchen.

Verlauf-Checkpoints werden in Firestore gespeichert und überstehen Browser-Aktualisierungen, Gerätewechsel und Session-Abmeldungen.