← Alle Beiträge

Anleitungen

Eine Regel mit AI Helper erstellen — eine Schritt-für-Schritt-Anleitung

17 Mai 2026 · von JustZix Team

Sie wissen, was Sie wollen — "verstecke dieses Newsletter-Popup" — aber Sie wollen sich nicht durch das DOM graben, einen Selektor schreiben und bei !important raten. AI Helper erledigt das Graben. Dies ist eine konkrete, Klick-für-Klick-Anleitung zum Erstellen einer echten Regel, von einer Anfrage in einfachem Deutsch bis zu einer gespeicherten Regel, die Neuladevorgänge übersteht.

Bevor Sie beginnen

AI Helper braucht einen API-Schlüssel von einem der drei Anbieter — OpenAI, Anthropic oder Gemini. Sie fügen ihn einmal unter Einstellungen → AI Helper hinzu; der Schlüssel lebt in chrome.storage.local und berührt niemals die Seite. Wenn Sie das noch nicht getan haben, führt der Einrichtungsleitfaden Sie in zwei Minuten hindurch. Für diese Anleitung nehmen wir an, dass ein Schlüssel bereits vorhanden ist.

Das Ziel

Wir wählen ein häufiges Ärgernis: eine Website, die Ihnen wenige Sekunden nach dem Laden der Seite ein Vollbild-Newsletter-Modal entgegenwirft. Wir wollen es weg haben — bei jedem Besuch, automatisch. Am Ende haben wir eine gespeicherte Regel, die auf diese eine Domain begrenzt ist.

Schritt 1 — AI Helper auf der Seite öffnen

Navigieren Sie zur störenden Website und warten Sie, bis das Popup erscheint (damit die Elemente im DOM sind). Öffnen Sie dann AI Helper mit Ctrl+Alt+\. Sie können auch die Schaltfläche im Popup-Widget oder das Rechtsklick-Kontextmenü verwenden — alle drei öffnen dasselbe: ein schwebendes, verschiebbares, größenveränderbares Fenster innerhalb der Seite, begrenzt auf diesen Tab.

Schritt 2 — das Ziel beschreiben

Tippen Sie, was Sie wollen, in einfacher Sprache. Keine Selektoren, kein Fachjargon:

Verstecke das Newsletter-Popup, das auf dieser Website
wenige Sekunden nach dem Laden der Seite erscheint.

AI Helper springt nicht direkt zum Code. Der Systemprompt erzwingt einen Arbeitsablauf: nach Details fragen → die Seite inspizieren → in einem TEMP-Fenster testen → Sie um Überprüfung bitten → erst dann speichern. Die erste Antwort ist also normalerweise eine klärende Frage — zum Beispiel, ob Sie auch das dunkle Overlay hinter dem Modal entfernt haben möchten oder nur die Modal-Box selbst. Beantworten Sie sie; je präziser Sie sind, desto besser der Selektor.

Schritt 3 — beobachten, wie er die Seite inspiziert

Sobald er genug hat, um fortzufahren, inspiziert AI Helper die Live-Seite. Sie sehen Werkzeugaufruf-Chips in der Unterhaltung erscheinen — jeder Chip ist eine Aktion, die das Modell durchgeführt hat:

• query_page — er führt einen CSS-Selektor gegen die Seite aus und erhält die passenden Elemente plus ihr HTML zurück. So findet er den tatsächlichen Modal-Container.
• list_structure — er liest Ihre bestehenden Ordner, Gruppen und Regeln, sodass er weiß, wohin eine neue Regel passt, und vermeidet, etwas zu duplizieren, das Sie bereits haben.

Das Modell erhält den aktuellen Seitenkontext — URL, Titel und ein HTML-Fragment — sodass es nicht rät. Es grenzt von einem breiten Selektor auf den spezifischen Container ein, der das Popup enthält.

Schritt 4 — den in einem TEMP-Fenster getesteten Code sehen

