docs(templating): how to build a template in the browser

docs/TurboDocx Templating/How to Build a Template in the Browser.md

@@ -0,0 +1,110 @@
+---
+title: How to Build a Template in the Browser
+sidebar_position: 4
+description: Build a TurboDocx template without Word or Google Docs. Write your document in the browser, add headings and tables, and generate documents from it.
+keywords:
+  - build template in browser
+  - block editor
+  - browser template editor
+  - add heading
+  - add table
+  - turbodocx template
+  - document automation
+  - no word needed
+---
+
+Most TurboDocx templates start life in Word or Google Docs. You do not have to work that way. You can write a template directly in your browser and save it as a template — no other application involved.
+
+This guide walks you through building one from scratch.
+
+:::note When to use this
+Building in the browser suits short, text-based documents: statements of work, cover letters, engagement summaries, simple agreements.
+
+If you already have a polished `.docx` or `.pptx` file — or your document depends on complex Word formatting — upload it instead. See [How to Create a Template](./How%20to%20Create%20a%20Template.md).
+:::
+
+## Step 1: Start a New Template
+
+1. Open the **Templates** page from the left sidebar.
+2. Click the **New Template** button in the top-right corner.
+
+![Templates page with the New Template button highlighted in the top-right corner](/img/block_template_editor/step_1_new_template.png)
+
+## Step 2: Choose "Build in browser"
+
+A short menu appears under the button with two choices.
+
+1. Click **Build in browser**.
+
+![New Template menu open, showing Build in browser above Upload a file, with Build in browser highlighted](/img/block_template_editor/step_2_build_in_browser.png)
+
+The editor opens with an empty page. Type your document into it exactly as you would in any word processor.
+
+## Step 3: Add Blocks with the + Button
+
+Headings, tables, lists and images are all added the same way — with the **+** button that appears beside each line.
+
+1. Move your pointer over the line where you want the new block. A **+** appears to its left.
+2. Click the **+**.
+
+![Block editor with the pointer over an empty line, showing the + add-block button highlighted to the left of the line](/img/block_template_editor/step_3_add_block_button.png)
+
+A menu opens with everything you can add:
+
+| Group | Blocks |
+|---|---|
+| Headings | Heading 1, Heading 2, Heading 3 |
+| Basic blocks | Numbered List, Bullet List, Paragraph |
+| Advanced | Table |
+| Media | Image |
+
+## Step 4: Add a Heading
+
+1. Click the **+** button on the line where the heading belongs.
+2. Click **Heading 2** in the menu.
+3. Type the heading text, for example `Pricing`.
+
+![Add block menu open with Heading 2 highlighted](/img/block_template_editor/step_4_choose_heading.png)
+
+:::tip
+**Heading 1** is for the document title, **Heading 2** for main sections, and **Heading 3** for subsections beneath them.
+:::
+
+## Step 5: Add a Table
+
+1. Press **Enter** to start a new line below your heading.
+2. Click the **+** button again.
+3. Click **Table** under **Advanced**.
+
+![Add block menu open with Table highlighted under the Advanced group](/img/block_template_editor/step_5_choose_table.png)
+
+A table appears in your document. Click any cell and type to fill it in, then press **Tab** to move to the next cell.
+
+![Document showing a Pricing heading above a completed table of services and rates, with the table highlighted](/img/block_template_editor/step_6_heading_and_table.png)
+
+## Step 6: Name and Create the Template
+
+1. Click **Untitled** at the top of the page and type a name for your template.
+2. Click **Create Template** in the top-right corner.
+
+![Block editor containing a Statement of Work heading, with the Create Template button highlighted](/img/block_template_editor/step_7_create_template.png)
+
+## Step 7: Generate a Document
+
+Your new template opens ready to use.
+
+1. Fill in any variables in the **Template Variables** panel on the right. The document preview updates to show your values.
+2. Click **Generate Deliverable** in the top-right corner.
+
+![Generate page showing the finished document with the Generate Deliverable button highlighted](/img/block_template_editor/step_8_generate_deliverable.png)
+
+Your document is created and appears under **Deliverables**, where you can download it as a Word file or PDF, or send it for signature.
+
+:::tip Editing the template later
+Open the template and click **Edit Template** to reopen it in the browser editor. Changes there apply to documents you create from that point on — documents you have already generated are not affected.
+:::
+
+## What's Next
+
+- [How to Create a Deliverable](./How%20to%20Create%20a%20Deliverable.md) — generating documents from any template
+- [How to Create a Knowledgebase Entry](./How%20to%20Create%20a%20Knowledgebase%20Entry.md) — reusable default values for your variables