Der Konvertierungsprozess Schritt für Schritt NEU
Von der Designdatei zur WordPress-Seite: dieselben fünf Schritte für ZIP/HTML, Figma, Penpot und Adobe XD – und was sich zwischen Free- und Bezahl-Konten ändert.
Egal, womit du startest – einem ZIP mit HTML, einer Figma-Datei, einem Penpot-Export oder einer Adobe-XD-Datei – eine Konvertierung folgt immer denselben fünf Schritten. Unterschiedlich ist, wie du die Quelle vorbereitest und was du mit dem Ergebnis tun kannst; das hängt von deinem Tarif ab.
Die fünf Schritte
- Design vorbereiten. Bringe die Quelle in ihrem eigenen Tool in Form (ein ZIP mit deinen Seiten, ein Figma-Link, ein JSON-Export, eine
.xd-Datei). Jede Quelle hat ihre eigene Anleitung, unten verlinkt. - Projekt erstellen. Klicke in der App auf Neues Projekt, wähle den Tab der Quelle, gib dem Projekt einen Namen und klicke auf Projekt erstellen. Tapeto liest die Datei und das Projekt wechselt von „ausstehend“ über „wird verarbeitet“ zu „verarbeitet“. Jedes erstellte Projekt zählt auf dein Monatslimit.
- Builder wählen und konvertieren. Öffne das Projekt, wähle einen Builder (Gutenberg in allen Tarifen, Elementor ab Starter) und klicke auf Konvertieren. Die Konvertierung geht von „in der Warteschlange“ über „in Bearbeitung“ zu „abgeschlossen“. Du kannst weitere Konvertierungen für dasselbe Projekt starten – etwa eine pro Builder – ohne ein neues Projekt anzulegen.
- Ergebnis prüfen. Sieh dir auf der Konvertierungsseite die Tabs Vorschau, Inhalt, Header / Footer / Sidebar und Anleitung sowie den Fidelity Score an: eine Schätzung von 0 bis 100, wie nah das Ergebnis an deinem Design liegt.
- In WordPress übernehmen. Wie, hängt von deinem Tarif ab: Dateien kopieren oder herunterladen und von Hand importieren (Free) oder eine WXR-Datei exportieren / direkt auf eine verbundene Website veröffentlichen (Starter und höher).
Welche Quelle kann ich nutzen?
| Quelle | Was du Tapeto gibst | Tarife | Schritt-für-Schritt-Anleitung |
|---|---|---|---|
| ZIP / HTML | Ein .zip mit .html, .css und Bildern (oder eine einzelne .html) – max. 5–200 MB (je nach Tarif) |
Alle | ZIP / HTML konvertieren |
| Figma | Der Link zur Datei oder zum Frame plus ein persönliches Zugriffstoken, oder das aus Figma exportierte JSON – max. 5–200 MB (je nach Tarif) | Alle | Aus Figma konvertieren |
| Penpot | Der JSON-Export der Penpot-Datei – max. 5–200 MB (je nach Tarif) | Pro und höher | Aus Penpot konvertieren |
| Adobe XD | Die .xd-Datei – max. 5–200 MB (je nach Tarif) |
Pro und höher | Aus Adobe XD konvertieren |
Du kannst auch ein GitHub-Repository (öffentlich oder privat) über den Tab GitHub importieren; es folgt demselben Ablauf wie ein ZIP.
Was dein Tarif enthält
| Free | Starter | Pro | Agency | Studio | |
|---|---|---|---|---|---|
| Projekte pro Monat | 1 | 5 | 20 | 40 | Unbegrenzt |
| ZIP / HTML, Figma, GitHub | Ja | Ja | Ja | Ja | Ja |
| Penpot, Adobe XD, Stitch | — | — | Ja | Ja | Ja |
| Heute verfügbare Builder | Gutenberg | Gutenberg, Elementor | Gutenberg, Elementor | Gutenberg, Elementor | Gutenberg, Elementor |
| Dateien herunterladen und von Hand importieren | — | Ja | Ja | Ja | Ja |
| WXR exportieren (Seiten, Menüs, Header / Footer) | — | Ja | Ja | Ja | Ja |
| WXR mit Custom Post Types und Loops | — | — | — | Ja | Ja |
| Direkt in WordPress veröffentlichen | — | 1 Website | 3 Websites | 10 Websites | Unbegrenzt |
| REST-API und Webhooks | — | — | — | — | Ja |
| Projektverlauf | 30 Tage | 90 Tage | 1 Jahr | Unbegrenzt | Unbegrenzt |
Weitere Builder sind unterwegs
Divi, Bricks und Breakdance (enthalten ab Pro) sowie Oxygen, Beaver Builder und WPBakery (enthalten ab Agency) werden in der App als Demnächst angezeigt, während wir sie an echten Websites validieren. Agency und Studio sind angekündigte Tarife: Auf der Preisseite siehst du, was du heute abonnieren kannst.
Das Ergebnis übernehmen: Free oder kostenpflichtig
Free-Konto
Du erhältst den konvertierten Inhalt als Dateien, die du selbst importierst:
- Nutze auf der Konvertierungsseite Kopieren im Tab Inhalt (und im Tab Header / Footer / Sidebar, wenn dein Design diese Teile hat). Der Datei-Download beginnt mit Starter.
- Folge dem Tab Anleitung – er zeigt die genauen Importschritte für deinen Builder. Für Gutenberg: Lege in WordPress eine Seite an, öffne den Code-Editor und füge den Inhalt ein.
- Kopiere das CSS deines ursprünglichen Designs unter Design → Customizer → Zusätzliches CSS.
Starter, Pro, Agency und Studio
Zusätzlich zum Download kannst du:
- WXR exportieren – eine Standard-WordPress-Datei, die du über Werkzeuge → Daten importieren einliest, mit Seiten, Menüs und Header / Footer. Auf der Website ist kein Plugin nötig.
- In WordPress veröffentlichen – installiere das Tapeto-Plugin, füge die Website unter WP-Verbindungen hinzu und veröffentliche mit einem Klick. Seiten werden als Entwurf angelegt, Bilder landen in der Mediathek und Links zwischen den Seiten werden umgeschrieben. Siehe WordPress verbinden.
- Bei Agency und Studio enthält das WXR zusätzlich die in deinem Design erkannten Custom Post Types und Loops (Blog, Portfolio, Referenzen …).
Wenn etwas schiefgeht
| Was du siehst | Wahrscheinliche Ursache | Was zu tun ist |
|---|---|---|
| Das Projekt endet mit „Fehler“ | Die Datei konnte nicht gelesen werden (falsches Format, leer oder beschädigt) | Lies die Meldung am Projekt und prüfe die Voraussetzungen in der Anleitung zur Quelle |
| „Ihr Tarif enthält diese Quelle nicht“ | Penpot, Adobe XD und Stitch erfordern Pro | Nutze ZIP / HTML oder Figma, oder wechsle den Tarif unter Einstellungen → Tarif und Abrechnung |
| Ein Builder zeigt ein Schloss | Dein Tarif enthält ihn nicht, oder er steht noch auf „Demnächst“ | Siehe Tabelle oben |
| Die Buttons für Veröffentlichen und WXR sind gesperrt | Free-Tarif | Lade die Dateien herunter oder wechsle zu Starter |
| Monatslimit erreicht | Alle Projekte des Zeitraums sind aufgebraucht | Warte auf den nächsten Zeitraum oder wechsle den Tarif |
Nächster Schritt
Wähle die Anleitung für deine Quelle: ZIP / HTML, Figma, Penpot oder Adobe XD.