Wie Sie einen KI-Build in ein WordPress-Theme umwandeln (Schritt für Schritt)

KI-Build zu WordPress CMS

So verwandeln Sie ein KI-gebautes Frontend in ein WordPress-Theme

An einem Nachmittag haben Sie eine Website in die Welt geprompted. Lovable, v0, bolt.new, Figma Make, Claude Code, Replit, Rocket oder builder.io haben Ihnen ein funktionierendes React-Frontend geliefert, das aussieht, wie Sie es wollten. Und dann kommt die Frage, die keines dieser Tools beantwortet: Wie wird daraus eine WordPress-Website, die Ihr Marketing-Team auch wirklich bearbeiten kann?
 
Die ehrliche Antwort lautete bisher: „Ein Entwickler baut das neu.“ WordPress rendert PHP, und jedes dieser Tools gibt React aus. Dieser eine Bruch ist der Grund, warum sich ein KI-Build nicht einfach in einen Theme-Ordner legen lässt — und genau diesen Schritt automatisiert transjt. Hier ist der komplette Weg, von vorne bis hinten.
 

Vorab: die eine Stack-Voraussetzung

Alles andere in dieser Anleitung ist Mechanik. Dieser Punkt entscheidet, ob Ihre Umwandlung sauber oder mühsam wird.
 
Fordern Sie von Ihrem KI-Tool React mit Vite, ohne Server-Side Rendering. WordPress liefert Seiten über PHP aus, auf der anderen Seite gibt es also keine Node-Laufzeit, die eine Server-Schicht ausführen könnte. Was das je nach Tool bedeutet:
 
  • Lovable gibt bereits React mit Vite aus. Nichts zu ändern.
  • v0 nutzt standardmäßig den Next.js App Router mit Server Components. Fordern Sie stattdessen einen reinen React-und-Vite-Build an.
  • bolt.new, Replit und Rocket erzeugen standardmäßig Full-Stack-Anwendungen, inklusive API-Routen und Datenbankschicht. Das Frontend lässt sich so oder so portieren, aber diese Server-Schicht muss vorher raus.
  • Figma Make und builder.io erzeugen React aus Ihrem Design. Wählen Sie einen React-und-Vite-Export, wo die Option besteht.
  • Claude Code hält sich zuverlässig an eine ausdrückliche Anweisung. Nennen Sie die Vorgabe im ersten Prompt, dann ersparen Sie sich später ein Refactoring.
Wenn Ihr Projekt bereits eine Server-Schicht hat, ist es meist zu retten: Die Komponenten selbst lassen sich konvertieren, entfernt werden müssen Routing und Server Actions.
 

Schritt 1: Bauen Sie das Frontend in Ihrem KI-Tool

Arbeiten Sie genau so, wie Sie es sonst tun. Prompten, ansehen, verfeinern, wiederholen, bis die Oberfläche stimmt. Nichts an der Umwandlung verlangt, dass Sie Ihre Art zu gestalten oder zu iterieren ändern.
 
Das Einzige, was Sie anders machen sollten: die Stack-Vorgabe gleich zu Beginn nennen, statt sie am Ende zu entdecken.
 

Schritt 2: Bringen Sie den Code zu GitHub

GitHub ist die Brücke. transjt liest Ihr Repository — wie Ihr Tool diesen Schritt auch nennt, das Ziel ist dasselbe:
 
  • Lovable und Replit haben eingebaute Git-Integrationen, die für Sie pushen.
  • bolt.new pusht direkt aus dem Editor in ein Repository.
  • v0, Figma Make, Rocket und builder.io exportieren Code, den Sie selbst committen.
  • Claude Code arbeitet ohnehin in Ihrem Repository, einen Export-Schritt gibt es dort gar nicht.
Das ist zugleich der Moment, in dem Ihr Projekt aufhört, von der Plattform abzuhängen, die es erzeugt hat. Ab hier führt der Weg zu Hosting, das Sie kontrollieren, und die Commit-Historie hält fest, welcher Build zu welchem Theme geführt hat.
 

Schritt 3: Verbinden Sie das Repository mit transjt

Autorisieren Sie GitHub in Ihrem transjt-Projekt und wählen Sie das Repository aus, bei Bedarf auch einen Branch, falls Sie von etwas anderem als main konvertieren wollen. transjt liest den Komponentenbaum und ermittelt, welche Teile PHP-Templates werden und welche zu bearbeitbaren Inhaltsbereichen, bevor überhaupt etwas geschrieben wird.
 

Schritt 4: Wählen Sie WordPress und prüfen Sie die Vorschau

Wählen Sie WordPress als Ziel-CMS und gleichen Sie die Live-Vorschau mit Ihrem ursprünglichen Design ab. Nach der Bestätigung schreibt transjt einen Theme-Ordner: semantische PHP-Templates und natives Markup, ganz ohne Page-Builder-Plugin, um irgendetwas davon darzustellen.
 
Vom synchronisierten Repository bis zum installierbaren Theme dauert das in der Regel unter einer Stunde. Der Aufwand richtet sich nach der Zahl unterschiedlicher Seitentemplates, nicht nach der Gesamtzahl der Seiten: Zwanzig Blogbeiträge mit demselben Layout konvertieren so schnell wie einer.
 

Schritt 5: Theme installieren und das Plugin aktualisieren

Das Theme installieren Sie über das WordPress-Backend wie jedes andere. Eines sollten Sie vor dem ersten Export prüfen: Das transjt-WordPress-Plugin auf dieser Website muss aktuell sein. Ein aktuelles transjt-Release gegen ein älteres Plugin laufen zu lassen, ist die häufigste Quelle vermeidbarer Fehler, und in dreißig Sekunden ausgeschlossen.
 

Was Sie tatsächlich bekommen

Einen Theme-Ordner, der Ihnen vollständig gehört. Lesbare PHP-Templates, die Sie öffnen, prüfen und versionieren können, kompilierte Styles, die Ihre Abstände und Ihre Typo-Skala mitnehmen, und Inhalte, die im WordPress-Editor liegen, dort, wo die Person, die den Text geschrieben hat, ihn ändern kann, ohne das Repository anzufassen.
 
Der letzte Punkt ist der, der ein halbes Jahr später zählt. In einem React-Build landet jede Textänderung wieder in der Entwicklung. Als Theme nicht.
 

Aktualisieren nach einer Neugenerierung

Ändern Sie das Design in Ihrem KI-Tool, pushen Sie in dasselbe Repository und lassen Sie transjt erneut laufen. Inhalte, die Ihr Team bereits in WordPress bearbeitet hat, liegen in der Datenbank und überstehen eine erneute Konvertierung, Sie aktualisieren also das Theme und setzen nicht die Website zurück.
 

Wann dieser Weg der richtige ist

Die Umwandlung lohnt sich, wenn die Website den Prototyp überleben soll: wenn das Marketing Landingpages ohne Deployment veröffentlichen muss, wenn SEO serverseitig gerenderte Seiten braucht, wenn das Plugin-Ökosystem Ihre nächsten drei Probleme löst, oder wenn Sie das Ergebnis schlicht besitzen statt mieten wollen.
 
Wenn Sie noch an einer Idee feilen, bleiben Sie im KI-Tool. In dem Moment, in dem andere Menschen das Ding betreiben müssen, gehört es in ein CMS.