Zum Hauptinhalt springen

Pages: AI-gestützte Landingpages erstellen und mit deinen Flows verbinden

Erstelle Landingpages, Pre-Sell-Pages, Advertorials, Listicles und Produktdetailseiten mit AI und verbinde sie mit deinen Flows.

⭐ Verfügbar im folgenden Paket: Basis-Paket (inkl. in allen Plänen)

⭐ Verfügbar in den folgenden Plänen: Basic, Pro, Agency, Business

👀 Nicht sicher, welchen Plan du hast? Überprüfe dein Abonnement.

❗ Pages befindet sich aktuell in der Beta. Funktionen und Limits können sich noch ändern.

Pages ist ein AI-first Builder für eigenständige Seiten wie Landingpages, Advertorials und Produktdetailseiten (PDPs). Du beschreibst die Seite, die du brauchst, und Pages baut sie dir in HTML. So erstellst du in Heyflow am schnellsten eine visuell starke Seite. Pages ist darauf ausgelegt, mit deinen Flows zusammenzuarbeiten: Bau eine Seite in Pages und bette dann einen Flow darin ein oder leite Besuchende zu einem Flow weiter, um ihre Daten zu erfassen.

🔎 Pages hat kein eigenes Kontingent. Das Erstellen und Bearbeiten einer Seite verbraucht AI-Credits, die von deinem Plan abhängen.


Pages vs. Flows: Wann du was nutzt

Pages und Flows erfüllen unterschiedliche Aufgaben. Wähl je nach Ziel das passende Tool.

  • Nutze eine Page für statische, inhaltsgetriebene Seiten wie eine Landingpage, ein Advertorial oder eine PDP. Pages eignen sich, wenn du informieren, überzeugen und einen Klick auslösen willst.

  • Nutze einen Flow, wenn du Eingaben sammeln oder Logik abbilden willst: Formulare, Funnels, Umfragen, Rechner, bedingte Pfade und Absendungen.

Am besten funktionieren beide zusammen. Mit Pages sorgst du für einen starken ersten Eindruck. Danach übergibst du Besuchende an einen Flow, der ihre Daten erfasst, entweder eingebettet in die Seite oder per Weiterleitung.


Seitentypen

Pages eignet sich besonders für die folgenden Seitentypen. Alle nutzen denselben Builder, der Unterschied liegt im Ziel.

Landingpages

Eine fokussierte Marketingseite rund um ein Angebot oder eine Kampagne. Du stellst damit ein Produkt oder eine Dienstleistung vor und führst Besuchende zu einer einzigen Aktion, meist zu einem verlinkten oder eingebetteten Flow.

Pre-Sell-Pages

Eine Seite zwischen deiner Anzeige und deinem Angebot. Sie stimmt Besuchende auf dein Angebot ein, bevor sie es sehen, zum Beispiel als Problem-Lösung-Seite.

Advertorials

Eine redaktionell gestaltete Seite, die eher wie ein Artikel wirkt als wie eine Anzeige. Typisch für Paid- und Native-Ad-Traffic, wenn du Lesende erst aufwärmen willst.

Listicles

Ein Artikel in Listenform, etwa „5 Gründe, warum sich der Wechsel lohnt“. Er führt Lesende durch die wichtigsten Punkte, bevor er sie zu deinem Angebot oder Flow schickt.

Produktdetailseiten (PDPs)

Eine Seite rund um ein einzelnes Produkt: Bilder, Beschreibung, Vorteile, Social Proof und ein Call-to-Action.

❗ PDPs in Pages sind mit keinem Shop verbunden. Besuchende können also nicht direkt auf der Seite kaufen. Verlinke deine Call-to-Action-Buttons stattdessen auf deinen eigenen Checkout.


Seite erstellen

Öffne „Pages“ im linken Menü deines Dashboards. Dort siehst du alle deine Seiten und kannst sie nach zuletzt bearbeitet oder Erstellungsdatum sortieren. Für eine neue Seite klickst du oben rechts auf „Seite erstellen“. Du hast dann zwei Optionen: „Von Grund auf neu“ oder „HTML- oder ZIP-Datei importieren“.

💡 Tipp: Richte zuerst deinen Brand Hub ein. Erstelle vor dem Bauen ein Markenprofil im Brand Hub. Die Analyse deiner Marke dauert nur wenige Minuten. Beim Erstellen einer Seite kannst du die AI dann bitten, deine Marke zu verwenden. So passt deine Seite schon im ersten Entwurf zu deinem Branding.

Mit einem Prompt erstellen

Wähle „Von Grund auf neu“, um mit dem AI-Chat zu bauen. Beschreib die gewünschte Seite und bitte die AI, deine Marke zu verwenden. Sie zeigt dir deine gespeicherten Marken aus dem Brand Hub zur Auswahl. Mit weiteren Prompts verfeinerst du das Ergebnis.

HTML- oder ZIP-Datei importieren

Du hast etwas in Claude Design gebaut? Wähle „HTML- oder ZIP-Datei importieren“, um es zu übernehmen. Der Import ist für Claude Design optimiert, funktioniert aber auch mit anderen HTML-Dateien. Lade die HTML- oder ZIP-Datei aus Claude herunter, lade sie in Pages hoch und bearbeite sie dort weiter.

❗ Du kannst nur einzelne Seiten importieren, z. B. Landingpages, Advertorials und PDPs. Apps und mehrseitige Websites werden nicht unterstützt, und manche Dateien lassen sich nicht sauber importieren. Lädt der Head der Datei ein Drittanbieter-Script, schlägt der Import fehl. Wenn ein Import nicht wie erwartet klappt, erstelle die Seite stattdessen mit einem Prompt neu.

