Sample Site Guide

If you don't yet have a Cloud CMS account, you will need to create one: request a trial account.

You can install or re-install the Cloud CMS Sample Site at any time by creating a new project and picking "Sample Project" from within the wizard.

The Cloud CMS Sample Site provides a suite of sample data and pre-built use-cases:

• Browse the Cupcakes Catalog

  A basic product inventory system that uses classifiers to select and display content, product information, ratings and reviews within a public facing web site.

• Check out the Travel Guide

  This sample site is for managing Cities. It will show how content can be managed, and then deployed out to a hosted website in Cloud CMS.

• Deploy to the Cloud

  Deploy the pre-built web site from GitHub to our Cloud Hosting servers. Your web site will be given its own URL and will be available online in a matter of moments.

• Make updates to the Sample Web Site

  While you're free to build your front-end any way you'd like, we've provided a simplified GitHub project that you can fork and deploy. Make updates and push your changes live!

Background

This sample site is for managing Cupcake content and includes the content types for a cupcakes, reviews and reviewers. It will show how content can be managed, and then deployed out to a hosted website in Cloud CMS. We have created an html website to present the your content in a familiar setting. The html code is in github since this is a common developer practice.

• Catalog Product (Cupcake)
• Person (Reviewers)
• Catalog Product Review (Cupcake Review by a Reviewer)

View Documents and Associations

• Navigate to a Product folder (Home/Catalog/Products)
  
• Double click "Chocolate Delight" or any other cupcake
• Able to view image and metadata

Edit

• Select "Properties" from the dropdown
• Form is displayed
• Update some content in the Body field
• SAVE changes
• Content is updated and saved
• Update has been deployed to your hosted sample website. See Deployment to a hosted website

View updated Content in the deployed Website

Navigate though Cupcake sample Website

• Select "Product Catalog"
• Select the cupcake you updated
• You will see your change (you may need the refresh and clear Cache to see any updates)

Add a new piece of content

• Navigate to a Product folder (Home/Catalog/Products)
• In the Actions dropdown select "Create a Document"
• Choose Content type: select "Catalog Product" for Cupcakes
• The default content entry form is displayed for "Catalog Product"
• Enter content in the fields
• Save
• Add an image
• Open up the newly created cupcake
• Select "Upload Attachment" in Document Actions
• Either drag and drop a file or use the file selector

Background

This sample site is for managing Cities. It will show how content can be managed, and then deployed out to a hosted website in Cloud CMS. We have created an html website to present the your content in a familiar setting. The html code is in github since this is a common developer practice.

• Guide City (Cities)

View Documents and Associations

• Navigate to a Cities folder (Home/Samples/Guide/Cities)
• Double click "Barcelona" or any other City
• Able to view image and metadata

Edit

• Select Properties from the dropdown
• Form is displayed
• Update some content in the Body field
• SAVE changes
• Content is updated and saved
• Update has been deployed to your hosted sample website. See Deployment to a hosted website

View updated Content in the deployed Website

Navigate though City Guide sample Website

• Select "City Guide"
• Select the city you updated
• You will see your change (you may need the refresh and clear Cache to see any updates)

Add a new piece of content

• Navigate to a Cities folder (Home/Guide/Cities)
• In the Actions dropdown select "Create a Document"
• Choose Content type: select "Guide City" for Cities
• The default content entry form is displayed for "Guide City"
• Enter content in the fields
• Save
• Add an image
• Open up the newly created City
• Select "Upload Attachment" in Document Actions
• Either drag and drop a file or use the file selector

A hosted sample website has been created for you within Cloud CMS. The default deployment can be found in: Manage Project -> Applications -> Sample Web Application

• Double click the "Sample Web Application"
• Select "Deployments"
  
  
• Select the default deployment and select "Deploy" from the dropdown.
• It will look something like http://391e7601-93e4-4cb4-abf5-8419845cdb06-hosted.cloudcms.net
• Click the URL to go to the deployed Sample Website (wait a minute or 2 after clicking deploy)

• The path is set in Applications -> Source
• For the Sample site we have placed the html in Github
  • https://github.com/gitana/cloudcms-sample-website.git
• You have access to the code in Github so you are free to fork it, extend it and dig into it to learn about how it works.

The Sample Site content provides a great starting point for building your own apps. If you've got a front-end going and you want to get at some good content, then we encourage you to go for it! Query against it, search for it, retrieve it, create new content - anything you like.

To connect, all your need to do is get the developer API Keys for connecting to your Cloud CMS Application instance. You can do this by logging in to Cloud CMS and clicking on the Developers link at the top of the page.

Once you have those keys, please read through the Developers Guide. We've provided guidance for building your first apps on top of Node.js, JavaScript, React, Vue.js and many other frameworks.

We recommend you do the following with the Sample Site:

• Navigate and go crazy with updates
• Note: there are no guarantees the sample website will work with all your changes. Potentially you may need to modify the frontend html code
• Review the content types, forms, application configuration, frontend code
• Let us know if Cloud CMS may be a fit for you and you need help with your solution

Once you've done all that, be sure to check out these useful links:

• Videos
• Documentation
• Developer Guides