AI Code Harvester Handbuch: jede Funktion, Schritt für Schritt
Ein kurzer bebilderter Leitfaden zur kostenlosen Erweiterung für ChatGPT und Gemini. Die Bilder bewegen sich, damit du siehst, wie alles funktioniert.
NeuNeu in dieser Version
Das Panel am Bildschirmrand parken
Zieh das kleine Harvester-Panel an einen beliebigen Bildschirmrand. Es fährt als schmale Schublade ein und verdeckt den Chat nie.
Zieh das Panel am Titel Richtung Rand. Je näher du kommst, desto heller leuchtet der Rand.
Loslassen, und das Panel zieht sich in den Rand zurück. Ein Klick auf den Streifen holt es wieder heraus.
Nah am Rand, aber ohne Andocken? Halte beim Ziehen die Umschalttaste (Shift) gedrückt oder drück Esc.
</>
Dem Code beim Entstehen zusehen
An der geschlossenen Schublade füllt sich eine Blockreihe, während die KI schreibt, und zeigt die Datei in Arbeit. Ist der Code fertig, leuchtet alles auf und „Anzeigen“ öffnet die Seite sofort.
Die geschlossene Schublade: während die KI schreibt und wenn der Code fertig ist.
Die Seite live ansehen
Klick auf Anzeigen, und die Seite öffnet sich in einem eigenen Tab und läuft wirklich. Wenn die KI eine neue Antwort fertig hat, lädt sich die Seite von selbst neu.
Klick auf Anzeigen: im Panel, an der geschlossenen Schublade oder bei einem Projekt im Verlauf.
Oben wechselst du zwischen Desktop, Tablet und Handy, um die Seite auf jedem Bildschirm zu sehen.
Bitte die KI um eine Änderung. Ist sie fertig, aktualisiert sich die Vorschau von selbst.
bakery-siteDesktopTabletHandy
Deine Farben
Wähle eine Akzentfarbe in heller, normaler oder dunkler Tönung oder irgendeine Farbe. In den Einstellungen kannst du auch die geschlossene Schublade (Blöcke und Anzeigen-Button) anpassen und das Ergebnis live sehen.
Im Detail
Export nach deinem Geschmack
Ein Klick, und deine Arbeit verlässt Harvester in der Form, die du als Nächstes brauchst. Nichts geht an einen Server: Die Datei entsteht auf diesem Computer.
Harvester
.zip.html+ chat.md.md→ AI.pdfcopy
Dateien
ZIP mit Dateien
Alle ausgewählten Dateien, jede in ihrem Ordner, in einem Download. Entpacken, und das Projekt läuft genau so, wie die KI es gebaut hat.
Am besten fürein fertiges Projekt auf deinen Computer oder zu einem Webhoster bringen
Einzelne Seite (.html)
Styles und Skripte in einer einzigen .html-Datei. Per Doppelklick öffnen oder per E-Mail schicken: mehr braucht es nicht.
Am besten fürdie Seite schnell jemandem zeigen
Projekt mit mehreren Ordnern? Zippe es samt Ordnern: Schreibt die KI über dem Code einen Pfad (css/style.css), wird der Ordner automatisch erkannt, und im Workspace kannst du den Ordner jeder Datei von Hand ändern. Das ZIP entsteht genau mit dieser Struktur.
Chat
Code + Chat
Die Dateien plus eine chat.md, die erklärt, wie sie entstanden sind, alles in einer ZIP. Die Gründe hinter dem Code reisen mit.
Am besten fürein Projekt übergeben oder nach Monaten wieder aufnehmen
Chat als Markdown
Das Gespräch als sauberes Markdown: Überschriften, Listen und Codeblöcke bleiben ordentlich.
Am besten fürNotizen in Obsidian, Notion oder GitHub
Chat zum Weiterführen in einer anderen KI
Eine Markdown-Datei mit kurzer Anweisung oben. In einen neuen Chat einfügen, und eine andere KI macht mit vollem Kontext weiter.
Am besten fürden Wechsel zwischen ChatGPT und Gemini oder wenn ein Chat zu lang wird
Chat als PDF
Öffnet den Druckdialog, damit du das Gespräch als PDF speicherst, das jeder lesen kann.
Am besten fürDokumente, Berichte und Leute, die nicht mit Code arbeiten
Chat kopieren
Der ganze Text liegt mit einem Klick in der Zwischenablage, bereit zum Einfügen.
Am besten füreine schnelle Nachricht, E-Mail oder ein Support-Ticket
UmfangLetzte Antwort / Ganzes Gespräch · Sehr lange Gespräche können mehr sein, als die KI lesen kann. Wähle bei langen Chats „Letzte Antwort“.
Die täglichen Werkzeuge
≡ Code Harvester↻
index.html↕
style.css↕
app.js↕
↓ Nach unten springen
Direkt zu jedem Code springen
Jede Datei im Panel hat einen ↕-Button. Klick darauf, und der Chat scrollt zu genau diesem Codeblock und lässt ihn kurz aufleuchten, sodass du nie in einer langen Antwort suchen musst. ↓ Nach unten springen bringt dich zurück zur neuesten Antwort.
≡ Code Harvester↻
index.html
style.css
app.js
📦 ZIP📄 Einzeln
💾 Alle (3) als ZIP herunterladen💾 Ausgewählte (2/3) als ZIP herunterladen
Downloads
.zip
Alles mit einem Button herunterladen
Hake die gewünschten Dateien an (am Anfang sind alle angehakt) und drück den großen Button. Seine Beschriftung sagt, was passiert, z. B. Ausgewählte (2/3) als ZIP herunterladen. Lieber einzelne Dateien? Wechsle zu Einzeln.
≡ Code Harvester↻
index.html✓ Kopiert!↕
style.css↕
Ctrl + V
Nur den Code kopieren, den du brauchst
Klick auf den Button einer Datei, z. B. index.html, und nur dieser Code landet in der Zwischenablage, bereit zum Einfügen. Kurz steht dort Kopiert!, danach bleibt er markiert, damit du weißt, was du schon hast. Nochmal klicken hebt die Markierung auf.
≡ Code Harvester↻
index.html↕
style.css↕
app.js↕
Aktualisieren, wenn sich der Chat ändert
Harvester folgt dem Chat von selbst. Hast du die Unterhaltung gewechselt oder wirkt die Liste veraltet, drück ↻, und er liest den neuesten Code erneut.
≡ Code Harvesteri
index.html
style.css
Einrichtung nötig
📋 Prompt kopieren✓ Prompt kopiert!
Custom Instructions
index.htmlstyle.cssapp.js
Die Einrichtungs-Anweisung einmal einfügen
Der ⓘ-Button gibt dir eine kurze Anweisung. Füge sie in den Chat ein, oder einmal in die benutzerdefinierten Anweisungen von Gemini oder ChatGPT. Ab dann schreibt die KI jeden Dateinamen über ihren Code, und Harvester benennt und sortiert deine Dateien perfekt.
≡ Code Harvester⚙
index.html
Downloads speichern in
Jedes Mal fragen
Ordner AI_Code_Harvester
Downloads (ohne Ordner)
⋯
AI_Code_Harvester / project.zip
Downloads / project.zip
Festlegen, wohin Downloads gehen
Wähle unter ⚙ Downloads speichern in: Jedes Mal fragen (du wählst jedes Mal einen Ort), Ordner AI_Code_Harvester oder Downloads (ohne Ordner). Dieselbe Auswahl gibt es in den Workspace-Einstellungen.
Hinweis: Downloads fragen jetzt standardmäßig, wo gespeichert werden soll. Das kannst du in den ⚙-Einstellungen des Panels oder in den Workspace-Einstellungen ändern.