---
title: Create Visual Builder content from scratch
slug: cms-saas/docs/create-visual-builder-content-from-scratch
docTags: 
createdAt: 2026-07-30T20:18:08.000Z
---

Visual Builder lets you build experiences from scratch by adding sections, rows, columns, and elements to a blank composition. The following steps walk through creating an experience and laying out its content.

:::hint{type="info"}
**Note**
Developer configuration is necessary to create Visual Builder content from scratch. For detailed instructions, see [Configure Visual Builder](docId:0o9L75GP0gCgPCxNO1CvS).

You can create experiences in any part of the page tree, but only the Mosey Bank branch has a configured preview in the sample site, so you should create your experience under that structure.
:::

1. In the page tree, select Root's **More** (**...**) > **Create Page**.

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/5TVzap3i4c1X78UEVHatK-20260720-154741.png)

The **Create Page** window displays with saved blueprints.

2. Enter a **Name** for the experience.
3. Select **Blank Experience**.

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/grUjuncDPk_hgppGyutxg_d85119e0601399462f041ea58129616a58737619a239c53eda2e1a258e395715-image.png)

4. Click **Create**. The experience displays in the page tree.
   Visual Builder displays the page tree and an empty outline on the left and a blank preview on the right. The outline pane is where you create a collection of sections that build your experience. You can unpin the page tree and asset panes to create more space for content editing. Your blank preview may contain site-specific settings, such as headers or footers, depending on your implementation.

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/IWLc_2rDVjEIX8LJ0xYCL_7dfd524993bedca3b1eb59f2139fbc57350c51702e43c9b75bba77e41d60e201-scratch-3.png)

5. Click **Add Section** (**+**) (or the link below it) to start a new section.
6. Select a blank section and click **Add Section**.

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/xzOiNaKZEXQj3BnGgDJG-_ab63010f598690f98e15ea4f54f852c0073cf1d1c02f39ccf04d12a571e8026a-image.png)

7. Visual Builder creates a **New Blank Section**, which you can rename by clicking the name and entering another name. (You can also select **More** (...) > **Rename**.)

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/frHh8RQjeaP1jNKlTrbW8_74ad8171083219e764507a424a3a5543dacfd5c4a91f9bca711eb16e412a1d0e-368bbe9289a87c8b1ca0ce316932168e7e1f633b8b0edbae800e294c61e9e5f1-image.png)

8. Click **Add row** to start your first row.

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/krL_qlrqyQHC8qaqvhwYy_68ad823e019be0e81e6714463921237c573e2df7d14602dabde8ef19ca84d5c3-image.png)

9. Click **Add Column** to start your first column in Row 1.

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/Sz4aTt_UlPiXshIGnEAzp_2d4a6a0ad178a8f379ad8c611506330eafd31c317b01312148050443bb5439a1-image.png)

10. Click **Add Element** and select the element you want in Row 1, Column 1.

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/GWfaHqU1cP0MyLx-SKeSx_d2f20e59e3c64c8663f579f25e6abacc966188eab6e6629324e6a2953b12aacb-image.png)

The following image shows a section with a row, column, and added elements (Heading, Image, Paragraph). Styles were applied to the **Heading** and **Image** elements. See [Select styles](docId\:BvwirGlmyuK-_HgUNw93b).

You can add as many rows, columns, or elements as you like to a section.

![](https://api.archbee.com/api/optimize/BrbvVORKJ5iIeSMZye5kI/hSXOfqCqul9fSx9utKIYl_23c7c5d0bf6785e9e3da63bbbe2fc6d4c5ced0f2cdb1dea19af0c024c262588a-2888641296f736d211e102201428665010ac9c99d5ae5edfdd7384eb863e26e2-image.png)

:::hint{type="info"}
**Note**
Visual Builder uses the TinyMCE editor for text fields, which you can customize. See [Edit content using the TinyMCE rich-text editor](docId\:junrzwP1NPSiO_3aq5Ekw).
:::

To remove a section, select **More** (...) > **Remove**. Click **Remove Section** to confirm the removal.

See [Create an experience from a blueprint](docId:-s7XrO4ltsf7jtMxI-JIm) for actions you can take with Visual Builder to customize your experience.
