How can a business owner update a static site themselves? (Adding a CMS to a static site)

How it works

• You add data-cms attributes to the HTML. The text already inside each element is the default
• schema.json declares which fields exist. The dashboard shows exactly those fields to the owner, and nothing else
• Values are inserted as text before the page is delivered, so search engines see the updated content. Editors' input can never inject HTML or scripts
• If the CMS can't be reached, the HTML text you wrote is shown as is. The site never goes down because of the CMS

Steps

1. Add the script tag

<script src="https://cdn.siteon.dev/sitekit.js" data-site="hanaya" defer></script>

2. Mark the editable areas

<dl>
  <dt>Open</dt>
  <dd data-cms="hours.days">Mon–Sat</dd>
  <dt>Hours</dt>
  <dd data-cms="hours.time">10:00 - 18:00</dd>
</dl>

<!-- A news list: the template repeats for each item -->
<ul class="news">
  <template data-cms-list="news" data-cms-limit="3">
    <li>
      <time data-cms="date">2026-01-01</time>
      <span data-cms="title">Article title</span>
    </li>
  </template>
  <template data-cms-empty="news"><li>No news yet.</li></template>
</ul>

3. Declare the fields in schema.json and apply it

{
  "locales": ["en"],
  "groups": [
    { "key": "hours", "label": "Opening hours", "fields": [
      { "key": "days", "label": "Open", "type": "text" },
      { "key": "time", "label": "Hours", "type": "text" }
    ] }
  ]
}

Lists such as news are declared under collections (see Writing schema.json).

siteon schema push --site hanaya

4. Publish, and invite the owner

siteon deploy ./dist --site hanaya

In the dashboard, invite the owner by email as staff of that site. Staff can edit content and read inquiries for their own site only. They never see billing or your other sites.

Three ways to deliver the values

What it costs

There is no charge per editor. On Free, editing works on development and preview domains and on its Siteon hosting subdomain (<name>.siteun.com). Custom domains need a paid plan.

Limits and what's coming

• Only the areas you mark can be edited. Layout and design changes still happen in the code
• data-embed replaces the contents of body after load, so avoid it on sites with their own JavaScript. Use Siteon hosting or the relay instead
• Your own domain with Siteon hosting Soon

Related docs

• Editable area markers (CMS): text, photos, lists, article pages, multiple languages
• Writing schema.json
• Hosting and delivery