Mach aus einer HTML-Website ein WordPress-Theme, das dein Kunde selbst pflegt
Markiere die Texte, Bilder und Listen, die dein Kunde ändern soll. ThemeForge baut daraus ein klassisches WordPress-Theme, in dem jedes davon ein Feld im Adminbereich ist – und du kannst das Design später ändern, ohne seine Inhalte anzufassen.
Adminbereich ansehen, bevor du zahlst · $20/Monat · jederzeit kündbar · 14 Tage Geld zurück
menu.html
contacts.html
theme-options.html
css/ style.css
assets/ 12 Bilder
page-menu.php
page-contacts.php
Website-Einstellungen
css/ main.css
Felder: 53 · Listen: 3
Ja. Gib ThemeForge die veröffentlichte URL deiner Website oder lade ihren Ordner hoch. Setz an die Stellen, die dein Kunde bearbeiten soll, Attribute wie fld-text und fld-loop, und du bekommst ein WordPress-Theme, in dem genau diese Stellen Felder im Adminbereich sind. Seiten, Styles, Bilder und Schriften kommen mit. Inhalte, die JavaScript erst im Browser zeichnet, kommen nicht mit, denn sie stehen nicht im HTML.
Die Getränkeliste einer Café-Website, vor und nach dem Umbau zum Theme
Zeig auf eine Zeile im Markup und sieh, welches Feld daraus wird.
<body wp-fields-group="Menu"> <h2 fld-text="Title">Menu</h2> <p fld-area="Lead">Espresso runs on our…</p> <div class="cards" fld-loop="Drinks"> <article class="card"> <img fld-image="Image" src="assets/icon-latte.png"> <h3 fld-text="Name">Latte</h3> <p fld-text="Description">Double espresso…</p> <span fld-text="Price">$4.20</span> </article> …drei weitere Karten, genauso markiert </div>
Warm Corner, unsere Demo-Website: 3 Seiten und eine Einstellungsseite → 4 Feldgruppen, 53 Felder, 3 Listen. Dein Kunde fügt Einträge hinzu, entfernt sie und ändert ihre Reihenfolge – das Design bleibt, wie es ist.
Was hineingeht, was herauskommt
Du bringst mit
- Statische HTML-Seiten:
index.htmlund die übrigen - CSS, Bilder und Schriften mit relativen Pfaden
- Eine veröffentlichte URL oder den Ordner von deiner Festplatte
- Websites, die Claude, Cursor oder ChatGPT geschrieben haben
Du bekommst
- Ein klassisches PHP-Theme als ZIP
- Ein Template für jede Seite
- Felder im Adminbereich für alles, was du markiert hast
- Website-Einstellungen aus
theme-options.html - Menüs und funktionierende Formulare
Passt gut
- Websites für Unternehmen und Dienstleistungen
- Landingpages und Portfolios
- Blogs, Kataloge, kleine Shops
- Websites, die du an einen Kunden übergibst
Passt nicht
- Apps mit Logins oder eigener Datenbank
- React- oder Next.js-Projekte im Rohzustand
- Seiten, die für Elementor oder Gutenberg gebaut sind
In drei Schritten vom HTML-Ordner zur Website, die dein Kunde selbst pflegt
- Schritt 1
Felder markieren
Öffne jede HTML-Datei und setz an jedes Element, das dein Kunde ändern soll, ein Attribut; die Attribut-Referenz listet sie nach Aufgabe. Die kostenlose Markup-Prüfung zeigt dir vor dem Bauen, was noch fehlt.
- Schritt 2
Adminbereich ansehen
Trag die veröffentlichte URL in dein Projekt ein. Etwa 20 Sekunden später öffnet sich in deinem Browser-Tab ein vollständiger WordPress-Adminbereich – mit Seiten, Listen und Website-Einstellungen, gefüllt aus deinem HTML.
- Schritt 3
Installieren und übergeben
Schließ das Abo ab, lade das Theme herunter und installiere es wie jedes andere. Später holt ein Klick in wp-admin einen neuen Build; ein fehlgeschlagenes Update macht sich selbst rückgängig. Für eine als Ordner hinzugefügte Website legst du den Quellcode auf der Website ab, um diesen Button zu nutzen.
Die Arbeit, die sonst ein Entwickler macht
| Von Hand nachbauen | ThemeForge | |
|---|---|---|
| Templates | Jede Seite in PHP-Dateien zerlegen | Aus deinen Seiten generiert |
| Felder im Adminbereich | Jedes Feld registrieren und ins Template einbinden | Ein Attribut pro Feld, direkt im HTML |
| Deine bisherigen Texte | Im Adminbereich neu abtippen | „Daten laden“ füllt die Felder aus deinen Seiten |
| Das nächste Redesign | Das meiste davon wiederholen | Theme neu bauen; Felder und Inhalte bleiben |
| Formulare | Ein Formular-Plugin installieren und einrichten | Deine Formulare funktionieren, jeder Eintrag wird im Adminbereich gespeichert |
Das solltest du vorher wissen
Von JavaScript gezeichnete Inhalte
Erscheint eine Liste oder ein Text erst, nachdem ein Skript gelaufen ist, steht sie nicht im HTML und kann kein Feld werden. Bring sie zuerst ins Markup.
Jeder Listeneintrag braucht seine Attribute
Der erste Eintrag legt die Felder fest. Markiere die übrigen Einträge genauso, damit alle in den Adminbereich importiert werden.
Ein umbenanntes Feld startet leer
Felder werden über ihren Namen zugeordnet. Benennst du eines im Markup um, zeigt das neu gebaute Theme es leer an. Lass die Namen also stabil, sobald dein Kunde sie gefüllt hat.
Installier ein Plugin, und dasselbe Markup kann mehr
Mit einem KI-Assistenten gebaut? Lass ihn das Markup erledigen
Gib Claude, Cursor oder ChatGPT einen einzigen Link. Der Assistent liest, wohin die Attribute gehören, zeichnet die Website aus und prüft seine Arbeit nach denselben Regeln, nach denen ThemeForge das Theme baut.
- themeforge.pro/ai · Regeln als Klartext für Assistenten
- Markup-Prüfung · kostenlos, ohne Konto, vor dem Bauen
- Markup-Leitfaden · dieselben Regeln, für Menschen geschrieben
# Sag deinem Assistenten Lies https://themeforge.pro/ai und zeichne diese Website so aus, dass der Kunde die Karte bearbeiten kann. # Ergebnis vor dem Bauen prüfen curl -X POST https://themeforge.pro/api/validate-markup \ -H "Content-Type: application/json" \ -d '{"pages":[{"name":"index.html","html":"…"}]}'
Deine Website liegt woanders?
- Registrieren
- Adminbereich ansehen
- Abonnieren
- Herunterladen und aktualisieren
Jederzeit kündbar · 14 Tage Geld zurück · deine Website läuft nach der Kündigung weiter
HTML zu WordPress: Antworten
Ich ändere das HTML oft. Bleiben die Änderungen meines Kunden erhalten?
Ja, solange die Feldnamen gleich bleiben. Der Text, den dein Kunde eingegeben hat, liegt in WordPress; jeder neue Build aus dem HTML ersetzt nur Templates und Styles.
Welche Seiten meiner Website werden zu Templates?
Immer die Startseite, dazu jede Seite, die du im Projekt einträgst. Jede Seite wird zu einem Template, und dein Kunde kann aus jedem davon weitere Seiten anlegen; jede neue Seite bekommt ihre eigene Kopie der Felder.
Wofür ist theme-options.html da?
Pack dort hinein, was sich auf jeder Seite wiederholt: Telefon, Adresse, Social-Media-Links, Footer-Text. Daraus wird ein einziger Einstellungsbildschirm im Adminbereich statt eines Feldes auf jeder Seite.
Kommen meine vorhandenen Texte in den Adminbereich?
Ja. Nach der Installation füllt „Daten laden“ die Felder mit den Texten und Bildern aus deinem HTML. Dein Kunde startet also mit der aktuellen Website und nicht mit leeren Feldern.
Kann ich das kostenlos ausprobieren?
Die Markup-Prüfung ist ohne Konto kostenlos; für die Vorschau des Adminbereichs brauchst du ein kostenloses Konto. Herunterladen und Aktualisieren des Themes gehören zum Abo für $20, mit Erstattung innerhalb von 14 Tagen.