Bevor du anfängstDie App und dein Konto

Was du brauchst, um Lovable in der App in WordPress umzuwandeln

Einen Mac mit Apple Silicon (M1 oder neuer) und macOS 12 oder neuer.
Ein ChatGPT-Konto. Die Konvertierung macht die KI aus deinem eigenen Abo, du zahlst uns also nichts für Credits oder Tokens.
Das Lovable-Projekt als ZIP oder als Ordner mit dem Quellcode. Wie du es bekommst, steht weiter unten.
Speicherplatz. Jede laufende Konvertierung belegt mehrere GB.

Docker Desktop musst du nicht vorher installieren, denn die App lädt und installiert es bei Bedarf selbst. Die Gratis-Version konvertiert drei Websites mit je bis zu fünf Seiten. Das reicht, um eine kleine Lovable-Website in WordPress umzuwandeln. Für Arbeit für Kunden, größere Websites und einen WooCommerce-Shop brauchst du eine Pro-Lizenz von der Preisseite.

Die html2wp-App installieren

Lade die App für Mac herunter, öffne die DMG-Datei und zieh html2wp in den Ordner Programme. In dieser Anleitung stehen die Namen der Schaltflächen genau so, wie sie auf dem Bildschirm erscheinen.

Die Umgebung vorbereiten

Klicke in den Einstellungen der App auf Prepare environment (Umgebung vorbereiten). Die App lädt und startet bei Bedarf Docker und lädt dann die Konvertierungsumgebung sowie die Images für WordPress und die Datenbank. Beim ersten Mal dauert das ein paar Minuten. Dein Mac fragt vielleicht nach deinem Passwort, und Docker zeigt seine Lizenzbedingungen.

html2wp-App: Einstellungen mit der Schaltfläche Prepare environment vor der ersten Konvertierung — Vor der ersten Konvertierung: die Schaltfläche „Prepare environment“ in den Einstellungen.

Ist alles bereit, meldet die App „Ready to work“, und die Schaltfläche wird zu Repair environment. Die brauchst du nur, wenn die Umgebung später kaputtgeht.

html2wp-App mit vorbereiteter Umgebung und der Schaltfläche Repair environment — Die Umgebung ist bereit, und die Seitenleiste zeigt „Environment ready“.

Mit ChatGPT anmelden

Klicke auf Connect with ChatGPT. Die App zeigt dir einen Code, und die Schaltfläche „Open sign-in page“ öffnet die Seite von OpenAI. Melde dich dort mit deinem ChatGPT-Konto an und gib den Code aus der App ein. Dein Passwort tippst du nur auf der Seite von OpenAI ein, die App sieht es also nie.

Anmeldung der html2wp-App bei ChatGPT mit einem Code auf der Seite von OpenAI — Den Code aus der App gibst du auf der Anmeldeseite von OpenAI ein.

Nach der Anmeldung wählst du „Conversion model“ und „Reasoning effort“ oder behältst die Standardwerte. Hast du eine Pro-Lizenz, gib den Schlüssel in den Einstellungen ein und klicke auf Save & check. Die Gratis-Version braucht keinen Schlüssel.

html2wp-App, angemeldet mit einem ChatGPT-Konto, mit den Einstellungen für Modell und Reasoning effort — Das angemeldete Konto und die Wahl des Modells für die Konvertierung.

KonvertierungVon Lovable zum Theme

Dein Lovable-Projekt in der App

Die App braucht die Quelldateien des Projekts, nicht die Adresse der Live-Website. Lovable synchronisiert das Projekt mit einem GitHub-Repository. Öffne es auf GitHub und lade es mit Code → Download ZIP herunter. Du musst das Projekt weder bauen noch npm install ausführen, denn das macht die App selbst.

Klicke in der App auf New project (⌘N). Unter „Output“ lässt du HTML WordPress theme stehen und wählst Import a ZIP, oder „Choose a folder“, wenn du das Projekt entpackt hast. Die App arbeitet mit einer Kopie, deine Originaldateien bleiben also unverändert.

Fenster New project in html2wp: Ausgabe als WordPress-Theme und Import des Lovable-Projekts als Ordner oder ZIP — Neues Projekt: Ausgabe „HTML WordPress theme“ und Import als ZIP oder Ordner.

Lovable-Projekt, in die html2wp-App als HTML WordPress theme importiert — Nach dem Import bestätigt die App, dass deine Originaldateien unverändert sind.