Mit deinem AI-Assistenten per MCP arbeiten

Du kannst Pages auch über deinen eigenen AI-Assistenten wie Claude nutzen, und zwar über den Heyflow MCP-Server. Sobald dein Assistent mit Heyflow verbunden ist, bitte ihn, eine Seite zu erstellen, zu bearbeiten oder zu veröffentlichen, genau wie im AI-Chat. Alle Pages-Funktionen sind auch per MCP verfügbar.

🔎 Wie du die Verbindung einrichtest, erfährst du in diesem Artikel.


Seite bearbeiten

Du kannst eine Seite auf zwei Arten bearbeiten und beide frei kombinieren.

Mit dem AI-Chat bearbeiten

Beschreib die gewünschte Änderung im AI-Chat, und Pages setzt sie um. Du kannst auch Kommentare und Anmerkungen direkt auf der Seite hinterlassen, um die Änderungen zu steuern.

Inline-Bearbeitung

Kleine Änderungen machst du direkt auf der Seite:

  • Text inline bearbeiten.

  • Bilder, Logos und Schriftarten austauschen.

  • Ziele von Buttons und Links ändern.

  • Elemente per Drag-and-drop verschieben.

  • Zwischen Desktop-, Tablet- und Mobil-Ansicht wechseln, um jedes Layout zu prüfen.

❗ Pages unterstützt keinen Custom Code. Du kannst kein eigenes JavaScript hinzufügen und den Head der Seite nicht direkt bearbeiten. Titel, Beschreibung, Vorschaubild und Favicon änderst du über die drei Punkte neben dem Seitennamen unter „Einstellungen“. Alle anderen Änderungen am Head nimmst du über den AI-Chat vor.


Seite integrieren

Eine Seite allein ist statisch. Verbinde sie mit einem Flow, um Daten zu erfassen, oder leite Besuchende auf eine beliebige andere URL weiter. Anschließend veröffentlichst du sie auf deiner Domain.

Flow einbetten

Um einen Flow einzubetten, bitte den AI-Chat, ihn zu deiner Seite hinzuzufügen. Die AI fragt dich, welchen Flow du einbetten willst und ob er inline oder als Pop-up erscheinen soll. Weitere Anpassungen am Styling machst du ebenfalls über den AI-Chat. Der eingebettete Flow läuft innerhalb der Seite. UTM- und URL-Parameter der Seite werden daher automatisch an den Flow übergeben.

Du kannst bis zu 20 verschiedene Flows auf einer Seite einbetten.

❗ Der Flow muss veröffentlicht sein, bevor du ihn einbetten kannst.

Auf einen Flow oder eine beliebige URL weiterleiten

Du kannst jeden Button und jeden Link auf deiner Seite auf eine beliebige URL verweisen lassen, z. B. auf einen Flow, deinen Shop oder eine andere Website. Bitte den AI-Chat, den Link zu setzen, oder ändere ihn inline. Leitest du auf einen Flow weiter, werden UTM- und URL-Parameter der Seite automatisch übergeben, genau wie bei einem eingebetteten Flow.

🔎 Wie dein Flow URL-Parameter verarbeitet, sobald Besuchende ankommen, erfährst du unter URL/UTM-Parameter-Tracking.

Veröffentlichen und Domain verbinden

Wenn deine Seite fertig ist, klick oben rechts auf „Veröffentlichen“. Das funktioniert genauso wie bei Flows.

Um die Seite auf deiner eigenen Domain zu hosten, öffne den Tab „Integrieren“, geh zu „Domains“ und klick auf „Domain hinzufügen“. Der Ablauf ist derselbe wie beim Verbinden einer Domain mit einem Flow.

🔎 Die vollständige Anleitung findest du unter Verbinde deine eigene Domain in Heyflow.

Tracking und Cookie Consent

Tracking und Consent findest du im Tab „Integrieren“.

Cookie Consent

Über „Cookie Consent“ fügst du Heyflow Cookie Consent hinzu, einen kostenlosen Consent-Manager, der dir hilft, die DSGVO und die EU-Cookie-Richtlinie einzuhalten. Details findest du unter Cookie Consent: Intro.

Tracking

Über „Tracking“ verbindest du deine Analytics- und Ad-Tools. Du kannst folgende Tools nutzen:

🔎 Die oben verlinkten Setup-Artikel beziehen sich auf Flows. Bei Pages funktioniert die Verbindung nach demselben Prinzip.


Seite analysieren

Im Tab „Analytics“ siehst du, wie deine Seite performt. Nutze die Daten, um das Verhalten deiner Besuchenden zu verstehen und Verbesserungspotenzial zu finden. So optimierst du deine Seite Schritt für Schritt. A/B-Tests sind für Pages aktuell nicht verfügbar.

Analytics

Die Ansicht „Analytics“ zeigt Besuche, Klicks und Engagement-Rate deiner Seite. Filtern kannst du nach Zeitraum, Gerät und UTM-Parameter.

❗ Analytics erfasst nur deine veröffentlichte Live-Seite. Vorschauen und Entwürfe im Builder werden nicht getrackt. Veröffentliche die Seite, um Daten zu sehen.

Heatmap

Die Ansicht „Heatmap“ zeigt, wie Besuchende mit deiner Seite interagieren. Wechsle zwischen Klicks und Scrollen, um zu sehen, wo geklickt wird und wie weit nach unten gescrollt wird. Filtern kannst du nach Gerät, Zeitraum und Seitenversion. So prüfst du, welche Abschnitte Aufmerksamkeit bekommen und ob Besuchende deinen Call-to-Action erreichen.

Hat dies deine Frage beantwortet?