Surreal CMS: The easiest way to edit a website

Surreal CMS is a great solution for freelancers, agencies, or anyone that needs to edit a website. In just moments, you can hook it up to just about any website and start editing.

How does it work?

You don't have to install anything on your server. Instead, you connect to your website using FTP, FTPS, SFTP, or even Amazon S3. Surreal CMS will publish changes directly to your server.

Once you're connected, you'll want to tell Surreal which pages to edit, then which parts of the page to edit. You can do this by adding a simple CSS class to your HTML:

<div class="cms-editable" id="some-id">
    <p>Now you can edit everything inside this div!</p>

Once you've tagged one or more regions, you'll be able to edit the page visually — yes, inline editing!

Inline editing

The best part of Surreal is the Live Editor. Your pages look just like they do on the live site, but you can actually edit the regions you've tagged inline. Check it out:

All the options you need are available in a simple toolbar, and there's no need for a full-screen mode because the entire page is your work area! Surreal's editor is ridiculously simple to use.

Great for clients

If you're a web designer, Surreal CMS is a great way to let clients edit content without giving them too much control. From your account, you can connect to multiple websites (even on different hosts), add your clients, and set permissions so they'll only see their own websites. There's even a white-label option if you want to use your own branding!

I've only covered the essentials, but there's a lot more you can do with  Surreal CMS. If you've been looking for a simple way to let clients edit their own websites without having to train them or give them too much control, here's your solution:

Disclaimer: I develop and run Surreal CMS, but I wouldn't post about it if I didn't think it was an awesome solution!

Author avatar

About the author

Creator of Surreal CMS and other web things. Follow me for tweets about JavaScript, CSS, and web programming.