The Editor
Importing HTML
Bring an existing HTML design onto the canvas by uploading a file or pasting code — and understand what's kept and what's removed.
Last updated 2026-06-29
If you already have an HTML page — exported from another tool, written by hand, or sent to you by a designer — you can import it onto the canvas and keep editing it visually.
This is an advanced shortcut. If you're starting fresh, templates or the AI assistant are easier ways to get a designed page.
Open the importer
From the Blocks tab in the left panel, choose Import HTML (it's also offered on the starter screen of an empty project). The import dialog gives you two ways to bring code in:
- Upload a file — drop or browse for an
.html,.htm, or.txtfile (up to 3 MB). - Paste code — paste raw HTML, or a whole HTML document, into the text box.
What gets imported
| Part of your code | What happens |
|---|---|
| HTML body | The visible markup is placed on the canvas as fully editable elements. |
CSS (<style> blocks) | Combined and applied so your design keeps its styling. |
<script> tags | Removed for security — Webpress doesn't run imported scripts. |
External stylesheets (<link rel="stylesheet">) | Not imported — they can't be pulled in automatically. |
The importer tells you what it changed — for example, "2 script block(s) removed for security" or "1 external stylesheet won't be imported." If your design relied on an external CSS framework, expect to redo some styling once it's on the canvas.
It replaces the canvas
Importing replaces everything currently on the page. The dialog warns you and asks you to confirm with Replace canvas (or Keep current to cancel). If you might want your existing page back, save a snapshot first — see version history.
After importing
Once the design lands on the canvas, it's just like any other Webpress page: select elements, restyle them, and rearrange them. A good next step is to run the Auditor to catch any accessibility or SEO gaps in the imported markup.
Where to go next
- Adding and editing content — edit your imported design.
- Custom CSS — re-add styling that didn't come across.