Tutorial: Set Up a Client's Site to be Editable with Cushy CMS

If you design websites for clients you know that most clients these days want the ability to update the site themselves. Fortunately, content management systems make this possible. However, depending on the types of clients that you work with, you may find that sometimes going with a full-feature CMS is overkill for a client that only needs to update a few pages.

Each client has there own unique needs, and there may be times when you come across someone who is not interested in anything fancy, but they want a small website that will allow them to change the content of pages.

I do a good bit of work with WordPress, but for clients in this situation it’s not the best solution. Several of the non-tech-savvy clients that I’ve worked with have been intimidated by all of the options in WordPress, especially when they have no use for many of them.

For situations like this, Cushy CMS is an excellent option. With Cushy CMS you can easily give clients the access and ability to change content of a specific number of pages without everything else that they won’t need.

In this post we’ll walk through the process of setting up a website for a client to allow them access for editing. The basic version is of CushyCMS is free, and they also offer a pro account for $28 per month that gives you a branded version of the system so your clients won’t even know that it’s Cushy CMS. Everything we’ll be doing here is using the free version.

To put this into a real-world perspective, let’s assume the client is a service provider that needs a just a small website, maybe 5 pages, with basic information about the company and its services. There’s no need for them to be able to add new pages at this time, they just want to be able to keep the site up-to-date when information about the company changes.

For the purposes of this tutorial I decided to get a template from Theme Forest to use as the client site, and I’ve uploaded it to my site (of course, in the real world this would be at the clients URL, but for this tutorial we’ll just keep it at this domain). The template I’m using is Clean Biz.

Clean Biz Theme

Throughout the tutorial there will be many screen shots. If you want to see the full-size version, click on the screen shot.

Step 1: Create Your Account

If you have never used Cushy CMS before, you’ll need to create an account. With the account you’ll then be able to set up clients as “editors” and assign them the rights to edit their site. Creating the account is very easy, just go to the sign up page and enter your name, email and password.

Step 2: Add Site

Once you’re logged in, you’ll see the options to add a site or add an editor.

Cushy CMS

To start with, we’re going to add the site, so click on the “Add Site” button. On the next page you’ll enter the client’s URL and their FTP data. If you don’t have this information, you’ll need to get it from the client before you can get everything set up. Next to the “Path” field, click “Choose” and find the root folder. When you’re done, click on “Add Site” and it should tell you that it was a success.

Cushy CMS

Step 3: Assign Some Pages

Now that the site has been successfully added, we’re going to assign 3 pages that the client will be able to edit. Of course, you can do more or less depending on the clients needs. We’re going to assign the home page, about page, and services page. To do this, click on the link that says “Assign pages to site” (below the domain).

Cushy CMS

To do this you’ll enter the full URL of the page, give it a name that the client will understand, and select the path to the specific file as it is located on the server.

Cushy CMS

Now, repeat this step for however many pages you want to assign. In this case, I have done this for the home page, about page, and services page.

Step 4: Assign Editor

Now that we have the site and pages added, we’ll need to give the client access to these pages. As the designer, you’ll have access to everything that you set up, but you’ll be able to assign each client to specific sites. So if you have multiple clients using Cushy CMS, you’ll be able to access all, but they’ll only be able to access their own sites and pages.

After you complete step 3 you’ll be on a page that looks like the screen shot below. Click on the green button for “Add Editor.”

Cushy CMS

Here you’ll enter the client’s name and email address (they’ll be emailed the login information) and choose which sites and/or pages the editor will have access to. In this case we’re choosing all three of the pages that have been set up. When you’re done, click “Add Editor” at the bottom of the page.

Cushy CMS

After you’ve added the editor, you will see a message stating that it was a success. Now click on a link to one of the pages below. You’ll get an error message telling you that no editable elements have been defined. Cushy CMS works very simply. If an element, such as a div for example, has a class of “cushycms”, it will be editable. Nothing else will be editable. So, since we’ve uploaded a standard template we need to also add some classes to each of these pages to allow editing.

Cushy CMS

Step 5: Add cushycms Class

We’ll open up the index.html file and add a class  (class=”cushycms”) to the content div that contains all of the content in the main area of the page. You can also add title elements to make it more organized when editing, so we’ll add title=”home content”. Make sure that you add the class to an element that contains everything that needs to be edited. You can add multiple classes per page.

Cushy CMS

We’ll also do the same thing for the about page and the services page, and we’ll upload all of these pages to the server. I’m also going to add the class=”cushycms” to the sidebar of the services page so that we’ll be able to change the photo. (click on the image below to see a larger version). Now that the class has been entered, we’ll be able to edit anything that is in the content div. Back in Cushy CMS, click the try again button.

Step 6: Edit the Content

