How Stackbit works

Add Visual Editing to
Your Modern Website

  • No refactoring, no extra API calls
  • Keep building your way: your tools, your stack, your local machine
  • Stackbit spins up an isolated container that runs your site's development server as a live preview that content editors can visually edit online
Title
πŸ‘‹ Hi there, try editing me
// Component.js
<h1 data-sb-field-path=".title">{title}</h1>
// Content.json
{
title: πŸ‘‹ Hi there, try editing me
}
// Schema.yaml
- type: string
Β Β name: title
Β Β label: Title
Git CMS
Headless CMS

Structured Content You Fully Own

Stackbit allows your content editors to visually edit structured content, while you focus on coding the components that render that content.

The content can be anything from strings rendered as text by your components to logical values dictating what components to use and how to render them, and can be driven by various sources:

  • A headless CMS: Models are loaded from the CMS, fine-grained permissions & validations and more

  • Flat files in Git: Models are simply YAML files, content is Markdown or JSON - all in the same repo

  • Custom sources: we also support any data from your database, an Airtable, e-commerce catalogs, etc

Visual Editing With Minimal Annotations

Add HTML data attributes to your pages to tell the visual editor where objects and fields are found on the page. It's as simple as:

<h1 data-sb-field-path=".title">{title}</h1>
  • No proprietary components or libraries needed

  • No need to register or wrap components as other site builders and CMS do

  • Annotations appear only in the editor so your production code stays clean

  • Controling both annotations and content models, you can decide which components can be affected by editors

Questions from the field

People ask us

So, is Stackbit a CMS? or should I bring one?

I want to use framework <X> or integrate service <Y>, do you support it?

Is Stackbit only for static sites?

Can I add Stackbit to an existing site?

Do I have to use the "preview" and "main" branches?

Can I deploy to <platform X>?

Can I reuse code via NPM packages?

Does my production site depend on Stackbit?

What happens to my site if I stop using Stackbit?