Flash oder Full: Lovable in WordPress umwandeln

Auf dem Projektbildschirm wählst du, wie gründlich die App die Lovable-Website in WordPress umwandeln soll. Flash ist voreingestellt: Jeder Schritt läuft einmal, und es dauert etwa eine halbe Stunde. Full führt jede Prüfung aus und versucht, gefundene Fehler zu beheben, deshalb dauert es etwa eine Stunde. Die genaue Dauer hängt von der Anzahl der Seiten und vom Tempo deines Macs ab.

Lovable-Projekt in der html2wp-App vor dem Start der Umwandlung in WordPress mit Flash oder Full — Die Schaltflächen Flash und Full und der Typ des Themes: HTML oder Astro 5.

Brauchst du kein WordPress, stell den Typ auf Astro 5 um. Die App baut dann eine statische Website, und du kannst sie direkt aus der App auf Cloudflare Pages veröffentlichen.

So läuft die Konvertierung

Während der Konvertierung zeigt der Tab „Overview“ (Übersicht) die Schritte, an denen das Konvertierungs-Plugin arbeitet, und die Korrekturen, die es selbst gemacht hat. Meist läuft es ohne dich. Ob das Lovable-Projekt eine ältere React-App ist oder ein neueres Projekt auf TanStack Start: Die App baut es zuerst, öffnet es in einem Browser und speichert jede Seite als fertiges HTML. Erst dann macht sie aus diesem HTML das Theme.

Flash-Konvertierung von Lovable zu WordPress in der html2wp-App, mit Fortschritt und der Schaltfläche Stop conversion — Eine laufende Flash-Konvertierung mit Prozentwert und dem nächsten Schritt.

Zum Pausieren klickst du auf Stop conversion und machst später mit „Continue“ weiter. Hält das Plugin bei einem Schritt von selbst an, lässt es Repair and continue den Fehler beheben und weitermachen.

Die Lovable-Website mit WordPress vergleichen

Der Tab Compare (Vergleich) zeigt jede Seite des Originals neben der WordPress-Version, in Desktop-Breite (Desktop · 1440) und Mobil-Breite (Mobile · 390), mit der Abweichung in Prozent. Sieh dir jede Seite selbst an. Automatische Prüfungen finden die meisten Abweichungen, aber nicht alle: In einer Konvertierung fehlte ein ganzer Abschnitt, und die Abweichung lag bei nur 0,4 %.

Tab Compare in der html2wp-App: links das Original, rechts die WordPress-Version — Vergleich einer Seite in Desktop-Breite. Der Screenshot stammt von einer Beispiel-Website.

Im Tab Preview (Vorschau) öffnet „Open website“ die lokale WordPress-Website und „WordPress admin“ ihr Dashboard. Willst du etwas ändern, tippe es in den Chat rechts. Die Änderung erscheint innerhalb weniger Sekunden direkt in der Vorschau. Dann klickst du auf Make release, und die App packt das Theme genau so, wie du es in der Vorschau siehst.

html2wp-App nach einer Änderung über den Chat, mit der Schaltfläche Make release — Nach einer Änderung im Chat zeigt die App die Zahl der Änderungen und die Schaltfläche „Make release“.

Lovable in WordPress umwandeln: das Theme exportieren

Ist die Umwandlung von Lovable in WordPress durchgelaufen, liegen die fertigen Dateien im Tab Exports. Klicke neben dem WordPress-Theme auf „Save“ und speichere die ZIP. Dort findest du auch den Konvertierungsbericht als PDF, die ZIP des Originalprojekts und nach einer Flash-Konvertierung ein Astro-5-Projekt.

Tab Exports in der html2wp-App mit der ZIP des WordPress-Themes und dem Konvertierungsbericht — Das Theme als ZIP, der Konvertierungsbericht und das Originalprojekt.

Geh in WordPress zu Design → Themes → Theme hinzufügen → Theme hochladen, wähle die ZIP und aktiviere das Theme. Seiten, Blog, Formulare, Menüs, SEO und Weiterleitungen sind alle Teil des Themes und funktionieren ohne Plugin.

Soll dein Kunde Texte und Bilder per Klick direkt auf der Seite bearbeiten, ergänze den Editor Visual Edit. Arbeitest du lieber mit einem Agenten im Terminal, beschreibt die Anleitung mit dem Plugin für Claude Code und Codex dieselbe Konvertierung.

Lovable in WordPress umwandeln: Schritt für Schritt in der html2wp-App