WebWeaver Pro

Build HTML web pages the old-fashioned way — right in your browser.

User Manual

Overview

WebWeaver Pro is a browser-based HTML editor powered by CodeMirror 5. It offers three editing modes — Design, Code, and Split — and a project system backed by localStorage so your work persists between sessions.

Projects

Click ☰ Projects (or the Projects panel) to see all saved projects.
Click + New Project to create a blank project.
Click a project name to open it.
Projects are saved automatically in your browser's localStorage.

Editing Modes

Design view

A WYSIWYG (what-you-see-is-what-you-get) view of your HTML page. Click elements to select and edit them. Use the formatting toolbar to apply styles without writing HTML by hand.

Code view

A full source-code editor with syntax highlighting (powered by CodeMirror). Edit the raw HTML directly. Suitable for developers who want precise control.

Split view

Design and Code views side by side. Changes in one panel are reflected in the other in real time.

Formatting Toolbar

Button	Action
B	Bold selected text
I	Italic selected text
U	Underline selected text
H1	Wrap selection in an H1 heading
H2	Wrap selection in an H2 heading
Table	Insert an HTML table
Link	Insert a hyperlink
Image	Insert an image element
📄 Templates	Insert a pre-built HTML template

File Operations

💾 Save — saves the current project to localStorage.
📂 Load File — open an existing HTML file from your computer to edit it.
⬇ Download — download the current page as a standalone .html file.

Undo / Redo

↩ Undo — revert the last change.
↪ Redo — re-apply the last undone change.

Properties Panel

In Design view, clicking an element opens its properties in the Properties panel on the right. Here you can edit attributes (like href, src, alt, class, id) without touching the source code.

Privacy

WebWeaver Pro stores all project data in your browser's localStorage. Nothing is uploaded. Files you download are saved locally on your computer.