Editing interfaces

There are four ways to manage content on CloudCannon: the Visual Editor, Content Editor, Data Editor, and the Source Editor. Each editing interface is useful in different situations.

The Visual Editor#

The Visual Editor is the most intuitive way to edit content on CloudCannon. Editable elements are indicated with a yellow box. Editors can click on the element and add their new content, right on the page.

The Visual Editor also features a sidebar for managing front matter content. You can customize these inputs to give your editing team a more intuitive interface. For example, showing a date picker for a date field, adding a small comment to indicate how a field is used, or using a select box to reference other pages on the site or data in a data file.

We’ll go deeper into how to configure CloudCannon later in this guide, or if you want to skip ahead, read through the documentation on Customizing your inputs.

Content Editor#

The Content Editor is a rich text editor for Markdown files. It’s useful if you want a distraction-free, clean writing interface. It’s particularly useful for blog posts and other content with a simple layout. Note that the Content Editor view also shows the Data Editor in the left-hand panel, as pictured below.

Data Editor#

We’ve already seen the Data Editor — it’s the side bar for managing front matter in the Visual and Content Editor. The Data Editor is also used to manage content in YAML, TOML, JSON, CSV, and TSV files.

Source Editor#

The Source Editor is an in-browser code editor which is great for make small, quick changes. As with all the editors, any changes sync back to your Git repository.