Skip to Content
ModulesWebsite CMSLive preview

Live preview

The Website editor renders a live preview pane next to the form on screens 1280px and wider. Every change is reflected in real time, no save required.

Who this is for: anyone editing the Website module.

How it works

  • The right-hand pane is an iframe of your tenant’s own public site at /?cc-preview=1.
  • The editor postMessages the in-memory draft to the iframe on every keystroke; the iframe re-renders.
  • Switching section tabs (Home / About / etc) navigates the iframe to match.
  • The footer is shown on every page, so footer edits update across whichever section you’re previewing.

When the pane is hidden

  • Below 1280px wide: the pane is hidden and the editor falls back to single-column. The preview header still exposes an Open in new tab ↗ link that opens the same preview URL in a separate window.
  • On smaller laptop screens (≤1280px), prefer the new-tab approach so the editor has full width.

What you’ll see

Video — coming soonUse the side-by-side live previewRecorder brief: V29 — Wide screen, type headline → preview updates → switch to About → iframe navigates → footer disclosure toggled → footer updates.

Common issues

  • Preview says “refused to connect” — your tenant’s CSP / X-Frame-Options still has the old strict values. This was fixed in v1.53.1; deploy / refresh.
  • Preview shows defaults instead of my drafts — happened on v1.53.0/1.53.1; the editor wasn’t sending the right shape. Fixed in v1.53.2.
  • Preview pane vanishes on resize — that’s by design at < 1280px. Use Open in new tab.

Last updated: 2026-06-01 · Applies to: CartonCrew v1.55+

Importing existing siteOverview