Now, we’ll select the services page from the list of pages that have been set up, and you’ll be able to edit.

Cushy CMS

You’ll notice here that it keeps the h2 tags and paragraph tags in tact. All of this is editable. New headers can be added, bold or italics can be applied to text, links can be added, etc. The basic functions you would expect are all there.

We’ll change the h2 tags to give specific information rather than Service 1, etc. We’ll also apply bold to a few words and insert a link.

Cushy CMS

When you’re done, click publish page.

Here is what the services page looked like before the edit.

Cushy CMS now interacts with the server and the changes will take effect. Below is a screen shot of the page after it has been edited.

Cushy CMS

Step 7: Change the Photo

It’s also nice for clients to be able to change photos from time-to-time, and since we added the cushycms class to the containing div, we’ll be able to update the photo in the sidebar of the services page.

So, we’ll choose the services page from the dashboard and we’ll see something like the screen shot below.

Cushy CMS

Now, if you click on the image to select it, and click on the button to add or edit an image (it’s a picture of a little tree next to the “insert table” option), you’ll be able to upload a photo to the server and add it to the page. Alternatively, if the image you want is already on the server you won’t have to upload it.

Cushy CMS

Click on the upload tab and browse to find the image that you want and click “send it to server.” The image is now uploaded and plopped in that spot of the page. Choose a width and enter it, the height will automatically be adjusted (or vice versa). Click “ok” and you’ll see the change.

Cushy CMS

We’ve now been able to update the text and the photo of the page.

Cushy CMS

In this case I have worked through the process while being logged in as the designer, but the client would be able to do the same things after they get their login information by email. So now they have a small website that they can easily maintain on their own without any technical knowledge.

At the Cushy CMS homepage they also have a brief video that walks you through the process, so be sure to check that out if you have any interest in using the CMS.

Published January 15th, 2009 by

Looking for hosting? WPEngine offers secure managed WordPress hosting. You’ll get expert WordPress support, automatic backups, and caching for fast page loads. Visit WPEngine.

Join Our Newsletter!

Subscribe to our weekly newsletter chalked full of useful tips, techniques, and design goodies. We have 20,000+ loyal readers and counting! We’ll even send you a free e-book (Freelance Designer’s Guide to Multiple Income Streams) and a $10 discount on our most popular product the Freelance Starter Kit.

60 Responses

