---
title: Add / Edit a Page
slug: add-edit-page
description: Create or edit site pages, configure page identity, review previews, and publish changes.
productSlug: cedros
productLabel: Cedros
sectionKey: site
sectionLabel: Site
docType: panel
parentSlug: pages
---
# Add / Edit a Page

This page covers how to create a new page from scratch and how to edit an existing one. Both flows use the same editor, so once you know one, you know the other.

Agents and developers should start with
[`/skills/cedros-custom-page-authoring.md`](/skills/cedros-custom-page-authoring.md)
for the end-to-end workflow. That public guide routes exact templates, blocks,
tool schemas, permissions, and publish actions to the authenticated MCP
registry instead of freezing them here.

## Creating a new page

Click **New page** from the Pages section. The builder opens right away on a new
draft, with the page name ready for you to type — there is no separate setup
dialog to get through first.

### Naming and the route

The page name is the title visitors see. As you type it, the route beneath fills
in automatically — "About us" becomes `/about-us`. Click the route to change it
by hand; once you do, it stops following the name. Lowercase letters, numbers,
and dashes only.

If the route is already taken, a message under it names the page using it. A
badge beside the route shows whether the page is a **draft** or **published**.

### Starting the content

From the builder you can:

- **Add section** — Start with an empty section and drag blocks into it.
- Click any block in the left rail to drop it straight onto the page.
- **Generate with AI** — Describe the page and let the assistant draft it. Choose
  "Replace the whole page" to generate a complete starter page. This needs an
  intelligence provider configured under Providers; without one, the button
  explains what to set up.

New pages are always created as a **draft**. They aren't visible to visitors
until you publish.

## Editing a page

Click the **Edit** (pencil) icon on any row in the Pages section. The editor opens with the full page on the right and a details sidebar on the left.

### The details sidebar

This is where the page's identity and metadata live:

- **Content type** — Locked to "Page" in this section.
- **Slug** — The URL slug (e.g. `about-us`).
- **Page name** — The title.
- **Route** — The full URL path (`/about-us`).
- **Summary** — A short description used by search engines and social previews.
- **Change note** — A one-line note explaining what changed in this revision. Useful for collaborators reviewing history.

Some fields are locked on built-in pages (like the homepage) because changing the slug would break links.

### The editor body

The main editing area takes up most of the screen and changes based on how the page was built:

- **Visual builder** — Drag-and-drop blocks (hero, columns, gallery, CTA, etc.) that you can rearrange, duplicate, and customize. Click any block to edit its content and style.
- **Document editor** — A long-form rich text view for simpler pages.

Tabs at the top switch between views, and the labels depend on how the page was built. The visual builder shows **Builder**, **Preview**, **Page**, **SEO**, and **History** tabs. Document-editor pages show **Author** (where you edit content) alongside views like **Settings** and **SEO**.

In the visual builder, the top bar also has a **Save** button (saves your draft) and an **Exit** button (returns to the page overview).

### Publishing panel

Look at the right-side panel (or footer on smaller screens) for the publishing controls:

- **Save draft** — Saves your changes without publishing. Visitors still see the old version (or nothing, if the page has never been published).
- **Refresh Saved Preview** — Builds a fresh preview so you can see exactly how the page will look live before publishing. When no preview exists yet, this reads **Generate Saved Preview**.
- **Review Final Site Preview** — Opens the latest saved preview in a new tab. (In the live-baseline comparison, the same link reads **Open Current Saved Preview**.)
- **Publish** — Makes the page live. The publish button checks for any required reviews (media, AI co-author review, SEO blockers) before letting you ship.
- **Schedule** — Pick a date and time using the date picker, then click **Schedule publish**. The page will go live automatically at that time.
- **Clear schedule** — Cancels a scheduled publish.
- **Unpublish** — Takes a live page off the site, returning it to draft state.

### Revision history

Every save creates a revision. The **Revision history** card lists them with timestamps, change notes, and the user who saved each one. From here you can:

- **View** any past revision in a side-by-side preview.
- **Restore As Current Draft** brings an older revision back as the current draft if you need to roll back.

### AI co-author

Open the **AI Co-author** pane (right edge of the editor) for two helpful surfaces:

- **Chat** — Ask the assistant to draft sections, rewrite copy, change tone, or critique your page. Highlight any text first to scope its edits to that selection.
- **Review** — A scored review of your page covering clarity, SEO, accessibility, and conversion. Each issue includes a one-click "Fix" that focuses the right field in the editor.

The AI Co-author (and its AI Edit suggestions) work the same way wherever they appear in the editor, so anything you learn here applies across content types.

### Page settings panels

Depending on page type, you'll also see panels for:

- **SEO** — SEO Title, SEO Description, and a social share image. Affects how the page appears in Google and on social media.
- **Media** — Images and videos used on the page. Includes a review board to flag missing alt text or oversized files before publishing.
- **Taxonomy** — Categories or tags (mainly relevant for blog posts and docs, but available here for cross-linking).
- **Advanced** — Custom code, redirect rules, and other power-user options.

### Custom code and the active theme

Registered visual-builder blocks follow the site's active theme automatically.
For a raw-code block, use React mode and style its web output with the inherited
`--cedros-runtime-*` color variables and `--cedros-font-*` typography variables.
Theme-aware spacing, radii, and shadows are also available through the
`--cedros-space-*`, `--cedros-radius-*`, and `--cedros-shadow-*` variables.
Scope CSS below a page-specific root, include `var()` fallbacks, and do not use
`prefers-color-scheme`; Cedros resolves the visitor's selected light/dark mode
for the variables.