Hier ist der Teil, der das vertrauenswürdig macht. AI Helper schreibt keinen Code in eine gespeicherte Regel. Er ruft open_temp_pane auf, um ein TEMP-CSS-Fenster zu öffnen — dieselbe Art von In-Tab-Entwicklerfenster, das Sie von Hand öffnen würden — und dann set_temp_pane_code, um sein vorgeschlagenes CSS hineinzulegen. Sie beobachten, wie der Code live erscheint, und die Seite reagiert in Echtzeit:

/* Vorgeschlagen von AI Helper — in einem TEMP-CSS-Fenster gezeigt */
.newsletter-modal,
.newsletter-modal__overlay {
  display: none !important;
}
html, body {
  overflow: auto !important;
}

Das Popup verschwindet vor Ihren Augen. Noch wurde nichts gespeichert — das ist eine Sandbox. Wenn der Selektor falsch ist, sehen Sie das ebenfalls sofort, und Sie können AI Helper sagen "das Overlay ist immer noch da" oder "das hat auch den Footer versteckt". Er inspiziert erneut und passt an.

Schritt 5 — überprüfen, dass es tatsächlich funktioniert hat

Nehmen Sie sich einen Moment. Laden Sie die Seite neu, wenn Sie möchten — das TEMP-Fenster bleibt für den Tab bestehen. Prüfen Sie, dass:

• das Popup weg ist;
• das Scrollen der Seite funktioniert (Popups sperren oft das body-Scrollen);
• nichts anderes kaputtgegangen ist — keine fehlenden Schaltflächen, kein zusammengefallenes Layout.

Wenn etwas nicht stimmt, führen Sie die Unterhaltung fort. Dieses Hin und Her ist der springende Punkt — Sie stimmen die Regel gemeinsam ab, bevor sie jemals dauerhaft wird.

Schritt 6 — bestätigen, und die Regel wird erstellt

Zufrieden damit? Sagen Sie AI Helper, er soll es speichern. Er ruft create_rule auf — und hier erscheint eine separate, ausdrückliche Bestätigung. Die Erweiterung zeigt Ihnen genau, was sie erstellen will: den Regelnamen, das URL-Muster (es schlägt die aktuelle Domain vor, z. B. https://example.com/*) und den CSS-Body. Nichts wird in Ihre Einrichtung geschrieben, bis Sie auf Bestätigen klicken.

Wenn die Regel einen neuen Ordner oder eine neue Gruppe braucht, in der sie leben kann, sind das ebenfalls separate Bestätigungen — create_folder und create_group fragen jeweils einzeln. AI Helper kann Ihre Einrichtung niemals stillschweigend umstrukturieren.

Schritt 7 — fertig

Klicken Sie auf Bestätigen, und die Regel ist real. Sie erscheint in Ihrer Ordner-/Gruppen-/Regel-Hierarchie wie jede handgemachte Regel. Laden Sie die Website neu: das Popup ist weg, automatisch, bei jedem zukünftigen Besuch. Sie können die Regel später im normalen Editor öffnen, um das CSS anzupassen, das URL-Muster zu ändern oder sie zu deaktivieren.

Was Sie tatsächlich getan haben

Sie haben ein Ziel in einem Satz beschrieben. AI Helper hat die Seite inspiziert, den richtigen Selektor gefunden, in einem Fenster, das Sie sehen konnten, bewiesen, dass er funktioniert, und eine Regel erst gespeichert, nachdem Sie Ja gesagt haben. Die ganze Schleife dauerte vielleicht zwei Minuten — und Sie haben nie einen Selektor geschrieben oder die DevTools geöffnet.

Siehe auch

• AI Helper testet in TEMP-Fenstern vor dem Speichern — warum das Test-dann-Bestätigen-Modell wichtig ist.
• Wie AI Helper die Seite inspiziert — ein genauerer Blick auf die Seiteninspektions-Werkzeuge.
• Der agentische Werkzeugaufruf-Arbeitsablauf — die Schleife mit bis zu 8 Schritten hinter den Chips.

Laden Sie JustZix herunter — kostenlos, ohne Konto, Chrome 100+ (auch Edge, Brave, Opera, Vivaldi). Fügen Sie einen API-Schlüssel hinzu und erstellen Sie Ihre erste Regel, indem Sie einfach danach fragen.