Comments are now closed on this post.

  • joyoge designers' bookmark, January 16, 2009

    nice tutorial and useful cms thanks..

  • acidcloud, January 16, 2009

    This is extremely helpful and will make it easy for clients. It’s a really easy process too, I thought it was going to be more complicated to set it up but it’s not.

    The website has a nice interface too.

    Great tutorial, and thanks for another great post!

  • KDC, January 16, 2009

    What? I have to host it with them? No good.

  • Raymond Selda, January 17, 2009

    CushyCMS has been around for a long time but I don’t know if they got the exposure they needed.

    This article will definitely help in pushing Cushy forward. Thank you.

  • Mayur, January 17, 2009

    WOW. I have the same problem you do with WordPress. Updating the site can be a pain for clients. Cushy looks AWESOME! Thanks for the tutorial. Keep it up!

  • Vandelay Design, January 17, 2009

    KDC, no, you don’t host it with Cushy CMS. You just have to use FTP through their site.

  • lindkold, January 18, 2009

    I have a problem when choosing “path” and having to pick a root folder since fx. my index-site isn’t in a root folder.
    Cushy doesn’t give me the option not to choose a folder.. I wouldn’t like to put fx. my index.html file inside another folder…

    What is the solution to this..?

    lindkold

  • lindkold, January 18, 2009

    found it…

    Just use type / when choosing root-folder.

    Lindkold

  • Julia, January 19, 2009

    Really interesting tutorials! Clients wanting more and more self-control about their sites, so this method with Cushy CMS shows a real understandable way of making it a succeed and painless doing it for them. Thanks a lot for declaring it with this common example! :-)

  • mt, January 19, 2009

    sweet! finally simple solution to edit my site :) thanks!

  • Peet, January 20, 2009

    nice tutorial and useful cms thanks..

  • Peet, January 20, 2009

    The website has a nice interface too.

  • denis, January 21, 2009

    very nice and useful tool, thanks for this tutorial

  • EB, January 21, 2009

    Thank You So Much for posting this!

    I have been racking my brain trying to find this CMS for the past week and could not find it in Google or Lifehacker.

    I saw it in your RSS feed today and thank GOD.
    Now I can use it for the client I’ve been wanting.

    Thanks Again! Great timing. :-)

  • Darryl, January 22, 2009

    I have been using this on several clients pages, and it does what it needs to, straight forward, and serves its purpose without the complications.

  • Anja, February 12, 2009

    Just one word to describe this…..fantastic!!!!

    I’ve been doing CMS research for many weeks and experienced a lot of frustrations figuring out how most of them work, and how I can implement them with existing sites I’ve done for clients.

    I almost gave up hope until I stumbled over Cushy CMS. At first I was very sceptic, just because it sounded to good to be true. But then I read more and more blogs about this service and everybody raved about it. So I gave it a try and I must say I’m very satisfied. It took me about 10 minutes to set up a 10 page site. No coding, no installations, no configurations….wow!!!!!!!

  • design247, April 3, 2009

    Your tutorial is just great, but I can’t get access to the server to include a site on Cushy CMS, even with the appropriate passwords, I get error 530. Help appreciated.

  • Vandelay Design, April 3, 2009

    design247,
    I’m not sure what you mean you can’t get access to the server. Are you saying you can’t get logged in to CushyCMS? If so, you would have to contact them for help.

  • Heather Brady, April 15, 2009

    Thanks for the tutorial! Love the idea. I was Googling Cushy and happened to find Surreal CMS? Is it similar?

  • Vandelay Design, April 16, 2009

    Hi Heather,
    I just came across Surreal CMS the other day and it looks identical. it’s probably the same system.

  • Kat, April 22, 2009

    I had trouble with Cushy not getting FTP access to my hosts servers. I found Surreal CMS and it works perfectly with all my hosts servers. I’d definitely recommend Surreal CMS if you’re having problems with Cushy. I’ve also been told to check out Clover Content. Has anyone tried this?

  • Martin Hemmer, July 12, 2009

    one more nice topic in your blog and nice comments too keep it up, If you advise some more related links to topic. I’m very interested in CMS and all its related subjects.

  • York website Designers, July 14, 2009

    I have just had a client wanting to be able to edit his site and nearly told him it was not possible unless he had money to burn. This seems a great compromise, the only problem is I now he will want to add new pictures and pages and not just change exsisting. I’m gonna try and see if he’ll give it a go as I know for a fact that he’ll soon get board of updating it himself, meaning he will not have wasted a fortune if he goes down he cms route.

  • Corr!e, August 12, 2009

    Hi, This looks great….just one question tho…

    My website is very simple except there is some simple Javascript which allows 3 images to fade between each other. Is there any way the client could change or add images to this array or is that too complex for Cushy??

    Original Javascript code for slideshow came from:
    http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm

    Thanks

  • Vandelay Website Design, August 12, 2009

    Hi Corr!e,
    It’s been a long time since I’ve used Cushy CMS, but I don’t think the client could make these changes. It looks like the Javascript that would need to be changed is in the page head, and I don’t believe that you can edit anything in the head tags with Cushy CMS. I think it has to be contained within a div with the class “cushycms”, and since this code is in the head tag it would not be in a div.

  • Corr!e, August 12, 2009

    Hey, thanks for your quick reply :)
    Yeah, that makes sense now. Such a shame….sounded perfect til then!

    Guess I’ll go do some research on the other CMS systems but this tut has renewed my hope and cushy may be just the right thing for another day

    Thanks again for your help

  • Eric, September 21, 2009

    I never tryed cushycms but i saw the video in the official website and i read and this article. The question is how someone can create forms in this system? do we need to do the forms with the php codes like in the simple css/xhtml websites ? or is any other way?

    Thanks in advance
    Eric

    • Vandelay Website Design, September 21, 2009

      Eric,
      There is no way to create forms using CushyCMS (that I am aware of). Yes, you would just create them like you would for any other website.

  • Durry, October 7, 2009

    Hi

    Do I have to assign editable tags before I try add pages?? This is the error (below) when I try add pages in step 3…Before I can get to assign editor?

    1 error prohibited this Page from being saved
    Content www/ogopogobedandbreakfast.ca/index.html has no editable elements defined.

    bit confused…

  • Durry, October 7, 2009

    Thanx mate, will do.

  • sabrina, October 13, 2009

    Your tutorial is great!

  • Russel Tucker, November 13, 2009

    I’d like to see a writeup like this for Surreal CMS.

  • OpenSoft, January 31, 2010

    Great tutorial.
    I have a question, though…

    Isn’t CushyCMS a hosted solution?
    And wouldn’t that make kinda risky to your customer?
    What if Cushy, as many other hosted solutions have done in the past, simply folds down and dies?
    Where would that leave your customer?

    • Vandelay Website Design, January 31, 2010

      OpenSoft,
      If CushyCMS were to close up shop, customer sites wouldn’t disappear because they are hosted with another company (whoever you choose as your host). Customers wouldn’t be able to edit the site through CushyCMS anymore, so you would have to move to another option, but some competitors, like Surreal CMS, have an easy way to migrate from CushyCMS. So, yes there is some risk involved, but not that much.

  • OpenSoft, January 31, 2010

    Good point.
    I still feel a little uneasy about putting my customers through tha risk. This could be easily solved if the guys at Cushy would SELL a selfhosted version.
    I would buy it.

    Cheers, and keep up the good work, we love your Blog down here in Brazil.

  • James T, February 11, 2010

    I still wonder why so many people are still doing write-ups about Cushy. It amazes me! Admittedly, I was a huge Cushy fan for like six months, and then I found Surreal. In short, Surreal CMS has blown them away with features and support (CushyCMS doesn’t even offer email support to free accounts). Cushy seems to have dropped the ball with development almost entirely.

    If you’ve ever used it, Surreal is way better, plain and simple. Are they the same system? No, but the class=”cushycms” is the same (Surreal uses class=”editable” instead). Other than that, almost everything is different in a good way. It’d be great to see a tutorial for Surreal for once. At least they still release updates and features and are active on Twitter.

    • Vandelay Website Design, February 11, 2010

      James,
      This post is over a year old. And like you, I had never heard of Surreal CMS when the post was written.

  • James T, February 15, 2010

    Thanks for the response, VWD. I didn’t realize it was as old as it was…I thought it was last month!

    Anyways, how about a Surreal tutorial :D

  • Jeff S, July 16, 2010

    A good overview/tutorial of Surreal is here: http://net.tutsplus.com/tutorials/cmss/a-15-minute-surreal-cms-integration/

    Both Cushy and Surreal are great for their ease of setup and their ability to easily define “editable” regions, so that a client can not accidentally break the page layout etc.

    In both cases the WYSIWYG editing icons (replace image, edit link, etc) are not super-obvious; a client will need at minimum a brief introduction to the editing tools. Like anything, the client’s results and frustration will vary based on how technical-minded they are.

  • Alfire, November 3, 2010

    is there a local solution for “editable” regions?
    a very light cms/editor to install on my server for change images like cushy?
    thanks

  • Berns, February 17, 2011

    Great tutorial, thanks! I have a question:

    For a website with the dead centered layout in which all the content is contained within the container div so that the content always appears neatly in the center of the page (no scrolling down), can you set the limit in the number of characters in the editable region so that the client does not add content (text) to the extent that it expands the container size? I’m not sure if my question is clear… Hope you can help.

    Thank you.

    • Vandelay Website Design, February 17, 2011

      Hi Berns,
      Your question is clear. As far as I know you cannot limit the editable region in that you. You may want to check with Light CMS to be sure.

  • Berns, February 17, 2011

    Thank you for the response! I’ll check with Light CMS.

  • Laura, February 19, 2011

    I’m trying to set up CushyCMS so a client can edit a WordPress page, but I get an error when assigning the page, saying it’s not readable or has wrong permissions. But maybe it’s not possible? I’m not sure how to do this and would very much appreciate any tips. Thanks!

    • Vandelay Website Design, February 21, 2011

      Laura,
      I don’t understand why you would use CushyCMS so a client can edit a WordPress page. Why doesn’t the client just use WP to edit the page?

  • Laura, February 21, 2011

    Hi – because these particular users are not computer-savvy. They will not be able to properly format their entries. I know it seems silly, but trust me, I know from long experience that would be asking for trouble.

    I have been searching for two months for a way to give them a form to submit with no success, and a friend mentioned the CushyCMS possibility, which would be a sort of different approach but seems workable.

    I just need to know if it’s possible and if so, how would I do it? Thanks for any further help you can provide.

    • Vandelay Website Design, February 21, 2011

      I have no idea if it can be done or not. That’s not really how either system is made to be used, so if you’re getting errors I would guess that it can’t be done. You could always contact CushyCMS and see what they say.

  • Laura, February 21, 2011

    Thank you very much, I will do that right now. :)

  • SarahP, December 10, 2012

    Are you able to use this within a .dwt file? My client will want to update a div that is dedicated to montly promotions that is located on all pages. I just need to make sure it will still work. If not, do you have any suggestions?

    • Steven Snell, December 11, 2012

      SarahP,
      It’s been a really, really long time since I used Dreamweaver template files, so I’m not sure how they even work in the current version of Dreamweaver. I would think that you could do it, but I can’t say for sure. I’d recommend that you check with CushyCMS’s support. You could always sign up for a free account and try it on a test site.

  • Stefan, February 13, 2013

    You may also want to try competing service http://www.siteblade.com, which is unlike cushy free even if you have more than 5 websites. And has nicer customer support – me :).

  • Alies, July 19, 2013

    Hi there, we would appreciate some technical support,once logged in we cannot access any pages to update text and have no idea how to gain Cushy support to clarify the error- ‘unable to contact the host site’..any tips!!thank you