The active theme's `authoredPage` surface owns the outer page width (`content`,
`wide`, or `full`). Let custom React fill that container with `width: 100%` and
`max-width: 100%`; do not use `100vw` or negative margins to escape it. Use the
theme's `--cedros-container-content` or `--cedros-container-wide` variable only
to narrow an inner reading measure. Changing the outer width for all custom
pages is a theme-authoring decision, not a raw-code setting.

HTML/CSS/JS mode is intentionally isolated in a sandboxed iframe, so it cannot
inherit the site theme. Use React mode when the custom page must change with
the active theme. See the
[Cedros Custom Page Authoring guide](/skills/cedros-custom-page-authoring.md#theme-integration-for-custom-code)
for the token table, example CSS, and review checklist.

## Shared page templates

Use a **shared page template** when several pages need the same layout with different
content—for example, comparison or extension pages. **Start from a design** copies a
starter into one page; a shared template remains linked to every page using it.

1. Open a page with the layout you want and choose **Create template from page**.
   Name the template, edit its sections with the normal builder and inspector, then
   expose the block fields each page should own. Labels, required fields, defaults,
   and repeatable lists define the content editor for linked pages.
2. **Save draft** saves the template independently of the page. **Preview content**
   lets you check a linked page's saved content against the template draft.
3. **Publish template** makes the saved layout available and updates every linked
   live page. The confirmation refreshes and lists affected pages, distinguishing
   live pages from draft-only links. Page routes, SEO, content values,
   and unpublished page drafts stay separate. Invalid content blocks publication.
4. Exit template editing, select the shared template, and choose **Use template**.
   This replaces the page layout and starts its content from template defaults.
   Fill the **Page content** rail, then save and publish the page normally.

**Edit template** changes the shared design; linked pages edit only the exposed
content. **Revision history → Restore as draft** restores a template version for
review without changing the live layout. **Detach** keeps the resolved design and
content on one independent page; save the page to keep that decision. Template
saves reject stale revisions. **Reload saved draft** asks before discarding local
edits; **Save as new template** preserves your work as a separate unpublished
template without overwriting another author. Unfinished template edits are kept
in the existing device-local recovery store for up to 24 hours, scoped to your
account and page. Return to that page and choose **Resume template** or discard
the local copy. Recovery retains the original revision, so it cannot bypass a
conflict. Saving or explicitly leaving the template editor clears its recovery.

For custom React and Native blocks, expose fields under `props.content`. Both
components receive that object as a `content` prop; Markdown can use `{{fieldKey}}`.
In **Fields for custom code**, choose **list** for repeatable content, then use
**Item fields** to define labels and scalar types. Each list supports up to 30
item fields and 200 items. Each item field has an editable default for missing
values, so adding a field works with existing pages. Item keys and types stay
stable. Defaults never replace a value a page already supplies, and invalid
supplied values still block publication.
Content is passed as data, never interpolated into executable source. Keep the web,
Native, and Markdown representations meaningful, and use the active theme's tokens.
HTML/CSS/JS iframe source does not support content interpolation.

## Common things you can do here

### Make a quick text edit and ship it

1. Click **Edit** on the row.
2. Click into the text and type your change.
3. Click **Save draft**, then **Publish**.

### Try a redesign without breaking the live page

1. Edit the page and make your changes.
2. **Save draft** instead of publishing.
3. Use **Review Final Site Preview** to open the saved preview, or copy its link from the row actions in the Pages list to share it for feedback.
4. Once approved, click **Publish**.

### Schedule a launch

1. Edit the page (or create a new one).
2. In the publishing panel, pick a date/time in the **Schedule publish** field.
3. Click **Schedule publish**. The page will go live automatically at that time.

### Roll back to an earlier version

1. Open the page in the editor.
2. In the **Revision history** card, find the version you want.
3. Click **Restore As Current Draft** to bring it back as the current draft, then **Publish** to put it live.

### Let AI write or rewrite a section

1. Open the AI Co-author pane (right edge).
2. Either highlight a section first, or just ask in the **Chat** tab.
3. Review the suggested change, then accept or refine it.

## Tips

- **Drafts autosave** to a recovery slot so you don't lose work if your browser crashes. When you reopen the page, you'll see a prompt to restore unsaved changes.
- **Use the Change note** field to leave breadcrumbs for teammates — it shows up in revision history and makes rollbacks easier.
- **Preview before publishing.** The **Refresh Saved Preview** button rebuilds the page so what you see matches what visitors will see.
- **Publishing checks** sometimes block the **Publish** button. Look at the **Workspace Gate** and **Blockers** summary at the top of the publishing panel — it tells you exactly what's missing.
- **Built-in pages** (homepage, default landing pages) have some fields locked (like the slug) to prevent broken links. You can still freely edit content, layout, and SEO.

## Troubleshooting

- **Publish button is disabled?** Check the publishing panel for blockers — common ones are missing SEO fields, unreviewed media, or AI co-author review still pending.
- **Slug shows a conflict error?** Another page is already using that URL. Either change the slug, or first delete/archive the conflicting page.
- **Lost your changes?** Look for the recovery prompt when you reopen the page, or check **Revision history** for the most recent saved version.
- **Scheduled time passed but the page didn't publish?** Check the publishing panel — if there were blockers at scheduled time (broken media, validation errors), the publish is skipped. Resolve the issue and publish manually.
- **Preview shows old content?** Click **Refresh Saved Preview** to rebuild it. Preview generation can take a few seconds on complex pages.