How to Add a CMS to an HTML Website

· Sitecake

You have a working HTML website. It looks the way you want it, it loads fast, and you know exactly how it's structured. Now a client needs to be able to edit the content themselves — and suddenly you're looking at rebuilding the whole thing inside WordPress.

There's a better way. You can add a CMS to an existing HTML website without touching the design, without learning a new templating system, and without setting up a database.

The problem with adding a CMS to HTML

Most content management systems are built to generate HTML — not work with it. WordPress, Drupal, Craft, and similar platforms all require you to import your design into their templating engine. That means recreating your layout in PHP templates, installing a theme framework, configuring plugins, and standing up a MySQL database.

For a brochure site or a small business website that only needs occasional content updates, that's a significant amount of rebuild work. You're essentially throwing away the site you've already made.

The alternative is a CMS that works the other way around — one that layers onto your existing HTML instead of replacing it.

How SiteCake drops onto existing HTML

SiteCake is a flat-file CMS that attaches to your HTML files directly. Instead of generating pages from templates, it reads your existing HTML, lets users edit the marked-up regions, and writes changes back to the same files.

The only change you make to your HTML is adding a CSS class to the elements you want to make editable: 

<div class="sc-content">
  <h1>Our Services</h1>
  <p>We help small businesses...</p>
</div>

That's the entire integration. Everything else — your layout, your CSS, your navigation, your footer — stays exactly as it is. SiteCake never touches anything outside those marked regions.

Step by step: adding SiteCake in five minutes

  1. Add sc-content class to any <div> you want clients to be able to edit. You can have multiple editable regions per page.
  2. Download SiteCake from sitecake.com/pricing.html. The package contains one PHP file (sitecake.php) and one folder (sitecake/).
  3. Upload both to your web root — the same folder that contains your index.html. No database setup, no configuration file editing required.
  4. Open the editor by pointing a browser to yourdomain.com/sitecake.php. Log in with the default password (admin) and change it immediately.
  5. Start editing — click on any text in a marked region to edit it. Drag images from your desktop. Hit Publish when done.

The server requirement is PHP 7.4 or higher, which virtually all shared hosting plans include. No MySQL, no Redis, no additional packages.

What becomes editable

Inside any sc-content region, clients can:

Editing is done directly on the live page — there's no separate admin panel. The client sees the page exactly as visitors see it and edits it in place.

What stays protected

Anything outside the sc-content regions is completely off-limits. Navigation, layout structure, CSS classes, the footer, tracking scripts — none of it can be accidentally modified. This is the most important difference from systems that give clients access to a full admin panel.

You decide exactly what's editable by choosing which divs get the sc-content class. A typical setup marks the main content area as editable and leaves everything else alone.

How publishing works

Edits are saved as drafts in a temporary directory until the client clicks Publish. On publish, SiteCake writes the content back to your HTML files and copies uploaded images to your images folder. A backup is created automatically before each publish.

Once the client logs out, the site is plain static HTML again — no server-side processing on page loads, no database queries. SiteCake is only active when someone visits sitecake.php.