Website Builder

The Website Builder lets you create multi-page websites with a section-based WYSIWYG editor. Websites are published to Azure Blob Storage and optionally served on a custom domain via Cloudflare.

Creating a Website

1. Navigate to Websites in the left sidebar
2. Click Create Website
3. Choose a creation method:

Method	Description
From Template	Start from a pre-built template suited to MSPs and agencies
Blank	Start with an empty website and build sections from scratch
AI Generate	Describe your business and AI generates initial page content
Import from URL	Crawl an existing website and import its content and structure

4. Enter a website name (internal label — not shown publicly)
5. Select the brand to associate with this website (colors and fonts from the brand apply automatically)
6. Click Create

Website Structure

A website consists of:

• Pages — Individual URLs within the site (e.g., Home, About, Services, Contact)
• Sections — Content blocks within a page (stacked vertically)
• Site settings — Global settings applied across all pages (favicon, footer, nav)

Each page has its own sections and SEO settings.

Website Editor

The editor is a full-screen interface with three panels:

Panel	Location	Purpose
Page navigator	Left sidebar	List of all pages; click to switch pages; drag to reorder
Canvas	Center	Live preview of the current page; click sections to edit
Section panel	Right sidebar	Properties of the selected section; edit content fields

Editing a Section

1. Click any section on the canvas
2. The right panel shows all editable fields for that section type
3. Edit text, images, links, or layout options directly
4. Changes appear instantly in the canvas preview

Available Section Types

Section	Purpose
Hero	Full-width banner with headline, subheadline, CTA button(s), and optional background image
Features	Grid of feature cards (icon, title, description) — 2, 3, or 4 columns
Services	List or card layout for services with descriptions and pricing (optional)
About	Text + image block with flexible layout (image left / right / background)
Team	Staff profile cards with photo, name, title, and bio
Testimonials	Quote cards or carousel with client name, company, and photo
Stats/Numbers	Animated counter display for key metrics (e.g., "200+ clients", "$2M saved")
Pricing	Pricing tier table with feature comparison
FAQ	Accordion-style frequently asked questions
Blog Feed	Displays recent blog posts from the site's blog
Contact Form	Lead capture form (name, email, phone, message) with configurable fields
CTA	Call-to-action banner with headline, body text, and one or two buttons
Logo Wall	Grid of client/partner logos
Video Embed	YouTube or Vimeo embed with poster image
Custom HTML	Paste raw HTML/CSS/JS for advanced customization
Footer	Site footer with navigation links, social icons, and copyright

Adding a Section

1. Click the + Add Section button between any two sections on the canvas
2. Browse or search the section gallery
3. Click a section type to add it at that position
4. The new section appears pre-filled with placeholder content — edit to customize

Reordering Sections

1. Hover over any section on the canvas
2. A drag handle appears on the left edge (six dots icon)
3. Drag the section up or down to reposition it

Deleting a Section

1. Click the section to select it
2. Click the ⋯ menu in the section toolbar (top-right of the section)
3. Select Delete Section
4. Confirm deletion

Duplicating a Section

1. Select a section
2. Click ⋯ → Duplicate
3. A copy is inserted directly below the original

Managing Pages

Adding a Page

1. Click + Add Page at the bottom of the page navigator
2. Enter a page name (used as the URL slug) and title
3. Choose a page template or start blank
4. Click Add

Reordering Pages

Drag pages in the page navigator to change their order. Page order affects the navigation menu generated in the Header/Footer sections.

Page Settings

Click the gear icon next to any page in the navigator to configure:

• Title — Displayed in the browser tab
• Slug — URL path (e.g., /about)
• SEO — Meta description, Open Graph image
• Visibility — Published or Draft

Deleting a Page

1. Click the gear icon next to the page
2. Click Delete Page
3. The home page (slug: /) cannot be deleted — convert it to a different page first

Desktop / Mobile Preview

The editor shows desktop view by default. To switch viewports:

1. Click the viewport toggle in the top toolbar: Desktop / Tablet / Mobile
2. The canvas resizes to simulate the selected device width
3. All sections are responsive — layout adjusts automatically
4. Some sections allow mobile-specific layout overrides (e.g., hide on mobile)

Publishing a Website

1. Click Publish in the top-right corner of the editor
2. The website is built and uploaded to Azure Blob Storage
3. A confirmation shows the live URL
4. For a custom domain, see Domain Management

ℹ️Publishing replaces the previously published version instantly. There is no staging environment — use Preview Mode before publishing to review changes.

Unpublishing a Website

1. Navigate to Website Settings
2. Click Unpublish
3. The site returns a 404 page until republished

Website Settings

Access website-level settings by clicking the gear icon in the editor or navigating to Websites → the website card → Settings:

Setting	Description
Name	Internal label
Brand	Which brand's colors and fonts apply
Favicon	Upload a .ico or .png favicon
Navigation	Customize the auto-generated navigation menu (rename, reorder, hide pages)
Footer	Configure footer columns and links
Custom domain	Link a custom domain (see Domain Management)
Analytics	Enable/disable page view tracking
Custom code	Inject <head> or <body> scripts (e.g., third-party chat widgets, analytics)

Blog / CMS

Each website has an integrated blog:

1. Click the blog icon in the left toolbar within the editor (or navigate to Websites → Blog)
2. Click New Post
3. Write content in the rich text editor with heading styles, images, and embeds
4. Set a cover image, excerpt, and SEO fields
5. Click Publish to make the post live
6. Published posts appear in the Blog Feed section if you have one on a page

See Blog Management for the full blog guide.

Importing from an Existing Site

To migrate content from an existing website:

1. Click Create Website → Import from URL
2. Enter the existing website's URL
3. The importer crawls the site (up to 50 pages) and extracts text content and images
4. The import is saved as a draft — review the Import Review page
5. Accept or reject sections on each page
6. Click Create Website from Import to finalize

💡Image imports may require rights verification. The importer downloads images to your Media Library — confirm you have permission to use them before publishing.